ウェブフロントエンジニアから見る Flutter Webの 現在地点 / Flutter web as of now

フロントエンドカンファレンス沖縄2022の登壇資料です。

--
https://front-okinawa.connpass.com/event/263836/

Transcript

1. ΢ΣϒϑϩϯτΤϯδχΞ͔ΒݟΔ Flutter Webͷ ݱࡏ஍఺ ϑϩϯτΤϯυΧϯϑΝϨϯεԭೄ2022
2. ຊ೔ͷεϥΠυ͸ iA PresenterͰ࡞੒ https://ia.net/presenter
3. Profile
5. ͗ͦ͜ | SHINICHI KOGISO UXJUUFSΞΧ΢ϯτ͸!LHTJ r ຊ৬͸྘ͷਓࣄ࿑຿ͳձࣾͷϓϩμΫτσβΠφʔ r ݱࡏࣾʹΤϯδχΞɾσβΠφʔͱͯ͠෭ۀࢀը த r ຊ೔͸Ұ෭ۀઌͷϑϩϯτΤϯυΤϯδχΞਓ֨Ͱ ొஃ r ॅ୐ϩʔϯ͸͋ͱ೥࢒ͬͯ·͢ r
7. Talking today
8. 'MVUUFS
   8FC͸࢖͑Δͷ͔ʁ r 'MVUUFS
   8FCͷྑ͍఺ѱ͍఺ r 'MVUUFS
   8FCͷະདྷ r
9. Not talking
10. ଞͷΫϩεϓϥοτϑΥʔϜͷൺֱ r ωΠςΟϒΞϓϦʢJ04"OESPJEͳͲʣ෦෼ r
11. Services created
13. Why choose Flutter web?
14. ωΠςΟϒԽΛ༧ఆ͍ͯ͠Δ͜ͱ  ϫϯιʔεͰ։ൃͰ͖Δ͜ͱ  ൺֱత୹ظؒͰ։ൃͰ͖Δ͜ͱ 
15. Development System
16. ։ൃϝϯόʔߏ੒ɿਓ r όοΫΤϯυΤϯδχΞ໊ɺϑϩϯτΤϯυ ΤϯδχΞ໊ɺ1.໊ r ٕज़ௐࠪɿϲ݄ r ͢Ͱʹ͋Δ3FBDUΞϓϦΛஔ͖׵͑ΒΕΔ͔ Ͳ͏͔ r ࣮૷ظؒɿϲ݄ r ෭ۀͷ࣌ؒΛ࠷େݶ࢖͍ɺٽ͖ͳ͕Β։ൃ r
17. Technical Configuration
20. My impressions of Flutter web
21. Good :)
22. ϑϩϯτΤϯυΤϯδχΞ ͱֶͬͯशίετ͕௿͍
23. void main() { print('Hello, World!'); } var name = 'Voyager I'; var year = 1977; var antennaDiameter = 3.7; var flybyObjects = ['Jupiter', 'Saturn', 'Uranus', 'Neptune']; var image = { 'tags': ['saturn'], 'url': '//path/to/saturn.jpg' };
24. ωΠςΟϒମݧΛ΢ΣϒͰ
25. 4LJBΤϯδϯʹΑΔൺֱతߴ͍࠶ ݱੑ r 18"ʹඪ४ରԠ r
26. ։ൃ؀ڥपΓͷॆ࣮౓
27. 74$PEF"OESPJE
    4UVEJPͷαϙʔ τͷखް͞ r σόοά͕ൺֱత༰қ r ։ൃ؀ڥͷखް͞ r
28. ׆ൃͳߋ৽ͱվम
29. 'MVUUFS
    W  
    ςΫχΧϧϓϨϏϡʔެ ։ r 'MVUUFS
    W  
    ਖ਼ࣜʹ'MVUUFSʹػೳ౷ ߹ r 'MVUUFS
    W  
    ϨϯμʔΤϯδϯ͕มߋ r 'MVUUFS
    W  
    'MVUUFS
    8FC͕ਖ਼ࣜԽ r 'MVUUFS
    W ݱࡏ 
    ύϑΥʔϚϯενϡʔχ ϯά r
