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
about_flutter.pdf
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
glassmonenkey
April 12, 2020
Technology
640
2
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
about_flutter.pdf
Flutterの特徴の紹介。
glassmonenkey
April 12, 2020
More Decks by glassmonenkey
See All by glassmonenkey
TypeScript で WebAssembly を用いた 型安全なプラグイン設計
nagano
2
600
encoding/json/v2で何が変わるか
nagano
14
5.6k
アジャイルテストの4象限で考える プロダクト開発の品質への向き合い方
nagano
1
2.6k
パッケージ管理ツール Ryeへの旅路
nagano
1
650
PHPerにとってのWebAssemblyの可能性
nagano
1
1.6k
PHPをブラウザで動かす技術
nagano
0
3k
PHPとWebAssembly
nagano
19
6.7k
アジャイルで始める データ分析基盤構築
nagano
1
3.8k
Goで始めるTDD
nagano
1
3.1k
Other Decks in Technology
See All in Technology
Microsoft MVP プログラムを紹介するから目指す人増えてくれ
tsubakimoto_s
0
160
AIエージェントを雇う前に決める5つのこと
knishioka
1
130
Sansan Engineering Unit 紹介資料
sansan33
PRO
1
5k
Digitization部 紹介資料
sansan33
PRO
2
7.8k
Nav2、Nav3 ... はたまた自作?〜 作って理解する Nav3 の設計意図 〜 / Nav2, Nav3 ... or Build Your Own? — Understanding Nav3's design intent by building it from scratch
yanzm
0
120
サーバー常駐型の 簡易障害調査AI エージェントを作ってみた話
masayoshi
1
500
AI時代のデータ基盤を考える問い
pacocat
0
790
Master Dataグループ紹介資料
sansan33
PRO
1
4.9k
AI × Datadog MCP でコスト削減まで実現した Metric Streams の導入
three_mouth_ago
0
130
Claude Teamプランの コスト最適化を考える
rfdnxbro
2
860
指示待ちから変化に応じるClaude Codeへ!~環境からAgentへの帰り道を作る~
gotalab555
9
1.7k
【Oracle AI Spotlight ウェビナー】AWSか、Azureか、Google Cloudか。その議論にオラクルを含める意義。
oracle4engineer
PRO
1
150
Featured
See All Featured
AI Search: Where Are We & What Can We Do About It?
aleyda
0
7.9k
The browser strikes back
jonoalderson
0
1.6k
Crafting Experiences
bethany
1
270
The Mindset for Success: Future Career Progression
greggifford
PRO
0
480
The Illustrated Children's Guide to Kubernetes
chrisshort
51
53k
GraphQLとの向き合い方2022年版
quramy
50
15k
How People are Using Generative and Agentic AI to Supercharge Their Products, Projects, Services and Value Streams Today
helenjbeal
1
300
Exploring the relationship between traditional SERPs and Gen AI search
raygrieselhuber
PRO
2
4.3k
Taking LLMs out of the black box: A practical guide to human-in-the-loop distillation
inesmontani
PRO
3
2.4k
Ruling the World: When Life Gets Gamed
codingconduct
0
310
A brief & incomplete history of UX Design for the World Wide Web: 1989–2019
jct
2
490
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
56
3.5k
Transcript
Flutter入門 永野 峻輔
自己紹介 略歴 • サーバーサイド / フロントエンド 4年 • Swift 3ヶ月
• Flutter 3ヶ月 名前 : エターナルフィールド (永野) Twitter: @ glassmonekey
エアプ含みます。 補足などありましたら気軽にご意 見ください
なぜFlutterか? • 宣言的UIの時代 • 学習コスト低い • ホットリロードで幸せな開発者体験 • 次期モバイルOSに採用
Flutterの特徴 • クロスプラットフォーム向け • 宣言的UIフレームワーク • 言語はDart • 2種類のコンパイル
クロスプラットフォーム Android iOS Web β版なのでこれからに 期待
宣言的UIフレームワーク 少ない記述量で高度な表現 https://github.com/flutter/gallery
宣言的UIフレームワーク 独自レンダリングエンジン ネイティブはプラグイン * 基本機能は公式が用意 * 最終奥義 * 厚くなりそうならFlutterは微妙? *
ネイティブ機能をUI描画で使用せず * ネイティブから見ると1枚のビュー * React Nativeとの差別化ポイント
Dartについて • いわゆるAlter JS の1つ ◦ Type Scriptに押され気味だった • Google製
◦ Googleの新モバイルOSで採用 • 新バージョンではnull安全 • JSが書けるならほぼ書ける。 • 詳しくは右記のサイトで検証 https://dartpad.dev/
2種類のコンパイル JIT (Just In Time) AOT (Ahead of Time )
* 差分コンパイル * ホットリロードが速い理由 * 開発用 * ウェブアプリと同じ開発体験 * 事前コンパイル * 本番時に全てネイティブ化 * 本番用 * 高パフォーマンスの理由 厳密にはDartの特徴
エコシステム • ライブラリ関係 ◦ https://pub.dev/ ◦ スターとかgithubの更新状況から使用を検討。 ◦ プラグインの場合はネイティブの実装状況も念の為確認しておいたほうがよい •
静的解析 (Analyzer for dart) ◦ https://pub.dev/packages/analyzer ◦ 設定はFlutter公式のものをコピって始めるのが良さそう ◦ https://github.com/flutter/flutter/blob/master/analysis_options.yaml
個人的所感 • ホットリロードが幸せ ◦ UIの調整がすごく楽。 • Android・iOSのデザインはどちらかに寄せことが吉 ◦ Google系コミュニティなのでMaterialデザインが今は良さそう。 •
純粋なDart系ライブラリの充実が待たれる ◦ ユニットテストでネイティブ依存がある機能のモック化が必須 ◦ Flutter for Webの弊害になりそう。
宣言的UIの時代です。 ぜひFlutterに入門しましょう!! 一緒にOSS貢献始めてみませんか?
参考 基礎から学ぶFlutter https://www.amazon.co.jp/dp/B082XQ81FH/ref=dp-kindle-redirect?_encoding=UTF8&btkr=1 Why Flutter Users Dart https://hackernoon.com/why-flutter-uses-dart-dd635a054ebf