Upgrade to Pro — share decks privately, control downloads, hide ads and more …

React+PWA

 React+PWA

Masashi Hirano

August 01, 2017
Tweet

More Decks by Masashi Hirano

Other Decks in Programming

Transcript

  1. PWAのブラウザ対応状況 Chrome ‒> Desktop, Androidで利用可能 Chromium派生(Operaなど) ‒> Chrome と同じく利用可能 Firefox

    ‒> Web App Manifestの機能以外 は利用可能 Safari ‒> 未対応。Service Workerが動か ない Edge ‒> 対応予定 IE ‒> 当然未対応です
  2. やってみたこと(導入~デプロ イ) $ npm install -g create-react-app $ create-react-app react-pwa-app

    $ cd react-pwa-app $ npm install && npm run build $ git add . && git commit -m "initial commit" $ npm install -g gh-pages $ gh-pages -d build
  3. 参考 ・ ・ ・ ・ ・ ・ はじめてのプログレッシブ ウェブアプリ 脱ネイティブ!Googleが推進する「PWA」にたった数時間で対応する

    方法 サンプルコードで学ぶPWA Getting Started with Progressive Web Apps Production Progressive Web Apps With JavaScript Frameworks (Google I/O '17) How we built Twitter Lite