Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Flutter Study Jam: let's build together an app for the GDG Venice

Flutter Study Jam: let's build together an app for the GDG Venice

A brief introduction to the Flutter framework before starting a codelab where an app for GDG Venice will be built starting from a custom skeleton,

The skeleton is available on Github together with 3 sample applications: a hello world, a bottom navigation bar example, and a list view example.

https://github.com/GDG-Venezia/flutter-study-jam

Marco Gomiero

October 01, 2019
Tweet

More Decks by Marco Gomiero

Other Decks in Programming

Transcript

  1. Flutter is Google’s UI toolkit for building beautiful, natively compiled

    applications for mobile, web, and desktop from a single codebase. https://flutter.io/
  2. What is Flutter? • A toolkit to build apps for

    mobile, web, and desktop, from a single codebase • Made by Google
  3. What is Flutter? • A framework to build apps for

    mobile, web, and desktop, from a single codebase • Made by Google • Open Source • Dart
  4. Fast Development • Hot Reload • State is maintained during

    builds • Thanks to a mix of Ahead-of-time (AOT) and Just-In-Time (JIT) compilation
  5. Expressive and Flexible UI • Material Design and Cupertino widgets

    • Smooth scrolling • Platform awareness
  6. Native Performance • Native Scrolling • Native Navigation • Native

    Icons • Native Fonts -> Full Native Performance
  7. Flutter Framework and Engine Framework (Dart) Engine (C++) Skia Dart

    Text Material Cupertino Widgets Rendering Animation Painting Gestures Foundation
  8. Everything is a widget! • Structural Element (Button, Menu …)

    • Stylistic Element (Font, Color Scheme ..)
  9. Everything is a widget! • Structural Element (Button, Menu …)

    • Stylistic Element (Font, Color Scheme ..) • Aspect of Layout (Padding, Align ..)
  10. Everything is a widget! • Structural Element (Button, Menu …)

    • Stylistic Element (Font, Color Scheme ..) • Aspect of Layout (Padding, Align ..) …
  11. GDG Venezia Showcase • No detail screen…. Up to you!

    ‍‍ • Only guidelines, you can differ from it!
  12. Repo Github • Hello World • Bottom Navigation Bar Example

    • List View Example • GDG Venezia App Skeleton http://bit.ly/fsj-main-repo
  13. Repo Github • Fork the skeleton • Share your work

    to Github, if you want! • Share a screenshot on Twitter! #flutterstudyjam #appgdgvenezia @gdgvenezia • Another event to go deep with Business Logic? http://bit.ly/fsj-skeleton