Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Flutter入門
Search
Takayuki
May 22, 2020
Programming
1
1.3k
Flutter入門
flutter初心者でもわかりやすく、簡単なアプリを作るまでの話をします。例えば、UI宣言やホットリロードなど便利機能の使い方などもお話します。
Takayuki
May 22, 2020
Tweet
Share
More Decks by Takayuki
See All by Takayuki
地方カンファレンス主催のススメ
bumptakayuki
1
100
Laravelで敢えて試す脆弱性のある書き方
bumptakayuki
1
350
地方でのPHPエンジニア採用って実際どうなの?
bumptakayuki
0
380
沖縄観光、名物を一挙紹介!
bumptakayuki
2
400
Laravel ShiftでLaravelのバージョンアップしてみた話
bumptakayuki
1
1k
flutterでイベントアプリを作ってみた
bumptakayuki
0
89
オフショア開発の辛みと学んだ事
bumptakayuki
0
310
ChatGPTにStripeのサンプルコードを書かせてみた
bumptakayuki
1
130
ChatGPTに記事を書かせてみた
bumptakayuki
1
200
Other Decks in Programming
See All in Programming
What We Can Learn From OSS
inouehi
0
400
Ruby Pattern Matching
bkuhlmann
0
920
Netty Chicago Java User Group 2024-04-17
sullis
0
130
プールにゆこう
irof
2
120
CA.swift19 恋するAIアプリ開発の裏側
oskmr
0
340
Code Reviews
bkuhlmann
4
880
Elm 0.19.0 Changes
bkuhlmann
0
480
コーンフレークから始める モデリング会話入門
ogurotakayuki
0
280
Ruby GitHub Packages
bkuhlmann
0
620
Ruby製社内ツールのGo移行
bgpat
2
330
本格ローグライク制作にEbitengineを選んでみた
nagainaganawa
0
290
1인 개발자로 행복하게 살기 - GDG 송도 헬로월드 2024
benjaminkim
1
5.6k
Featured
See All Featured
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
1
1.3k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
658
120k
Pencils Down: Stop Designing & Start Developing
hursman
117
11k
GraphQLとの向き合い方2022年版
quramy
31
12k
Being A Developer After 40
akosma
56
580k
Raft: Consensus for Rubyists
vanstee
132
6.2k
Put a Button on it: Removing Barriers to Going Fast.
kastner
58
3k
What's in a price? How to price your products and services
michaelherold
237
11k
Writing Fast Ruby
sferik
620
60k
A Modern Web Designer's Workflow
chriscoyier
688
190k
YesSQL, Process and Tooling at Scale
rocio
163
13k
Code Reviewing Like a Champion
maltzj
513
39k
Transcript
Flutter入門 鈴木孝之
"HFOEB ࣗݾհɾձࣾհ 'MVUUFSͱ 'MVUUFSΛֶ΅͏ͱࢥͬͨཧ༝ ։ൃͨ͠αʔϏε
ࣗݾհɾձࣾհ
1.ࣗݾհ ◆໊લ ླ ೭(Suzuki Takayuki) ※ಉಉ໊ଟͯ͘ࠔͬͯ·͢ɻɻɻ ◆ࣗݾհ ɾ1990ɺਆಸݝੜ·Εɻ ɾࣾձਓʹͳ͔ͬͯΒɺϓϩάϥϛϯάΛ࢝ΊΔɻ ɾ2015ʹϑϧεϐʔυʹೖࣾ͠ɺ2017ʹಠཱɻ
ɾϑϦʔϥϯεͰϦϞʔτϫʔΫΛͬͨޙʹԭೄͰىۀ ◆झຯ ίεϓϨɺԻָϥΠϒɺϚϥιϯେձʹग़Δɺٿ؍ઓ BDD(Ϗʔνۦಈ։ൃ)
1.ࣗݾհ
Copyright Re:Build.inc All Rights Reserved. 1.ձࣾհ ◆ձ໊ࣾ גࣜձࣾRe:Build ◆ॅॴ ԭೄݝಹࢢٱໜ2-2-2
λΠϜεϏϧ ◆ࣄۀ༰ ɾࣗࣾWEBαʔϏεͷاըɾ։ൃɻ ɾडୗ։ൃ ◆ࣾһ 7໊ ◆ΤϯδχΞͷಇ͖ํ ϦϞʔτϫʔΫՄೳͳࣗ༝ͳಇ͖ํΛਪͯ͠·͢ʂ
Copyright Re:Build.inc All Rights Reserved. 7 ɾαʔϏε໊ Tadoru https://tadoru.work/
ɾγεςϜ֓ཁ ΤϯδχΞಛԽܕͷ ϦϑΝϥϧ Ϋϥυιʔγϯά 1 ձࣾհ
Copyright Re:Build.inc All Rights Reserved. 8 ɾαʔϏε໊ Re:Build Boot Camp
https://rebuild-bootcamp.jp/ ɾ֓ཁ ԭೄͱٶ࡚Ͱʮ࣮ϨϕϧʯΛ ࢦ͢ํ͚ͷϓϩάϥϛϯάε Ϋʔϧ ɾ͏ٕज़ LaravelɺVue.jsͳͲ 1 ձࣾհ
Copyright Re:Build.inc All Rights Reserved. 9 ࣮Ϩϕϧ ॳ৺ऀ ॳڃऀ ํͷॳ৺ऀ͚ͷϓϩάϥ
ϛϯάεΫʔϧΛଔۀͨ͠ޙ ͷॳڃऀ͔Β࣮Ϩϕϧ·Ͱ ͷؒΛຒΊΔεΫʔϧ 1 ձࣾհ
'MVUUFSͱ
FlutterΛ༻͢ΔͱɺiOS͓Αͼ AndroidͰ୯Ұͷίʔυ͔ΒωΠςΟϒ ΞϓϦΛߏஙͰ͖·͢ɻ ͭ·ΓɺΫϩεϓϥοτϑΥʔϜ։ൃ ٕज़Ͱ͢ɻ ͜Ε୯ҰͷίʔυΛهड़Ͱ͖ΔςΫ ϊϩδʔͰ͋ΓɺΞϓϦέʔγϣϯ Android͓ΑͼiOSϓϥοτϑΥʔϜͷ ྆ํͰಈ࡞͠·͢ɻ Flutterͱ
https://note.com/heavenosk/n/n245b72973600
Benefits of Flutter ཧղ͍͢͠։ൃݴޠͰ ߏஙͰ͖Δ FlutterͰ༻͞ΕΔݴޠʮμʔτʯͱ ݺΕ·͢ɻ DartͱͱJavaScript ͷସݴޠͱͯ͠ొ͠ɺͦͷܗࣜ JavaScriptʹࣅ͍ͯ·͢ɻ
ϗοτϦϩʔυΛؚΉॊ ೈͳUI ϓϩάϥϜͷ༰Λมߋ͢Δͱɺ͙͢ ʹը໘ʹө͞Ε·͢ɻ ίϯύΠϧͤ ͣʹ։ൃ͍༷͢͠ʹͳ͍ͬͯ· ͢ɻ AOTίϯύΠϥʔͱJITί ϯύΠϥʔͷ྆ํΛ༻͠ ͨޮతͳ։ൃ ։ൃதɺΞϓϦέʔγϣϯͷ࣮ߦ ࣌ʹίϯύΠϧͯ͠ػցޠʹม͢ ΔJITͰϗοτϦϩʔυΛ༻Ͱ͖· ͢ɻϦϦʔεޙɺϏϧυ࣌ʹίϯύ Πϧ͞ΕΔAOTɺ࣮ߦʹඞཁͳෛ ՙͱ࣌ؒΛݮ͠·͢ɻ 1 2 3 https://udemy.benesse.co.jp/development/ios/flutter-intro.html
DartɺΣϒΞϓϦέʔγϣϯ։ൃͷͨΊʹGoogle͕։ൃͨ͠ϓ ϩάϥϛϯάݴޠͰ͢ɻ େنͳΞϓϦέʔγϣϯ/αʔϏε։ൃ ΛαϙʔτͰ͖ΔΫϥεϕʔεͷΦϒδΣΫτࢦݴޠɻ Dartݴޠͱʁ https://www.ossnews.jp/oss_info/Dart
JavaScriptͷସΛࢦ͢ DartɺʮJavaScriptݴޠͰղܾͰ͖ͳ͍ݴޠͷΛղܾ͢Δʯɺʮ༏Εͨύ ϑΥʔϚϯεʯɺʮେنͳϓϩδΣΫτͰͷ༻ʹ͑Δʯɺʮ҆શʯͷ؍͔Β ઃܭ͞Ε·ͨ͠ɻ https://www.ossnews.jp/oss_info/Dart Dartݴޠͱʁ
FlutterʹɺAndroid Studioɺ IntelliJ IDEAɺ͓ΑͼVisual Studio Code༻ͷެࣜ։ൃϓϥάΠϯ͕͋ Γ·͢ɻ ϓϥάΠϯΛ༻ͤͣʹ FlutterͷίϚϯυϥΠϯπʔϧΛ ༻͢Δ͜ͱͰ͖ΔͨΊɺ͓ؾʹ
ೖΓͷΤσΟλʔΛ༻ͯ͠Flutter ͰΞϓϦέʔγϣϯΛ։ൃͰ͖· ͢ɻ ։ൃπʔϧͷ༻ํ๏ https://employment.en-japan.com/engineerhub/entry/2019/08/06/103000
·ͣɺެࣜͷAndroid StudioΣϒαΠτ͔ΒAndroid StudioΛμϯϩʔυ͠·͢ɻ https://developer.android.com/studio Android StudioͷηοτΞοϓ https://employment.en-japan.com/engineerhub/entry/2019/08/06/103000
FlutterϓϥάΠϯΛΠϯετʔϧ͢Δ Android Studio༻ͷFlutterϓϥάΠϯΛΠϯ ετʔϧͯ͠༻͠·͢ɻ Android Studio ͷ[ઃఆ]͔Β[ϓϥάΠϯ]Λબ͠ɺը໘ͷ Լ෦ʹ͋Δ[ϦϙδτϦͷࢀর]Λબ͠· ͢ɻ ը໘ΛʮflutterʯͰݕࡧ͠ɺදࣔ͞ΕΔ
ʮFlutterʯΛબ͠ɺInstallϘλϯͰΠϯε τʔϧ͠·͢ɻ Android Studio Setup https://employment.en-japan.com/engineerhub/entry/2019/08/06/103000
ΠϯετʔϧޙɺAndroid StudioΛ࠶ ىಈ͍ͯͩ͘͠͞ɻ ࠶ىಈޙɺ Android Studioͷελʔτը໘ʹʮ৽ نFlutterϓϩδΣΫτΛ։࢝͢Δʯͷ ϝχϡʔ͕දࣔ͞ΕΔͷͰબ͠· ͢ɻ Android
Studio Setup https://employment.en-japan.com/engineerhub/entry/2019/08/06/103000
[৽نFlutterϓϩδΣΫτ]ը໘Ͱɺ [FlutterΞϓϦέʔγϣϯ]Λબ͠ɺ [࣍]ʹਐΈ·͢ɻ Android Studio Setup https://employment.en-japan.com/engineerhub/entry/2019/08/06/103000
Android StudioͷTools͔ΒʮAVD ManagerʯΛબ͠ɺAVDͷҰཡ ը໘͕දࣔ͞ΕͨΒɺࠨԼͷʮʴ Create Virtual DeviceʯΛબͼ· ͢ɻ࣍ͷը໘ͰҙͷHardware ΛબΜͰʮNextʯਐΈ·͢ɻ Android
Studio Setup https://employment.en-japan.com/engineerhub/entry/2019/08/06/103000
࠶ੜϘλϯΛΫϦοΫ͢Δ Android Studio Setup https://employment.en-japan.com/engineerhub/entry/2019/08/06/103000
ΞϓϦΛىಈ͢Δ Android Studio Setup https://employment.en-japan.com/engineerhub/entry/2019/08/06/103000
'MVUUFSΛֶ΅͏ͱࢥͬͨཧ༝
ΫϩεϓϥοτϑΥʔϜͷٕज़બఆΛ͢Δࣄ͕૿͑ͨ ɾ·ͣ؆୯ʹϓϩτλΠϓΛ ωΠςΟϒΞϓϦͰ࡞Γ͍ͨͰ͢ɻ ɾωΠςΟϒΞϓϦΛ࡞Γ͍ͨͷͰɺ Flutter͔React NativeͰ͓ئ͍Ͱ͖·ͤΜʁ ɾٕज़બఆ͢Δ্ͰͲΜͳͷ͔ࣗ ͓͖͍ͬͯͨɻ ͳͲ
ࠓ·Ͱͷ͕ࣗ։ൃܦݧͷ͋Δϑϩϯτٕज़
https://qiita.com/nskydiving/items/c13c949cc17c6f980a67 Development Language Development Environment Platform UI Application example Flutter
Google Dart Android Studio, IntelliJ IDEA, Visual Studio Code iOS, Android, Web, Windows, Mac, Linux Original UI Xianyu, Hamilton, Google Ads React Native Facebook JavaScript, TypeScript Nuclide, Visual Studio Code iOS, Android, Web(Mac, Windows) Native UI Instagram, Facebook, Facebook Ads, Skype, Tesla FlutterͱReact NativeͲͪΒ͕ྑ͍ͷͩΖ͏͔ʁ - ϑϨʔϜϫʔΫൺֱදΛݟ͍͚ͯͨͩΕ͔Δ௨Γɺ྆ऀඇৗʹΑ͘ࣅ͍ͯ·͢ɻ - React Native ͕طଘͷ Web ٕज़Λϕʔεʹઃܭ͞Ε͍ͯΔͷʹରͯ͠ɺFlutter શ͘ Ұ͔Βઃܭ͞Ε͍ͯ·͢ɻ
FlutterͱReact NativeͷUIͷҧ͍ - React Native ωΠςΟϒ UI Λ࠾༻͍ͯ͠·͕͢ɺFlutter ಠࣗ UI
Λ࠾༻͍ͯ͠·͢ɻ - ͭ·ΓɺReact Native ΞϓϦϓϥοτϑΥʔϜʹΑͬͯݟ͕ͨม ΘΓ·͕͢ɺFlutter ΞϓϦͲͷϓϥοτϑΥʔϜͰ౷Ұ͞Εͨݟ ͨʹͳΓ·͢ɻ https://qiita.com/nskydiving/items/c13c949cc17c6f980a67
FlutterͱReact NativeͷϦιʔε֬อʹ͍ͭͯ - ຊͩͱ·ͩReact NativeͷΤϯδχΞͷํ͕গ͚ͩ͠ଟ͍ҹɻ - ւ֎ͰΦϑγϣΞͰൃ͢Δʹͯ͠ɺFlutterΤϯδχΞ୯Ձ͕ߴ ͯ͘ίετײ͕߹Θͳ͍ɻ https://qiita.com/nskydiving/items/c13c949cc17c6f980a67
։ൃͨ͠αʔϏε
WWW.SITE2MAX.PRO Free PowerPoint & KeyNote Templates DEMO Event Search Event
Search
࣮͠Α͏ͱࢥͬͨཧ༝ Πϕϯτͷݕࡧ݅ ͕͋·Γͳ͍…
࣮͠Α͏ͱࢥͬͨཧ༝ ΞϓϦ൛͋·Γ͍͢ ͘ͳ͍ɻ
ΞϓϦέʔγϣϯ શମߏ https://connpass.com/ api/v1/event/ API connpass API͔Β ΠϕϯτใΛऔಘ
34 Ωʔϫʔυݕࡧ Ҭݕࡧ Mock ը໘ϞοΫ ଞͷݕࡧ࣮݅ தɻ
Connpass API༷ॻ ݕࡧ͍͔݅ͭ͋͘ΔͷͰɺҾ͖ଓ ͖ɺ࣮த https://connpass.com/about/api/
࣮༰ ΞϓϦͷએݴ
࣮༰ Connpass͔ΒͷऔಘใΛ Ұͭͷclassʹूɻ
࣮༰ Widget෦ɻݕࡧϑΟʔϧυͱυ ϩοϓμϯΛੜ
࣮༰ ݕࡧॲཧ෦ɻConnpass APIΛୟ ͍ͯऔಘɻ
·ͱΊ
࣮ͯ͠Έͨײ - ॻ͍ͨײ͡ɺTypeScriptʹࣅ͍ͯΔؾ͕͢Δɻ - WidgetΛ࡞Δͷ͕͍͠ɻ͜ΕΛ͓٬͞Μͷࢦఆͨ͠σβΠ ϯͯΔ࡞ۀͱ͔େมͦ͏ɻ - ֶशίετߴͦ͏͚ͩͲɺ׳ΕΕ͖ͬͪΓॻ͚ΔͷͰɺ ྑͦ͞͏ɻ