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
okinari
October 10, 2018
Technology
0
23
Flutterで簡単なアプリを作ってみる
okinari
October 10, 2018
Tweet
Share
More Decks by okinari
See All by okinari
AWS Lambda(+API Gateway)でバイナリを扱う話
okinari
0
74
僕の家からリモコンが消えた話(NatureRemoについて)
okinari
0
53
コンストラクタ、知ってますよね?
okinari
1
100
スマートスピーカーのすゝめ
okinari
0
43
最近のNAS製品事情
okinari
0
47
Webマーケティングとは?
okinari
0
34
エンジニアにも知ってほしいWebマーケティングの世界
okinari
2
380
データ収集のすゝめ
okinari
1
290
FlutterをWEBエンジニアが扱ってみたお話
okinari
0
450
Other Decks in Technology
See All in Technology
エンジニア採用から始まる技術広報と組織づくり/202506lt
nishiuma
8
1.6k
vLLM meetup Tokyo
jpishikawa
1
210
Autonomous Database サービス・アップデート (FY25)
oracle4engineer
PRO
2
760
Workflows から Agents へ ~ 生成 AI アプリの成長過程とアプローチ~
belongadmin
3
150
Amazon Q Developer for GitHubとAmplify Hosting でサクッとデジタル名刺を作ってみた
kmiya84377
0
3.4k
Digitization部 紹介資料
sansan33
PRO
1
4.2k
Tenstorrent 開発者プログラム
tenstorrent_japan
0
310
ユーザーのプロフィールデータを活用した推薦精度向上の取り組み
yudai00
0
290
原則から考える保守しやすいComposable関数設計
moriatsushi
2
240
成立するElixirの再束縛(再代入)可という選択
kubell_hr
0
240
Claude Code どこまでも/ Claude Code Everywhere
nwiizo
43
25k
RubyOnRailsOnDevin+α / DevinMeetupJapan#2
ginkouno
0
330
Featured
See All Featured
GraphQLとの向き合い方2022年版
quramy
46
14k
Navigating Team Friction
lara
186
15k
Fireside Chat
paigeccino
37
3.5k
Optimizing for Happiness
mojombo
379
70k
Making Projects Easy
brettharned
116
6.2k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
26k
Building an army of robots
kneath
306
45k
How to Think Like a Performance Engineer
csswizardry
24
1.7k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
6
690
Done Done
chrislema
184
16k
We Have a Design System, Now What?
morganepeng
52
7.6k
Code Reviewing Like a Champion
maltzj
524
40k
Transcript
Flutterで簡単なアプリを 作ってみる
Self-introduction Name: okinari Twitter:@okinari Job: Web Engineer (Marketing Engineer) Interested:Flutter(Dart)
/ Elixir / Python / node.js Flutter歴: 1ヶ月くらい 2
1. Flutterって何?
Flutterとは? ・クロスプラットフォームモバイルUIフレームワーク - iOSとAndroidのネイティブアプリが 1つのコードで作れる ・Google製 ・Dartlang(プログラミング言語) ・FLOSS(Free/Libre and Open
Source Software) 4
Flutterとは? ・豊富なWidget(UIパーツ)が準備されている - Widgetを組み合わせていき、画面を作成する ・ホットリロード機能 - かなり高速(少しの修正なら1秒程度)で、 状態を保存したままリロード可能 ・ステートフル(状態を保持) 5
Flutterとは? ・Google製だから、それなりに安心 ・公式リファレンスが全部英語で… ・環境構築のための依存関係確認ツールがついてる - flutter doctor コマンド - 問題があるとこの指摘、解決法を教えてくれる
・豊富なプラグイン(https://pub.dartlang.org/) pub:npm、gem、composer、pip等と同じ 6
Flutterで簡単なアプリを作ってみる Flutterで WebSocketを使ってみた
WebSocket使ってみた ・main関数 - 特殊関数、最初に呼び出し(dartlang) ・StatelessWidget、StatefulWidget - 状態を管理するために使用 ・State<T> - 実際の各状態を表す
・setState関数内部で変数等を変更することで、 状態を変更する 8
WebSocket使ってみた ・公式のCookbookに情報あります https://flutter.dev/docs/cookbook/networking/web-sockets 9
WebSocket使ってみた ・WebSocketの接続 IOWebSocketChannel.connect('ws://echo.websocket.org'); ・送信 channel.sink.add('send string'); 10
WebSocket使ってみた ・受信 11 StreamBuilder( stream: widget.channel.stream, builder: (context, snapshot) {
return Text(snapshot.hasData ? '${snapshot.data}' : ''); }, );
WebSocket使ってみた demo 12
PRタイム
14 Thanks! 質問は下記までお願いします。 ◂ @okinari (Twitter)