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
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
glassmonenkey
April 12, 2020
Technology
620
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
510
encoding/json/v2で何が変わるか
nagano
14
5.1k
アジャイルテストの4象限で考える プロダクト開発の品質への向き合い方
nagano
1
2.5k
パッケージ管理ツール Ryeへの旅路
nagano
1
630
PHPerにとってのWebAssemblyの可能性
nagano
1
1.6k
PHPをブラウザで動かす技術
nagano
0
2.9k
PHPとWebAssembly
nagano
19
6.6k
アジャイルで始める データ分析基盤構築
nagano
1
3.7k
Goで始めるTDD
nagano
1
3.1k
Other Decks in Technology
See All in Technology
Oracle AI Database@Google Cloud:サービス概要のご紹介
oracle4engineer
PRO
6
1.5k
やさしいA2A入門
minorun365
PRO
2
130
もりもり新機能を一挙紹介! AgentCoreに入門して、AWS上にAIエージェントを構築しよう
minorun365
PRO
6
850
新規ゲーム開発におけるAI駆動開発のリアル
202409e2
0
2.9k
関西に縁あるMicrosoft MVPsが語るCopilotの未来
kasada
0
1.2k
AgentGatewayを試してみたかった
tkikuchi
0
120
Djangoユーザが知っ得なPostgreSQL機能 - 設計の選択肢を増やす / Djang-use-PostgreSQL
soudai
PRO
0
210
製造業のクラウド活用最適解〜AI,DXを加速するデータ基盤の作り方〜
hamadakoji
0
410
LLMと共に進化するプロセスを目指して
ymatsuwitter
12
3.6k
AI-DLCを活用した高品質・安全なAI駆動開発実践 / AI Driven Development
yoshidashingo
1
380
個人の発見を、組織の知恵に 〜生成AI活用を"探索"から"組織の仕組み"へ〜
kintotechdev
3
1.1k
非定型業務をAI slackbotで自動化する ~ 社内要望を自動壁打ちするbotを作った ~/automating-ad-hoc-work-with-ai-slackbot
shibayu36
0
190
Featured
See All Featured
Information Architects: The Missing Link in Design Systems
soysaucechin
0
960
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
6k
Leo the Paperboy
mayatellez
7
1.8k
Building Applications with DynamoDB
mza
96
7.1k
Getting science done with accelerated Python computing platforms
jacobtomlinson
2
220
Why You Should Never Use an ORM
jnunemaker
PRO
61
9.9k
Making Projects Easy
brettharned
120
6.7k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
133
19k
Bash Introduction
62gerente
615
210k
A Tale of Four Properties
chriscoyier
163
24k
Imperfection Machines: The Place of Print at Facebook
scottboms
270
14k
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