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
Expo & Amplifyを使ってWebとアプリを同時開発した話
Search
cohe aoki
March 04, 2021
Programming
2
910
Expo & Amplifyを使ってWebとアプリを同時開発した話
cohe aoki
March 04, 2021
Tweet
Share
More Decks by cohe aoki
See All by cohe aoki
Amplify Boostup #2 Multi project using monorepo
coa00
0
41
LLMを使ったチームのプロダクト開発の生産性を向上させる取り組み
coa00
0
29
Amplify Boostup #2 monorepo 運用による複数プロジェクト開発
coa00
0
580
サーバレス技術を活用したエンジョイ スピード開発
coa00
1
320
【Amplify Japan UG x Startup】Amplify チームによる プロダクト開発
coa00
0
610
Expo と Amplifyを使って Webとアプリを同時開発
coa00
0
1.4k
Other Decks in Programming
See All in Programming
[JAWS-UG横浜 #80] うわっ…今年のServerless アップデート、少なすぎ…?
maroon1st
0
150
Fibonacci Function Gallery - Part 2
philipschwarz
PRO
0
230
はてなにおけるfujiwara-wareの活用やecspressoのCI/CD構成 / Fujiwara Tech Conference 2025
cohalz
3
3.2k
rails newと同時に型を書く
aki19035vc
6
750
自分ひとりから始められる生産性向上の取り組み #でぃーぷらすオオサカ
irof
8
2.2k
watsonx.ai Dojo #6 継続的なAIアプリ開発と展開
oniak3ibm
PRO
0
270
CNCF Project の作者が考えている OSS の運営
utam0k
5
620
ペアーズでの、Langfuseを中心とした評価ドリブンなリリースサイクルのご紹介
fukubaka0825
1
200
Moscow Python Meetup №97. Константин Крестников (Техлид команды GigaChain (SberDevices)). GigaChain: Новые инструменты для разработки агентов на примере агента техподдержки
moscowdjango
PRO
0
100
ISUCON14感想戦で85万点まで頑張ってみた
ponyo877
1
790
混沌とした例外処理とエラー監視に秩序をもたらす
morihirok
18
3.3k
Java Webフレームワークの現状 / java web framework at burikaigi
kishida
9
2k
Featured
See All Featured
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9.2k
Music & Morning Musume
bryan
46
6.3k
Stop Working from a Prison Cell
hatefulcrawdad
267
20k
The Cost Of JavaScript in 2023
addyosmani
47
7.3k
Scaling GitHub
holman
459
140k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
6
220
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
356
29k
Raft: Consensus for Rubyists
vanstee
137
6.7k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
280
13k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
49
2.2k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
192
16k
Intergalactic Javascript Robots from Outer Space
tanoku
270
27k
Transcript
Expo と Amplifyを使ってWeb とアプリを同時開発した話 @coa00
自己紹介 coa00 (あおきこうへい) • フロントエンド/UIUX が専門で、デザインとかもやります。 • フリーで主にフロントエンドのディレクションから開発までやってき ました。 •
メディアアートが大好きで Arduino, GLSLとかやっていました。 • 2020年から O:という会社で CTOやってます。 Twitter: coa00 https://qiita.com/coa00
Expo Amplify でえもいマネージメントツールをつくりま した
1コードでマルチプラットフォーム対応
Amplifyとは - AWSの各サービスと結合してワンクリックで公開で きるアプリケーション構築環境 - JavaScript、React、Angular、Vue、Next.js、 Android、iOS、React Native、Ionic、Flutter に対 応
Amplify 構成 - 標準的な流れにしたがうと、認証 はCognito、ストレージはS3、 API は AppSyncを使う - Web,
アプリ同様の構成が適用 可能 - AppSync はリアルタイム処理を 得意としており、アプリケーション むけ。
認証の実装方法 - Amplify UI Componentsが用意されており、簡単な 実装で認証の実装ができる。(ハイブリットとなると Web とネイティブで使うライブラリをわける必要があ る)
アプリケーション構成 • Web は React Native Web • ネイティブは React
Native React Native Web 優秀である程度、Webでも快適に動きました。 • UI ライブラリ ◦ React Native Paper ◦ Material UI (Webだけ)
Webとネイティブの動作わけ • WebをすべてRNでつくってしまうと体験 的におとってしまうところがでてしまう。 • ファイル拡張子をつかってコンポーネント をだしわけすることができる。 • Props を同一にすると意識することなく
使える。
自動公開 &Deploy • Amplify には標準でCode Deploy環境がついており、そこに expo の publish を追加するだ
け、Webとアプリの自動公開が可 能(OTA) • Webの公開と同時にアプリの更 新がはいるので超らくらく。
プッシュ通知 • Amplify は lambda の作成が可能。スケ ジュール動作もできる。 • expo-server-sdk を中でよぶことで、push通
知を送信する。 • 大量の通知には Amazon Pinpoint を使う
Amplify はまりどころ • Amplify の UI がネイティブとWebでかなり違う。 • AppSync のサブスクライブを停止しないとタイムアウトエラーでアプリケー
ションが落ちる • AppSync のサブスクライブをこまめにとめないと 同時接続数100をつかい きてしまう。
ごせいちょうありがとうございました