Flutter BootCamp Vadodara – Week 4

Flutter is a mobile app SDK for building high-performance, high-fidelity, apps for iOS and Android, from a single codebase.

The goal is to enable developers to deliver high-performance apps that feel natural on different platforms. We embrace differences in scrolling behaviours, typography, icons, and more.

Why use Flutter?

What are some advantages of Flutter? It helps you:

  • Be highly productive
    • Develop for iOS and Android from a single codebase
    • Do more with less code, even on a single OS, with a modern, expressive language and a declarative approach
    • Prototype and iterate easily
      • Experiment by changing code and reloading as your app runs (with hot reload)
      • Fix crashes and continue debugging from where the app left off
  • Create beautiful, highly-customized user experiences
    • Benefit from a rich set of Material Design and Cupertino (iOS-flavor) widgets built using Flutter’s own framework
    • Realize custom, beautiful, brand-driven designs, without the limitations of OEM widget sets

Core principles

Flutter includes a modern react-style framework, a 2D rendering engine, ready-made widgets, and development tools. These components work together to help you design, build, test, and debug apps. Everything is organized around a few core principles.

Everything’s a Widget

Widgets are the basic building blocks of a Flutter app’s user interface. Each widget is an immutable declaration of part of the user interface. Unlike other frameworks that separate views, view controllers, layouts, and other properties, Flutter has a consistent, unified object model: the widget.

A widget can define:

  • a structural element (like a button or menu)
  • a stylistic element (like a font or color scheme)
  • an aspect of layout (like padding)
  • and so on…

Widgets form a hierarchy based on composition. Each widget nests inside, and inherits properties from, its parent. There is no separate “application” object. Instead, the root widget serves this role.

You can respond to events, like user interaction, by telling the framework to replace a widget in the hierarchy with another widget. The framework then compares the new and old widgets and efficiently updates the user interface.

Composition > inheritance

Widgets are themselves often composed of many small, single-purpose widgets that combine to produce powerful effects. For example, Container, a commonly-used widget, is made up of several widgets responsible for layout, painting, positioning, and sizing. Specifically, Container is made up of LimitedBox, ConstrainedBox, Align, Padding, DecoratedBox, and Transform widgets. Rather than sub-classing Container to produce a customized effect, you can compose these, and other, simple widgets in novel ways.

The class hierarchy is shallow and broad to maximize the possible number of combinations.

You can also control the layout of a widget by composing it with other widgets. For example, to centre a widget, you wrap it in a Center widget. There are widgets for padding, alignment, row, columns, and grids. These layout widgets do not have a visual representation of their own. Instead, their sole purpose is to control some aspect of another widget’s layout. To understand why a widget renders in a certain way, it’s often helpful to inspect the neighbouring widgets.

Layer cakes are delicious

The Flutter framework is organized into a series of layers, with each layer building upon the previous layer.

Date and Time: July 7, 2019 – 1000 to 1830 IST Hours.

Venue: Navrachana University, Vadodara

Attendees: 20

Personal Note:

Flutter Boot-Camp Vadodara is a joint alliance of DSC SVIT & DSC PU. The maxim of the boot-camp was to edify the audience new technologies like FLUTTER and DART made by GOOGLE and its benefits in building cross-platform apps and we were flabbergasted by the response we got in return which was simply an eye-opener.

HACKATHON DAY!

So starting with week 4, it was HACKATHON time! Participants were asked to put all their Flutter and Dart prowesses that they have assimilated and developed in past 3 weeks. And, hell they were excited to dive deeper into the Flutter-verse and to scrutinize it so that they can build their first Flutter app. Many of the participants were building their first application ever and they were so hot to trot.

And yes as it was a Hackathon, we definitely had some mentors among us to guide the participants and to share their experience with us. So we invited 4 mentors to usher us and the participants and it was really a privilege to have them alongside us and we got so much to learn. Our first mentor; Dhrumil Shah who is one of the latest addition to our Google Developer Experts India and who’s also a Flutter Expert. Our second mentor; Pranshu Khanna who is a Mozilla Representative and is also the lead of Mozilla Gujarat. Our third mentor; Hardik Mistry who is a Microsoft MVP of India and also the founder of Appmatic firm. Our fourth and the final mentor; Bhavik Makwana who is a Google certified Android Developer and also a Flutter Expert.

