Slide 1

Slide 1 text

#yumemi_grow ҆৺ͯ͠ݱ৔ͰֶशͰ͖Δ؀ڥͱͯ͠ Flutter Web ͷ؅ཧαΠτ͕͓͢͢Ίͳ࿩ πϧΦΧ - Hideki TSURUOKA UpdatedAt 2023.06.05 YOUTRUST x ΏΊΈ Flutter LTձ@ौ୩

Slide 2

Slide 2 text

πϧΦΧ • ๭େख௨৴ࣄۀձࣾͷ৽نࣄۀ෦໳ʹॴଐ • FlutterΛ৮Γ࢝Ίͨͷ͸2020೥4݄ࠒʢFlutter 1.0͕ग़ͯ҆ఆޙʣ • ΤϯδχΞϦϯά×σβΠϯͷڥքྖҬʹؔ৺ • Perfume͕޷͖ Self-Introduction @h_tsuruo

Slide 3

Slide 3 text

Zennʹٕͯज़هࣄͷൃ৴ pub.devύοέʔδͷެ։ Speaker Deck OSS Contribute Personal Activities

Slide 4

Slide 4 text

4 Today’s Talk ຊ೔͓࿩͢Δ͜ͱ Flutter WebͰ؅ཧαΠτΛ ࡞ΔϝϦοτ͸ͨ͘͞Μ͋Δͱࢥ͍·͕͢ɺ ͦͷ1ͭʢڭҭੑʣΛମݧஊͱͯ͠঺հ ※؅ཧαΠτ: ΞΧ΢ϯτ؅ཧɺ஫จঢ়گͷ֬ೝɺ౷ܭ৘ใͷ෼ੳͳͲӡӦ͕ར༻͢ΔμογϡϘʔυΛ૝ఆ

Slide 5

Slide 5 text

5 ref. https://github.com/abuanwar072/Flutter-Responsive-Admin-Panel-or-Dashboard ※؅ཧαΠτͷΠϝʔδ

Slide 6

Slide 6 text

6 The Bene fi ts of Flu tt er Web Admin Sites No. ಛ௃ ϝϦοτ 1 ։ൃ༰қੑ (Ease of Development) Dartʹ౷Ұ͞ΕɺݴޠʹΑΔεΠονϯάίετ͕΄΅ͳ͍ɻ 2 ޮ཰ੑ (Efficiency) ڞ௨෦෼ͷιʔείʔυ͕ू໿͞Εɺӡ༻ίετ͕௿ݮɻ 3 ݕূ༰қੑ (Ease of Validation) Sandboxతͳ؀ڥͰ৽͍͠ΞΠσΟΞ΍ٕज़ͷ༗ޮੑΛ༰қʹݕ ূͰ͖Δʢྫ: Riverpod v2΍go_routerͷࢼݧಋೖͳͲʣɻ 4 ڭҭੑ (Educationality) ҆৺࣮ͯ͠຿ܦݧ͕٧ΊΔॳظϓϩδΣΫτͱͯ͠ڭҭʹదͯ͠ ͍Δɻ˒ຊ೔ͷτϐοΫ

Slide 7

Slide 7 text

7 Flu tt er Web •Flutter 3.10ͰCanvasKitͷੑೳUP͠͞Βʹ࢖͍΍͘͢ •ҰํͰɺSEOͳͲैདྷͷWebΞϓϦʹඞਢͳ෦෼͸ශऑ ※1 •؅ཧαΠτͰͷར༻͸దͨ͠Ϣʔεέʔεͷ1ͭʢੲ͔Βʣ •؅ཧαΠτ༻ͷUIςϯϓϨʔτΛ࢖͑͹ϨΠΞ΢τߏங΋ָ ※2 ؆୯ʹ͓͞Β͍ ※1: ະରԠͱ͍͏ΑΓ༻్Λ໌֬ʹ੾Γ෼͚͍ͯΔೝࣝͰɺݕࡧΤϯδϯʹ࠷దԽ͢Δ৔߹͸HTMLΛར༻͢ΔͳͲదࡐదॴ ref. https://docs.flutter.dev/platform-integration/web/faq#search-engine-optimization-seo ※2: ϨεϙϯγϒͳAdmin Panel / Dashboard͕GitHubͰެ։͞Ε͍ͯͨΓ͢Δ ref. https://github.com/abuanwar072/Flutter-Responsive-Admin-Panel-or-Dashboard

Slide 8

Slide 8 text

8 ͢Ͱʹӡ༻͍ͯ͠ΔαʔϏεͷ ঎༻ιʔείʔυ͕͋Δͱ͠·͢ iOS/AndroidͷϞόΠϧΞϓϦΛ૝ఆ

Slide 9

Slide 9 text

