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

Exploring new possibilities with Flutter for web

Avatar for Pawan Kumar Pawan Kumar
September 22, 2019
Technology
0
200

Exploring new possibilities with Flutter for web

Avatar for Pawan Kumar

Pawan Kumar

September 22, 2019
Tweet

More Decks by Pawan Kumar

See All by Pawan Kumar
Flutter apps for everyone
Avatar for Pawan Kumar iampawan
1
430
How to create flavors in Android, iOS & Flutter
Avatar for Pawan Kumar iampawan
1
630
Become a PRO Flutter Developer
Avatar for Pawan Kumar iampawan
3
2.3k
Flutter, the future of mobile.
Avatar for Pawan Kumar iampawan
3
690
Flutter is the best. Best practices & tools
Avatar for Pawan Kumar iampawan
3
1.1k

Other Decks in Technology

See All in Technology
JJUG CCC 2025 Fall バッチ性能!!劇的ビフォーアフター
Avatar for HayashiYuichiro hayashiyuu1
1
410
AI × クラウドで シイタケの収穫時期を判定してみた
Avatar for Lamaglama39 lamaglama39
1
390
巨大モノリスのリプレイス──機能整理とハイブリッドアーキテクチャで挑んだ再構築戦略
Avatar for ZOZO Developers zozotech
PRO
0
270
レガシーで硬直したテーブル設計から変更容易で柔軟なテーブル設計にする
Avatar for Red Frasco red_frasco
4
570
生成AI時代に若手エンジニアが最初に覚えるべき内容と、その学習法
Avatar for starfish719 starfish719
2
600
身近なCSVを活用する！AWSのデータ分析基盤アーキテクチャ
Avatar for Kotaro.S koosun
0
3.9k
社内外から"使ってもらえる"データ基盤を支えるアーキテクチャの秘訣/登壇資料（飯塚 大地・高橋 一貴）
Avatar for Hacobu hacobu
PRO
0
6.3k
AI時代のインシデント対応 〜時代を切り抜ける、組織アーキテクチャ〜
Avatar for Kazuto Kusama jacopen
4
120
新しい風。SolidFlutterで実現するシンプルな状態管理
Avatar for ZOZO Developers zozotech
PRO
0
130
プロダクト負債と歩む持続可能なサービスを育てるための挑戦
Avatar for SansanTech sansantech
PRO
1
870
Progressive Deliveryで支える！スケールする衛星コンステレーションの地上システム運用 / Ground Station Operation for Scalable Satellite Constellation by Progressive Delivery
Avatar for iselegant iselegant
1
210
組織の“見えない壁”を越えよ！エンタープライズシフトに必須な3つのPMの「在り方」変革 #pmconf2025
Avatar for Masakazu Inaba masakazu178
1
800

Featured

See All Featured
Automating Front-end Workflow
Avatar for Addy Osmani addyosmani
1371
200k
Unsuck your backbone
Avatar for Amy Palamountain ammeep
671
58k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
Avatar for Eileen M. Uchitelle eileencodes
26
3.2k
4 Signs Your Business is Dying
Avatar for Josh Pigford shpigford
186
22k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
Avatar for panda_program panda_program
118
20k
The Illustrated Children's Guide to Kubernetes
Avatar for Chris Short chrisshort
51
51k
GraphQLの誤解/rethinking-graphql
Avatar for sonatard sonatard
73
11k
A Modern Web Designer's Workflow
Avatar for Chris Coyier chriscoyier
697
190k
The Straight Up "How To Draw Better" Workshop
Avatar for Dennis Kardys denniskardys
239
140k
Embracing the Ebb and Flow
Avatar for Simon Collison colly
88
4.9k
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
46
7.8k
Imperfection Machines: The Place of Print at Facebook
Avatar for Scott Boms scottboms
269
13k

Transcript

  1. Exploring new possibilities with Flutter for web By Pawan Kumar

  2. Google Developer Expert For Flutter, Firebase, Dart & WebTech

  3. Back in 2017 Native Android Me

  4. In 2018 Declarative UI Pattern?

  5. None

  6. In 2019?

  7. 2019 for declarative UI Pattern

  8. What is Flutter Flutter is Google’s portable UI toolkit for

    building beautiful, native applications for Android iOS, Web and Desktop from a single codebase.

  9. Expressive, beautiful UIs

  10. Stateful hot reload

  11. Native performance

  12. Flutter directly compiles your dart code to native machine code

    Mobile Web Desktop

  13. Raspberry Pi

  14. Desktop Embedding

  15. Integrate flutter app to existing iOS and Android app

  16. Flutter For Web

  17. Flutter vs Flutter For Web

  18. Scenario • A connected Progressive Web Application built with Flutter

    • Embedded interactive content • Embedding dynamic content in a Flutter mobile app

  19. Flutter Web Support Flutter 1.10

  20. None

  21. Cross Platform Mobile Apps

  22. Dart

  23. “Dart is particularly easy to learn because it has features

    that are familiar to users of both static and dynamic languages.” Why Flutter uses Dart

  24. Event loop

  25. Just-in-time compilation

  26. Ahead-of-time compilation

  27. Type safe

  28. None
  29. None
  30. None
  31. None
  32. None
  33. None
  34. None
  35. None
  36. None
  37. None
  38. None
  39. None
  40. None
  41. None
  42. None
  43. None
  44. None
  45. None

  46. Familiar

  47. None

  48. Everything’s a widgets!

  49. None
  50. None
  51. None
  52. None
  53. None

  54. Gotcha

  55. No templates

  56. No css

  57. None
  58. None
  59. None

  60. “Flutter widgets are built using a modern react-style framework” Flutter.io

  61. StatefulWidget

  62. None
  63. None

  64. State is long-lived

  65. Widgets get reborn

  66. Fast

  67. Stateful hot reload

  68. Reactive

  69. Animation

  70. None

  71. Custom Animation with Tween Zero to One with Flutter

  72. Testing

  73. Unit

  74. package:test

  75. None

  76. Widget

  77. package:flutter_test

  78. None

  79. Integration

  80. “tested app is launched on a real device or in

    an emulator” Flutter.io
  81. None

  82. Test more things

  83. None

  84. Flutter For Web – Technical Preview Android + iOS +

    (Not so good Web) = ♥ http://mtechviral.com/myportfolio/ http://mtechviral.com/Flutter-UI-Kit/ https://flutter.github.io/samples/

  85. Where to start

  86. Youtube.com/mtechviral

  87. Flutter.dev

  88. flutter.dev/docs/codelabs

  89. github.com/Solido/ awesome-flutter

  90. Thank You Twitter - @imthepk | Github - @iampawan |

    Youtube - @mtechviral