Migration from React Native to PWA

#jsconfjp #jsconfjp_b Migration from React Native to PWA
Migration from React Native to PWA
@ohbarye
JSConf JP 2019-12-01
Photo by Harshil Gudka on Unsplash

View Slide

#jsconfjp #jsconfjp_b Migration from React Native to PWA 2
Introduction
https://2018.stateofjs.com/mobile-and-desktop/react-native/

View Slide

Introduction
https://2018.stateofjs.com/mobile-and-desktop/overview/
https://2018.stateofjs.com/mobile-and-desktop/other-libraries/

View Slide

➔ React Native appからPWAに移行するに至った経緯
➔ 以下の開発・運用、および1から2への移行で学んだこと
1. iOS / Androidの2プラットフォームに対応するReact Native app
2. iOS / Android / Webの3プラットフォームに対応するPWA / Hybrid
app
➔ 移行時の技術選定の判断基準
この発表の目的、価値、参加者に届けたいこと
4
Introduction
What's Hybrid app?
ブラウザ上でなくNative appの
WebView上でHTML, JS, CSSが動作する
(通称ガワアプリ)

View Slide

➔ React Nativeとは何か
◆ ReactでNative appが開発できるやつ、ぐらいの認識でOK
➔ PWAとは何か
◆ Googleが推進する、モバイルユーザーの体験向上を目的とするプロ
ジェクト・技術のこと、ぐらいの認識でOK
➔ React Native、PWAの先進的な利用方法など
話さないこと
5
Introduction

View Slide

➔ クロスプラットフォーム開発フレームワークによるアプリ開発やマルチプラット
フォーム対応を考えている方
➔ すでにネイティブ言語以外でのネイティブアプリ開発・運用をしており、マイグ
レーションを考えている方
➔ React Native, PWAの開発経験は問いません
想定する聞き手
6
Introduction

View Slide

➔ サーバサイド寄りのWeb engineer
◆ React, TypeScript (1.5 years)
◆ Ruby on Rails (4 years)
➔ iOS / Android対応しているReact Nativeアプリの開発・運用に途中から参
加
➔ Migration from React Native to PWA projectを担当
登壇者（どの目線から語るのか）
7
Introduction

View Slide

➔ React Native採用・運用事例は多く聞くが移行事例はまだ少ない
➔ React Native to Native appsはAirbnbを始めにいくつか観測できた
➔ Migration from React Native to PWAの事例は少ない
Migration中に感じた最近の潮流
8
Introduction
https://medium.com/airbnb-engineering/react-native-at-airbnb-f95aa460be1c

View Slide

➔ 「React Native vs PWA」「React Native vs Swift / Kotlin」のような2項対立
で「どちらを選ぶべきか」の観点でメリット・デメリットが語られることは多い
➔ 両方を経験した立場やMigrationという観点で語るものは多くない
➔ 今回実施したMigration from React Native to PWAの事例は誰かの役に
立つかもしれないと思ってやって来ました
Migration中に感じた最近の潮流
9
Introduction

View Slide

➔ 「開発できる≠運用できる」
◆ システム特性、メンバーのスキルセット・志向性を考えよう
◆ 状況が変わることはあるが、チームに合わない技術になったら移行を検
討しよう
➔ モバイルアプリに近い体験が要求されてもWeb技術でそこそこやれる
➔ PWAはフルに活用しなくても十分なシーンは多分にある
はじめにConclusion
10
Introduction

View Slide

Agenda | What kind of React Native app it was?
React Native issues in dev & ops
Migration design
PWA, Hybrid app dev & tests & ops
Review of the migration project
01
02
03
04
05
11

View Slide

What kind of React Native app it was?
01
12

View Slide

➔ Introduction of our products and the app
➔ Characteristics of the React Native app
◆ Business
◆ Features, Usage
◆ Technical aspects
➔ Why was it React Native?
13

View Slide


View Slide

映像授業だけでなく現役大学生コーチがサポート
17
➔ オンラインチャットや学習管理機能・宿題配信機能などを通して、スタディサ
プリを使っている全国の生徒の学習指導を行うサービス
➔ 「一人では勉強が続かない」「教えてもらいたい」「受験の不安を相談したい」
等の受験生の悩みに寄り添い、志望校合格を目指す合格特訓コース
➔ 部活と勉強の両立を目指す中学生へスケジュール作成や学習指導を行う個
別指導コース

View Slide

