"What is Flutter and how do I get started building apps with it?" are questions that students came with to the Virtual Flutter Meetup. At the meetup, app development and front-end design was introduced by showing example of screens of various apps that have very similar UI components.
Next, Flutter was introduced. Flutter is a cross-platform framework that allows the rapid development of apps using Dart, a language built by Google that uses syntax similar to Java/C++. It uses a hierarchal approach to organizing each part of the screen using widgets. Interestingly, each part of the screen is widget, from buttons to appbars.
This makes it simple to visualize how widgets on the screen are displayed, going from wireframe to app, and easier debugging. Here is an example of a navigation bar at the bottom of an app and how it can be synthesized into its individual components.
The Flutter Documentation has many widgets documented that show the implementation and usage of each widget, which for both beginners and experienced individuals is very helpful. For Dart, like any new language, it takes time to get used to it, but the readability of the code and understanding what widgets a screen contains is helpful in the beginning.
Then, the interaction of the widgets themselves was explored through the introduction of Stateful and Stateless widgets. In most apps, there are both dynamic (changing) and static (does not change) parts of the app.
A Stateless widget example is a block of text that informs the user, which doesn't cause changes that reflect in what the user sees, therefore static and has only one constant state.
On the other hand, a Stateful component would be a screen with buttons that change the color of the screen. This is Stateful because the button click would trigger the screen to change color and therefore the state of the screen component would refresh. This idea is critical as knowing if a component is dynamic will change how the state needs to change and the UI needs to change.
With the main concepts covered, the meetup concluded in setting up the Flutter environments, following the Flutter Installation instructions, on attendees' computers.
Overall, the meetup acted as an introduction to basic app development ideas using Flutter. Stay tuned for the next Flutter meetup where attendees will make a basic shopping list app!