30. ॆ࣮ͨ͠ΤίγεςϜ
32. Bad :(
33. ύϑΥʔϚϯε໰୊΍ ՝୊͸ॾʑ͍ͬͺ͍
34. શମతͳύϑΥʔϚϯεͷ௿͞ r όϯυϧϑΝΠϧͷංେԽ r ೔ຊޠपΓͷαϙʔτͷऑ͞ r ೖྗܥίϯϙʔωϯτͷόά r
37. /PU
    FWFSZ
    )5.-
    TDFOBSJP
    JT
    JEFBMMZ
    TVJUFE GPS
    'MVUUFS
    BU
    UIJT
    UJNF
    'PS
    FYBNQMF
    UFYU SJDI
    qPXCBTFE
    TUBUJD
    DPOUFOU
    TVDI
    BT CMPH
    BSUJDMFT
    CFOFpU
    GSPN
    UIF
    EPDVNFOU DFOUSJD
    NPEFM
    UIBU
    UIF
    XFC
    JT
    CVJMU
    BSPVOE SBUIFS
    UIBO
    UIF
    BQQDFOUSJD
    TFSWJDFT
    UIBU
    B 6*
    GSBNFXPSL
    MJLF
    'MVUUFS
    DBO
    EFMJWFS )PXFWFS
    ZPV
    DBO
    VTF
    'MVUUFS
    UP
    FNCFE JOUFSBDUJWF
    FYQFSJFODFT
    JOUP
    UIFTF XFCTJUFT
38. So why choose Flutter web?
39. Joy
42. Improvement
43. 3FHBSEJOH
    'MVUUFS
    GPS
    XFC
    JO QBSUJDVMBS
    XF
    QMBO
    UP
    XPSL
    PO JNQSPWJOH
    QFSGPSNBODF
    QMVHJO RVBMJUZ
    BDDFTTJCJMJUZ
    BOE
    DPOTJTUFODZ BDSPTT
    CSPXTFST
    8F
    BMTP
    JOUFOE
    UP NBLF
    JU
    NVDI
    FBTJFS
    UP
    FNCFE
    'MVUUFS BQQMJDBUJPOT
    JOTJEF
    PUIFS
    OPO'MVUUFS )5.-
    QBHFT 'MVUUFS
    3PBENBQ
    
44. 2023ʙ
46. Flutter4...? 'MVUUFS
    8FCͷύϑΥʔϚϯε޲্ r .BUFSJBM
    %FTJHOͷϑϧαϙʔτ r *NQFMMFSʢJ04"OESPJE޲͚ͷ࣍ੈ୅ ϨϯμϦϯάϨΠϠʔʣͷϕʔλԽ r FUD r
47. Flutter Web has a future.
48. Summary
49. େલఏͱͯ͠ ΫϩεϓϥοτϑΥʔϜ Խ༧ఆ͕ͳ͍৔߹͸બͿཧ༝͸ऑ͍ r ֤ϓϥοτϑΥʔϜͰΞϓϦέʔγϣ ϯͷମݧΛఏڙ͍ͨ͠৔߹͸༗ྗͳબ ୒ࢶ r 'MVUUFS
    8FCͷະདྷʹ౤ࢿ͢Δͱ͍͏ ൑அ͕Ͱ͖ΔͳΒऔΓ૊ΉՁ஋͸े෼ ʹ͋Δ r
50. Advertising
52. Reference
53. r 8FC
    TVQQPSU
    GPS
    'MVUUFS r qVUUFSBSDIJUFDUVSFCMVFQSJOUT r 3FMBZ r 'MVUUFS'MPX r 'MVUUFS
    3PBENBQ