➔ Introduction of our product
◆ Business
◆ Features, Usage
18

View Slide

➔ 生徒とコーチのコミュニケーションをより
円滑にするためのメッセージ機能をベー
スとした業務システム
➔ より詳しい事業背景はブログ参照
Characteristics (Business)
19
https://quipper.hatenablog.com/entry/2018/11/20/

View Slide

Characteristics (Features)
20
➔ 生徒とのチャット
➔ 宿題配信・進捗管理
➔ コーチ同士のナレッジシェア

View Slide

➔ 約500名のアルバイト社員と業務委託のスタッフが利用する
➔ BYOD (Bring Your Own Devices)
➔ スタッフだけが使用するアプリなので App Store / Google Play Storeで公
開せず、DeployGateでアプリを配信
◆ Apple / Googleのアプリ審査はなし
Characteristics (Usage)
21

View Slide

➔ React NativeでiOS / Android両プラットフォーム対応
◆ iOS版は約2年運用
◆ Android版は約1年運用
➔ 画面数15、利用するバックエンドのAPIは約40
◆ フロントのすべての機能がReactで実装されている
Characteristics (Technical aspects)
22

View Slide

➔ Introduction of our product
◆ Business
◆ Features, Usage
23

View Slide

➔ 生徒とのチャットを促進させるPush通知活用は必須だったため、2017年当
初はSwiftによるiOSアプリ開発を試していたが方針転換
➔ 組織面: ネイティブエンジニア不足で、Webエンジニアを巻き込んで開発・運
用する体制を作りたかった
➔ 技術面: Apple Developer Enterprise Programを利用して配布するため
App Storeの自動アップデート機能が使えずアプリの更新を都度手動で実
施するオペレーションが必要になっていたのをCodePushで解決
Why was it React Native?
24

View Slide

➔ 組織的・技術的課題を解決しながらエンドユーザーにも価値を届けることが
できた
➔ 技術的挑戦もありエンジニアも楽しく開発できた
➔ 当時の同じ状況に自分がいたらReact Nativeを選ぶことに同意した
➔ 詳しくは『QuipperにおけるReact Native活用事例』
https://quipper.hatenablog.com/entry/2017/12/05/114014 参照
当時の技術選定を振り返ると
25

View Slide

02
26

View Slide

➔ 既存の土台の上にUIをガリガリ書いていくぶんには大変ではない
➔ React (+ Redux, TypeScript) の知識があればだいたい十分
➔ 当初の目論見どおりWebエンジニアを活用してネイティブアプリの開発がで
きてよかった
➔ …が、ローンチ後に起きたいくつかの変化により課題が発生
React Nativeの開発
27

View Slide

➔ ローンチ以降に起きた変化
➔ 浮き彫りになったつらいところ
◆ マルチプラットフォーム対応
◆ ライブラリ管理、React Native Upgrade
◆ ビルド・デプロイシステム
➔ 状況の分析とまとめ
28

View Slide

➔ 端末配布をやめ、BYOD化す
ることに
➔ コーチのエンゲージメント向上
とコスト削減が目的
➔ これに伴いiOSだけでなく
Android版の提供を開始
BYOD化
Photo by Hal Gatewood on Unsplash

View Slide

➔ iOS, Android, React Native全
てに精通したエンジニアの退職
➔ 他のプロジェクトを担当するiOS /
Android / Webエンジニアそれぞ
れで協力してメンテナンスをしてい
くことになった
Photo by Katherine Chase on Unsplash
諸事情によりチームメンバー総入れ替え

View Slide

31

View Slide

マルチプラットフォーム対応
➔ Android対応を開始した時点から格段に運用コストが高くなった
➔ iOSで動くがAndroidでは動かない既存機能がかなりあった
➔ 自分たちのコードの問題だけではなく、React Native関連のUIライブラリに
はiOS / Android両方を完全にサポートしていないものも多い
32

View Slide

https://quipper.hatenablog.com/entry/2019/04/10/react-native-from-android

View Slide

Androidエンジニアの気持ち
最初はTypeScriptやReact/Reduxの考え方に新しく触れ、修正したものがすぐア
プリに反映される感覚に興奮していた気がします。Androidのみで起こる問題に
携わっていくにつれ、だんだんビルド周りの設定の調査や改修する時間が長く
なっていった (中略)
React Nativeアプリで起こる不具合は、通常のNative開発で感じるような「あっこ
こがこうなってバグっているんだな」となんとなく推測できる不具合は少なく、調査
する箇所を絞り込むことができない苦しさを感じることも多かった
34

