Four fast tips to organize your Flutter code with Jetspike

1. Use embedded widgets

To avoid complicated deeply indented widget trees, we separate logical parts of the app into individual widgets. In the following example, the ContactForm is created as a widget and then included into AboutUs screen.

AboutUs screen (left), ContactForm widget (middle) and the embedding of ContactForm (right)

2. Provide values dynamically

Each widget can have it’s set of parameters. Here we define a ArticleDetail widget and then use it to display different articles of an author.

Dynamically filled articles overview (left), parameters of ArticleDetail widget (middle) and the generated code (right)

3. Utilize the ‘Extract as new widget’ function

To see how everything fits together, develop your components within the parent widget tree and the use the ‘Extract as new widget’ button in the top right corner to turn them into reusable widgets.

Extract as new widget

4. Experiment with different widget types

Jetspike can generate stubs for StatefulWidget, StatelessWidget or widget tree returning functions. Just select the right option and the code generator handles everything automatically.

Picking the widget type (left), generated code for StatefulWidget (middle) and StatelessWidget (right)

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Martin Černý

Martin Černý

Life hacker, former software developer, medical school graduate, surgeon and Ph.D. student. Founder of jetspike.com.