Below given are some stills of the mentors introducing themselves and sharing their experience and imparting us with the knowledge in the course of their journey.

Hardik Mistry addressing to the audiences.
Dhrumil Shah introducing themselves to audience and sharing his experience.
Bhavik Makwana enlightening the participants with his knowledge in app development.
Pranshu Khanna giving a brief introduction about himself and informing the participants about how a Hackathon works.

So, then we began our Hackathon by giving out some instructions and the dos/don’ts of the competition. Then we announce the themes of the hackathon which were:

  1. Social Well-being
  2. Transportation
  3. Social Welfare

And then a time of 6 hours was given to the participants to build an functioning application having a beautiful UI on the choices of the theme they like. Also, they were asked to make a presentation regarding the product that they will make.

DASH here being a fair judge.

Participants discussing among themselves and pondering over their product.

The first coding session of the Hackathon was of 3 hours and then a break was allotted to the participants to freshen themselves up and to fill up their appetite.

And Subway came as our wing-man!

Then the next coding session of the Hackathon resumed and the participants were clear by now what they were doing and also our mentors were being supportive and were helping them out with their difficulties.

After such a heavy 6 hours of coding session and brain-storming, it was time for the presentation of the products that all the various teams have built and then on the basis of which the winner will be decided.

Team “Ministry of Wizards” on the stage giving their presentation.
Team “The Avengers” on stage with the best presentation and the product.
Another team “Tech Youngs” presenting their product “Friend Ride”
Team “Legions” on stage giving their presentation.
Team “Mogilla” with their presentation on the them Social Transportation.

After all the presentations were done, the mentors were really bewildered as whom to declare the winner because all the projects were unique in its own way and were having beautiful lucid UI. But, after a lot of discerning discussion, they were finally able to pick the right team as the winner.

Team “The Avengers” were declared as the winners and won a “Flutter Arsenal” t-shirt and stickers and an Amazon voucher
Team “Ministry of Wizards” were the runner-ups and they won the “Flutter Arsenal” t-shirts.
Team “Tech Youngs” won the FLUTTER and DASH badges for the unique idea.
Jatin Hirapara was the MVP of our boot-camp as he was being the most active participant.

After the prize distribution, it was time to present our mentors for the day with a token of gratitude for sharing their time, knowledge and experience with us and also to give us some cool swags.

Ayush Bherwani; one of the organizers of the Boot-camp presenting the memento to our mentor Dhrumil Shah.
Harshil Agrawal; one of the organizers of the Boot-camp presenting the memento to our mentor Bhavik Makwana.
Pratik Parmar; one of the co-organizers of the Boot-camp presenting the memento to our mentor Hardik Mistry.
Pranit Brahmbhatt; one of the organizers of the Boot-camp presenting the memento to our mentor Pranshu Khanna.

And then finally our boot-camp ended with a networking session, where everyone finally said their goodbyes to each other as it was the last day of the boot-camp. And now these memories will be with us for eternity.

All the organizers and volunteers with the mentors.

So summing it all up, Pranit Brahmbhatt and Arpan Patel took sessions on Dart in week 1 and showed the attendees how to play with it. In week 2, Ayush Bherwani and Dilum De Silva showed all the participants how to flirt with Flutter. In week 3, we covered some important topics like API calls in Flutter, NoSQL vs SQL and Firebase with Flutter with Pooja Bhaumik; GDE for Flutter helped us get through it. And in week 4, we concluded our boot-camp with a HACKATHON alongside some great mentors!

And this is how everyone reacted on Twitter on the last day of our boot-camp. Thanks for so much love!

No comments yet

Post a comment

Leave a Reply

Your email address will not be published. Required fields are marked *