9 ৽͍͠ϝϯόʔ͕Ճೖͨ͠ࡍɺ ͲΜͳ෩ʹΩϟονΞοϓΛଅ͠·͔͢ʁ ྫʣυΩϡϝϯτΛ۱͔ΒಡΜͰ΋Β͏ɺίʔυϦʔσΟϯάଅ͢ɺϖΞϓϩɺ࣮ફ&ϨϏϡʔ etc…

Slide 10

Slide 10 text

10 ͓٬༷ʹ௚઀Өڹ͢Δ঎༻ιʔείʔυΛ ͍͖ͳΓ࿔Δͷ͸৺ཧతোน͕ߴ͍ʢਓ΋͍Δʣ ঎༻ιʔείʔυͰ΋ΠγϡʔΛখ͘͞੾Γग़ͯ͠ΞαΠϯ͢Δͱ͍͏ԦಓͰOKͳ৔߹͸໰୊ͳ͠

Slide 11

Slide 11 text

11 Flutter Webͷ؅ཧαΠτΛ࢖ͬͯ ҆৺ͯ͠ݱ৔ͰֶशͰ͖Δ؀ڥΛఏڙ͍ͯ͠·͢ Flutterಛ༗ͷWidgetجຊಈ࡞΍νʔϜͰ࠾༻͍ͯ͠ΔΞʔΩςΫνϟʹ׳Εͯ΋Β͏͜ͱ͕ओͳ໨త

Slide 12

Slide 12 text

12 Multi Package MelosΛ࢖ͬͨϚϧνύοέʔδߏ੒Ͱ͓٬༷؀ڥΛ෼཭ common app admin ͓٬༷͕࢖͏ϞόΠϧΞϓϦ؀ڥ ӡӦ͕࢖͏؅ཧαΠτ ΞϓϦͱ؅ཧαΠτͷڞ௨෦෼

Slide 13

Slide 13 text

13 ͓٬༷؀ڥͱ੾Γ཭ͨ͠ adminύοέʔδʹดͯ͡։ൃ͠ܦݧΛੵΉ όά͕ࠞೖͯ͠΋͓٬༷ʹ௚઀ӨڹΛ༩͑ͳ͍ͱ͍͏৺ཧతͳ҆શੑΛ֬อ࣮ͭͭ͠຿ܦݧΛੵΉ

Slide 14

Slide 14 text

14 Step Up /admin /common /app ঎༻ΞϓϦέʔγϣϯίʔυ΁ஈ֊తʹࢀՃ Flutter Webͷ؅ཧαΠτ͸ ͓٬༷؀ڥͱ੾Γ཭͞Ε͍ͯ ΔͷͰɺόά͕ࠞೖ͍ͯͯ͠ ΋100%Өڹ͕ͳ͍ɻ 1 2 3 ֶश͕ਐΉͱνʔϜͰར༻͠ ͍ͯΔύοέʔδͷཧղ΍ɺ ڞ௨ཁૉΛऔΓѻ͏common Λ࿔Δػձ͕૿͑Δɻ commonͷࢀরઌΛḷΔͱΞ ϓϦέʔγϣϯίʔυΛϦʔ σΟϯά͢Δػձ͕૿͑ɺ։ ൃʹεϜʔζʹࢀՃͰ͖Δɻ

Slide 15

Slide 15 text

15 Summary ͓٬༷؀ڥͱ੾Γ཭͞Εͨ؀ڥͰ͸ɺ ҆৺࣮ͯ͠຿ܦݧΛੵΉ͜ͱ͕Ͱ͖ɺ Flutter Web ؅ཧαΠτ͸ͦͷ༻్ͱͯ͠΋༏ल

Slide 16

Slide 16 text

16 The Bene fi ts of Flu tt er Web Admin Sites No. ಛ௃ ϝϦοτ 1 ։ൃ༰қੑ (Ease of Development) Dartʹ౷Ұ͞ΕɺݴޠʹΑΔεΠονϯάίετ͕΄΅ͳ͍ɻ 2 ޮ཰ੑ (Efficiency) ڞ௨෦෼ͷιʔείʔυ͕ू໿͞Εɺӡ༻ίετ͕௿ݮɻ 3 ݕূ༰қੑ (Ease of Validation) Sandboxతͳ؀ڥͰ৽͍͠ΞΠσΟΞ΍ٕज़ͷ༗ޮੑΛ༰қʹݕ ূͰ͖Δʢྫ: Riverpod v2΍go_routerͷࢼݧಋೖͳͲʣɻ 4 ڭҭੑ (Educationality) ҆৺࣮ͯ͠຿ܦݧ͕٧ΊΔॳظϓϩδΣΫτͱͯ͠ڭҭʹదͯ͠ ͍Δɻ˒ຊ೔ͷτϐοΫ

Slide 17

Slide 17 text

17 Fin ৽͍͠ϝϯόʔͷΩϟονΞοϓ؀ڥͱͯ͠ Flutter WebͰ؅ཧαΠτɺ͍͔͕Ͱ͔͢ʁ