View Slide

iOSエンジニアの気持ち
バグ修正などを行う際にJavaScriptレイヤーで起きているのか、Nativeレイヤー
で起きているのかの切り分けをする必要があります。また、iOSとAndroidのどちら
かでしか発生しない不具合があるなど、アプリとWebフロントエンドの総合的な知
識が求められるように感じました。
アプリを構成する要素がTypeScript, React+Redux, レイアウトはJSXなどフロント寄
りの知識が開発の際には求められます。普段SwiftやKotlinに慣れ親しんでいる
Nativeエンジニアにとって、想定通りに開発が進まず、もどかしい気持ちになるこ
ともありました
https://quipper.hatenablog.com/entry/2019/03/11/react-native-pro-con
35

View Slide

36

View Slide

➔ NPMの他にiOS / Androidでは各々のパッケージ管理システムがある
➔ React Nativeではパッケージ管理システムをまたいだ暗黙の依存関係が存
在することがある
➔ パッケージ管理システムをまたいだ依存関係は定義できないので人間が管
理する必要がある
ライブラリ管理
37

View Slide

Implicit dependencies
38
この間の依存関係はいずれの
パッケージ管理システムも関与しない
この依存関係は
NPMやYarnで管理
される

View Slide

Implicit dependencies
39
2.0.0
C, Dもupgradeしないといけないが、そのことにパッ
ケージ管理システムではなく人間が気づく
2.0.0
$ yarn upgrade A
A 2.0.0 depends on
- B 2.0.0
- C 2.0.0
- D 2.0.0
It upgrades B ✅
大抵コンパイルエラー、ビルド失敗、テスト失敗などで
問題に気づくので原因調査が大変

View Slide

React Native Upgrade
40
➔ iOSのバージョンアップデートに伴って必須となる
➔ Need to upgrade Xcode => Need to upgrade React Native => Need
to upgrade React etc.
➔ 0.49.0 -> 0.57.4になるまで1年近く放置してしまった
◆ モブプロしたりしたが、アップグレードに至らなかった
➔ ちなみにExpoは未使用だった

View Slide

41

View Slide

ビルド・デプロイシステム
42
➔ iOS, Androidそれぞれのnative知識が必要
➔ 先述のライブラリ管理の問題なども絡み、油断すると壊れる
➔ 壊れているのをマシにするレベルの作業をiOS / Androidエンジニアに1ヶ月
近くかけてやってもらった
➔ 他案件もあり、このために時間をさらに使うのは厳しかったので撤退判断

View Slide

43

View Slide

マルチプラットフォーム
対応
に
精通した
エンジニアの退職
推進
対応の要請
ビルド・デプロイ
システムの整備
に起因する問題
チームメンバー
入れ替え
状況の分析
チームの変化
ローンチ以降に起きた変化
変化にチームが対応で
きていない…?

View Slide

➔ React Nativeに起因する課題がある
➔ ローンチ以降に起きた変化により各課題が難化するなど、React Native選
定時に想定していたより運用が難しい状況になった
➔ 今のチームではReact Nativeの開発はある程度まで出来ても、質と速度を
保つ運用が難しい
➔ 技術単体の良し悪しではなく「チームに合っていない」
状況をまとめると
45

View Slide

開発できる
≠
運用できる
46

View Slide

そんな中
47

View Slide

対応
に
精通した
推進
対応の要請
入れ替え
状況の分析
チームの変化
ローンチ以降に起き
た変化が色々難しく
している…?
このアプリ、ブラウザからも使えるよ
うにならないかな？
今後このアプリの位置付けがさらに
大事になりそうです！
機能αと機能βと機能εを今年度中
にはリリースしたい！
エンジニアを頼ってくれる
ステークホルダー達の図

View Slide

対応
に
精通した
推進
対応の要請
入れ替え
状況の分析
チームの変化
している…?
Photo by Adam Birkett on Unsplash

View Slide

脱React Nativeを決断
Photo by Linh Nguyen on Unsplash

View Slide

Migration design
03
51

View Slide

➔ 脱React Nativeの選択肢、技術選定の決め手
➔ どこまでPWAやるか
➔ Architecture / Traﬃc image
➔ Migration strategy
Migration design
52

View Slide

