The Flutter Revolution - Recipe for building apps without pain

Transcript

1. Shuaib Afegbua, Ectorium/Code
   Kraft
   @afegbuas
   Abuja
   The Flutter Revolution -
   Recipe for building apps
   without pain
   

   View Slide

2. Technology enthusiast |> Software craftsman |> Loves building stuff
   ABOUT ME
   Long love affair with Java. Also writes Elixir, Scala and some others
   @afegbuas
   

   View Slide

3. Technology enthusiast |> Software craftsman |> Loves building stuff
   ABOUT ME
   Long love affair with Java. Also writes Elixir, Scala and some others
   @afegbuas
   

   View Slide

4. Technology enthusiast |> Software craftsman |> Loves building stuff
   ABOUT ME
   Long love affair with Java. Also writes Elixir, Scala and some others
   ● Computer Science major (FUTMINNA and ABU)
   ● Worked at Mott Macdonald/Cambridge Education for a long time and
   some other places
   ● Got tired, quit and stayed at home.
   @afegbuas
   

   View Slide

5. MY PRESENT AND POSSIBLE FUTURE
   ● Building Ectorium. WTH????
   ● Amateur Writer - www.medium.com/@afegbuas
   ● I have an addiction bleeding edge technology
   ● Got another addiction - READING
   @afegbuas
   

   View Slide

6. I LOVE BUILDING THINGS
   ●
   @afegbuas
   

   View Slide

7. Mobile: how it all started?
   

   View Slide

8. “To tortoise fell from the sky,
   some group of techies ran to
   rescue it and found a mobile”
   - Anonymous
   

   View Slide

9. 1973
   Demonstrated the first mobile
   Motorola
   

   View Slide

10. 1979
    Japanese company Nippon Telegraph and
    Telephone launched the first commercial
    phone in 1979 and Nordic Mobile Telephone
    launched the first fully automatic cellular
    phone
    NTT and NMT
    

    View Slide

11. 1990s
    1990 witnessed the advent of the
    second-generation (2G) digital cellular
    technology was launched in Finland by
    Radiolinja
    2G
    

    View Slide

12. 1990s
    IBM released the first smartphone in 1993 with
    a calculator, world clock, calendar and contact
    book. LOL
    WML
    Palm OS
    Java ME,
    Symbian OS
    Also the smartphone era
    

    View Slide

13. 2001
    2001 was 3G phones.
    Blackberry came with a major breakthrough in
    2002 with their smartphone
    Iphone OS 2018
    Android 2008
    3GS
    

    View Slide

14. 2009 and upwards
    As phones technology started improving and
    getting power with more computing powers,
    4G and above
    

    View Slide

15. Development approaches
    

    View Slide

16. Proprietary + Confidential
    Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis non erat sem
    Android iOS
    NATIVE APPROACH
    

    View Slide

17. Proprietary + Confidential
    Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis non erat sem
    HYBRID AND CROSS PLATFORM
    

    View Slide

18. What is Flutter ?
    

    View Slide

19. Flutter
    Flutter is Google's mobile UI framework for crafting high-quality
    native experiences on iOS and Android in record time
    

    View Slide

20. Why Flutter ?
    

    View Slide

21. Flutter empowers the
    developer
    

    View Slide

22. Awesome UI Library
    Everything is a widget you hear
    Excellent look and feel
    Performs very fast
    Extensible and customisable
    

    View Slide

23. Write once, deploy cross platform
    Single code base
    One Language for UI and Code
    Bundled framework
    

    View Slide

24. Excellent Layout Approach
    No N-Squared Performance problem
    No overloaded styling rules
    Heavily customisable
    

    View Slide

25. Reactive
    Just in Time Compilation
    Event driven
    JIT
    

    View Slide

26. Fast Build with hot-reload
    Sub seconds reload
    10 seconds native android with Gradle builds. SORRY Gradle
    

    View Slide

27. Integrate Flutter into existing apps
    Easy and Fast Developments
    

    View Slide

28. Truly native
    Code compiles AOT into Native ARM
    No bridge like we have in React Native or NativeScript or others
    

    View Slide

29. Tootselts and Documentation
    Build tool and IDE Intellisense
    VSCODE, Android Studio and IntelliJ
    Dart Pub Packages
    Good Documentation
    The community is growing rapidly - Tutorials, Stackoverflow,
    YouTube etc.
    

    View Slide

30. How to Flutter does this ?
    

    View Slide

31. Image credite: AlibabaTech
    WebViews
    

    View Slide

32. Image Credits: AlibabaTech
    Reactive views
    

    View Slide

33. Image Credits: AlibabaTech
    The Flutter way
    

    View Slide

34. View Slide

35. How to Flutter?
    

    View Slide

36. Setting up your computer
    Its is easy when you nixed Sorry windows
    https://webdev.dartlang.org/tools/sdk#install
    https://pub.dartlang.org/packages/stagehand#-readme-tab-
    https://flutter.io/get-started/install/
    https://flutter.io/get-started/editor/#androidstudio
    

    View Slide

37. Just Enough Dart
    Dart is a language optimized for client-side development for web and mobile.
    Dart helps you craft beautiful, high-quality experiences across all screens. A
    client-optimized language Rich, powerful frameworks Delightful, flexible tooling
    

    View Slide

38. Dart
    OOP Language
    Concise to write and approachable
    Productive
    Fast
    Portable
    

    View Slide

39. Data Types
    Numbers - integers and doubles
    Strings
    Booleans
    

    View Slide

40. List
    

    View Slide

41. Maps
    

    View Slide

42. Functions
    

    View Slide

43. Anonymous and first class functions
    

    View Slide

44. Classes
    

    View Slide

45. Async Dart
    

    View Slide

46. HTTP
    Programming
    

    View Slide

47. E don do?
    

    View Slide

48. Start Fluttering
    

    View Slide

49. View Slide

50. View Slide

51. View Slide

52. WTH is a Widget?
    

    View Slide

53. Stateful vs Stateless widgets
    

    View Slide

54. View Slide

55. View Slide

56. View Slide

57. Flutter widgets
    layouts, widgets,
    scrollers, forms,
    buttons, Dialogs and
    alerts, Navigation,
    Sliders and
    Indicators, working
    with images
    

    View Slide

58. View Slide

59. So what next?
    

    View Slide

60. How to keep Fluttering
    

    View Slide

61. Shuaib Afegbua, Ectorium
    @afegbuas
    Location
    Thank you!
    

    View Slide