1. PWA for Android, Hybrid app for iOSで書き直す
◆ SPAならいくつも開発・運用しており、知見がある
◆ PWA経験はないがキャッチアップ可能と判断
2. Native言語で書き直す
◆ iOS, Android開発者は社内にいるが希少人材
◆ 運用においてずっと両方に対応し続けるコストは高い
3. Flutterなど別のマルチプラットフォーム対応技術を使う
◆ 社内に知見なし
脱React Native時の選択肢
53

View Slide

対応
に
精通した
推進
対応の要請
入れ替え
状況の分析
チームの変化
している…?
＿人人人人人人人＿
＞　決定的要件　＜
￣￣

View Slide

➔ 以下の理由でPWA, Hybrid app for iOSに決定
◆ Webアプリとして利用したいというニーズ
◆ 3プラットフォームに実装するのに比べてコストが低い
◆ チームにWebエンジニアが多い
◆ SPA, Hybrid app for iOSの経験がある
➔ 「チームで運用可能な技術選定」を中心にした
技術選定の決め手
55

View Slide

その他Webフロントエンドの技術選定
56
➔ 社内で知見があるReact, TypeScript
◆ react-native-webも検討したが旨味が少ないのでやめた
➔ React Nativeのためのライブラリの代替がReact用に存在するか確認
◆ 大抵はUI componentライブラリだったので問題なし

View Slide

➔ モバイル端末におけるPush NotificationsはMUST要件
➔ Android向けはPWAとして開発
➔ iOSはPWAをWebViewで表示するHybrid appとして使う
◆ JSからはNotification Tokenを渡し、通知を受けたあとのハンドリング
はSwiftでやる
◆ iOS appのWebView上で、サーバが返すHTML, JSが動作する（通称、
ガワアプリ）
Push Notifications実現のために
57

View Slide

Migration design
58

View Slide

➔ PWAの構成要素は複数ある
◆ Service worker, client side storage, Push API etc.
➔ 必要に応じて取捨選択ができる
どこまでPWAやるか
59

View Slide

どこまでPWAやるか
60
➔ チャットアプリとして重要な
Push通知、カメラ、バッジの
実装に絞る
➔ さらにモバイルネイティブア
プリに近い体験のための実
装もできるが今回は重要な
要件ではなかったため
Migrationの初期スコープか
らは削った
の要素を要件に含めるか検討した時の表

View Slide

Migration design
61

View Slide

Architecture

View Slide

Traﬃc image
開発したPWAのAssetsはここから配信

View Slide

Migration design
64

View Slide

Migration strategy
65
React Native
移行のための併存期間を設ける
一部の利用者からはフィードバックを募り、
併存期間中にPWA, Hybrid appの改善を行う
移行に関する問題が
なくなり次第クローズ

View Slide

04
66

View Slide

➔ 開発
◆ 実装方針
◆ Hybrid appの工夫した点、苦労した点
◆ PWAの工夫した点、苦労した点
➔ テスト
➔ 運用2ヶ月経過してみて
67

View Slide

68
Product Manager
@shohei-mitsuoka
Frontend Engineer
@nanoShinji
iOS Engineer
@stNamco
VP of Design
@daitorii
UI/UX Designer
@h3dc
Web Engineer
@ohbarye
From nanomedia inc. https://www.nanomedia.jp/

View Slide

➔ 基本的にはReactによるSPA開発、iOSのHybrid app開発、RailsによるAPI
開発
◆ チームメンバーの馴染みのある技術と領域
➔ 実装方針、Hybrid appとしての工夫・ハマった点、PWAとしての工夫・ハ
マった点についていくつか紹介
開発にあたって
69

View Slide

➔ 開発
◆ 実装方針
➔ テスト
70

View Slide

実装方針
71
➔ フロントではiOSよりもTypeScriptにロジックを集約する方針
◆ 問題発生時の切り分けが容易になる
◆ 初期開発以降、iOSの追加開発がほとんど不要になる
● アップデート頻度が減るのでユーザーにメリットがある

View Slide

➔ 開発
◆ 実装方針
➔ テスト
72

View Slide

➔ JSから動的にSwift側のAPIを呼ぶシーンがある
◆ バッジを表示する、statusBarの色を変える etc.
➔ ブリッジコードのインタフェースを定義して共有する
◆ 今回はiOS Engineerにdocumentを書いてもらいつつ、TypeScriptの
型定義も書いた
Hybrid app
73

View Slide

1. Swift側にハンドラを実装
3. userAgentで呼び分ける
2. WKWebView内で動作するときのみ windowに関
数が生えるのでTypeScriptで型を定義

View Slide

➔ iOSアプリのWebViewで動作するアプリはXCodeでビルドして実機にインス
トールし、Remote debugが可能
➔ 通常のWeb開発で利用するdeveloper toolsの知識の延長
◆ これはReact Nativeでも同様
➔ 発生するエラーがReact Nativeに比べて馴染みがあるものばかり
◆ Web engineerがdebugしやすい
Debug for Hybrid app
75

View Slide

➔ キャッシュのレイヤーが増えることに注意
➔ WebViewのキャッシュを無効化するブリッジメソッド、UserDefaultsをクリア
するブリッジメソッドを用意する
◆ Hybrid appでもdebugしやすくなったり、キャッシュの罠を避けられる
Debug for Hybrid app
76
There are only two hard things in Computer Science:
cache invalidation and naming things.
-- Phil Karlton

View Slide

➔ 開発
◆ 実装方針
➔ テスト
77

View Slide

➔ 大変そうというイメージだったがFirebaseSDKが便利で助かった
◆ https://ﬁrebase.google.com/docs/cloud-messaging/js/receive
➔ フォアグラウンド・バックグラウンドそれぞれにおいての通知受信時のコール
バックを書いていく
PWA - Push Notiﬁcations
78
For foreground
For background

View Slide

➔ onMessageがAndroid PWAの場合のみ発火しない問題に直面 (未解決)
PWA - Push Notiﬁcations
79
◆ Chrome browserでは
動く
➔ バックグラウンド・フォアグラ
ウンドともにPushEventを
listenする形だと動いた
➔ https://developer.mozilla.org/en-
US/docs/Web/API/PushEvent

View Slide

PWA - Badge
80
設定画面からEnableすることはできる
すると以下のコードが動く
Android PWAではバッジを表示するAPIはExperimental
(Chrome 73からOrigin Trial)
通知が届く
今回はバッジは要件
から外した

View Slide

➔ Chrome browserでは動くがAndroid PWAでは動かない、など実行環境差
異に悩むことはある
➔ 以下の要因で多少コードが複雑になったが許容範囲
◆ iOSのSwift側でなくTypeScript側にロジックを寄せた
◆ プラットフォーム判定による分岐が多少必要
➔ 社内外でAndroid PWAに詳しい人を捕まえておければなお良かった
PWA側の開発に関する所感
81

View Slide

➔ 開発
◆ 実装方針
➔ テスト
82

View Slide

➔ Snapshot testing中心
➔ React component testingはreact-test-rendererで書いていた
➔ E2E/Integration testingは無し
➔ Unit testはPASSするが動かすと壊れているという事態が多くあった
React Native時代のテスト
83

View Slide

PWA移行後のテスト方針
➔ Integration Testing with Cypress
◆ https://www.cypress.io
➔ Bridge周りや複雑なロジックをUnit Testでカ
バー
➔ Snapshot testingはやらない方向
➔ Hybrid app、マルチプラットフォーム対応は手
動テストでカバーしているのが課題
84
右図は https://testingjavascript.com/ より引用

View Slide

➔ 開発
◆ 実装方針
➔ テスト
85

View Slide

➔ PWA, Hybrid app両方ともリリースすると即時に変更が反映される
◆ React NativeにおけるOTAでも同じことをやっていたが、Nativeコード
依存が以前より更に減ったので、ユーザが手動でアプリをアップデート
する回数が削減
◆ Hotﬁxや切り戻しもWeb applicationと同じ
➔ 依存ライブラリの更新も地道に行っている
◆ dependabotを利用 https://dependabot.com/
運用2ヶ月経過してみて
86

View Slide

05 Review of the migration project
87

View Slide

➔ Outcome
➔ What we learned
88

View Slide

Outcome
➔ iOS / Android / Webの3プラットフォームに対応するPWA / Hybrid appを
無事リリースでき、運用できている
➔ 数ヶ月に1度のリリースから週1のリリースサイクルになり、価値を提供する
スピード感を取り戻した
➔ React, Redux, TypeScriptという社内では知見のある安定した技術をベー
スにしつつPWA周辺の知見を獲得できた
89

View Slide

ユーザーの声
優秀なコーチに長く働いてもらう
ために重要な指標を改善できた
実際に利用しているコーチから
Slackで頂いたフィードバック

View Slide

➔ Outcome
➔ What we learned
91

View Slide

開発できる
≠
運用できる
92

View Slide

➔ チームメンバーのスキルセットに合った技術選定こそ大事
◆ 開発できるだけでなく運用できるところまで考える
◆ チームや状況に合わせて技術もアップデートしていく
➔ モバイルアプリに近い体験が要求されてもWeb技術でだいぶやれる
➔ PWAはフルに活用しなくても十分なシーンは多分にある
What we learned
93

View Slide

➔ Engineering Manager in
➔ Engineering Manager Meetup Organizer
➔ Twitter @ohbarye / GitHub @ohbarye
➔ https://ohbarye.hatenablog.jp/
@ohbarye (Masato Ohba)
94
I'm really looking forward to getting
feedbacks from you!

View Slide

Thank you!
95

View Slide

Digression
➔ React Native時代のComponentをどれぐらい再利用したか
◆ デザインも大幅に変えたため再利用Componentsはゼロ
◆ Hooks未対応時代のコードだったのでロジック周りは参考にしつつも書
き直した
➔ Flutterならどうだったのか
◆ 今回は候補から早々に外したのでわかりません
96

View Slide

➔ React Nativeで利用していたライブラリはどうなったか
97
◆ すべて代替可能 or 不要
◆ UI componentを提供するだけ
のライブラリがほとんど
◆ 一箇所でしか使わないもの、
Androidのためだけに入れてい
るものなどある
◆ 1年以上更新がないものもそこ
そこあった

View Slide

➔ React Native for Webはどうですか
◆ 検討したが見送った
◆ React Nativeが提供するcomponentのほとんどについては互換性の
あるcomponentを提供している。しかし3td partyのUI componentラ
イブラリをカバーしているわけではない。ライブラリが対応してない限り
は自前で実装する事になる
◆ Bootstrapのように「ある程度仕上がったUI component集」としての価
値もある。しかし今回はデザインも大きく変更し、自前で大部分を書くこ
とになった。component集としても利用する価値は高くないと考えた

View Slide

➔ Android PWAでリリース前の審査を避ける
◆ Google Play Storeの審査に時間がかかるようになった
◆ "一部のアプリで審査時間が長くなる可能性があります（最大で 7 日程
度ですが、例外的にもっとかかる場合があります）。"
https://support.google.com/googleplay/android-developer/answer/6334282
◆ Webサイトにアクセスしてから「Add to Home Screen」するPWAの場
合はこの問題に直面しない

View Slide

➔ Android対応から見つめるReact Native
➔ ReactNativeに入門して感じたこと
https://quipper.hatenablog.com/entry/2019/03/11/react-native-pro-con
➔ 合格特訓コースの大学生コーチの業務用アプリ爆速開発で生徒が幸せになった話
https://quipper.hatenablog.com/entry/2018/11/20/
➔ QuipperにおけるReact Native活用事例
https://quipper.hatenablog.com/entry/2017/12/05/114014
➔ Google Developers - Progressive Web Apps
https://developers.google.com/web/progressive-web-apps
References
100

View Slide

➔ JSConf 2019 Proposal https://scrapbox.io/ohbarye/JSConf_2019_Proposal
➔ ネイティブアプリWEBViewでRemote Debug まとめ
https://qiita.com/ryurock/items/4a6198e8bc64e268ac2e
➔ Badging for app icons https://web.dev/badging-api/
➔ Badging API Explainer https://github.com/WICG/badging/blob/master/explainer.md
➔ Static vs Unit vs Integration vs E2E Testing for Frontend Apps
https://kentcdodds.com/blog/unit-vs-integration-vs-e2e-tests
➔ Why I Never Use Shallow Rendering
https://kentcdodds.com/blog/why-i-never-use-shallow-rendering
101

View Slide

➔ PWA 入門〜iOS SafariでPWAを体験するまで〜
https://qiita.com/umamichi/items/0e2b4b1c578e7335ba20
➔ ガワネイティブアプリを作るときに必要な技術
https://qiita.com/noboru_i/items/bc39d95638e9e55437fa
➔ Progressive web apps - MDN web docs
https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps
➔ 社内勉強会TechLunchで Badging API について発表しました
https://developer.medley.jp/entry/2019/08/27/174256
102

View Slide

Migration from React Native to PWA

Migration from React Native to PWA

Masato Ohba

More Decks by Masato Ohba

Other Decks in Technology

Featured

Transcript