pwa-online-hackathon

所属分类:系统/网络安全
开发工具:JavaScript
文件大小:0KB
下载次数:0
上传日期:2017-06-26 08:43:19
上 传 者sh-1993
说明:  普华永道在线黑客马拉松,,
(pwa online hackathon,,)

文件列表:
.firebaserc (62, 2017-06-26)
announcement.html (910, 2017-06-26)
config/ (0, 2017-06-26)
config/env.js (1102, 2017-06-26)
config/jest/ (0, 2017-06-26)
config/jest/CSSStub.js (21, 2017-06-26)
config/jest/FileStub.js (35, 2017-06-26)
config/paths.js (2105, 2017-06-26)
config/polyfills.js (613, 2017-06-26)
config/webpack.config.dev.js (9083, 2017-06-26)
config/webpack.config.prod.js (10022, 2017-06-26)
database.rules.json (611, 2017-06-26)
firebase.json (203, 2017-06-26)
functions/ (0, 2017-06-26)
functions/index.js (5498, 2017-06-26)
functions/package.json (186, 2017-06-26)
package.json (2946, 2017-06-26)
public/ (0, 2017-06-26)
public/Icon-196.png (22532, 2017-06-26)
public/OneSignalSDKUpdaterWorker.js (101, 2017-06-26)
public/OneSignalSDKWorker.js (101, 2017-06-26)
public/favicon.ico (1150, 2017-06-26)
public/images/ (0, 2017-06-26)
public/images/hero-bg.jpg (36955, 2017-06-26)
public/images/home-header.jpg (272753, 2017-06-26)
public/images/og.png (474534, 2017-06-26)
public/images/prize-header.jpg (176531, 2017-06-26)
public/images/resource-header.jpg (283033, 2017-06-26)
public/images/rules-header.jpg (374419, 2017-06-26)
public/images/sponsor-header.jpg (392760, 2017-06-26)
public/index.html (3234, 2017-06-26)
public/manifest.json (414, 2017-06-26)
scripts/ (0, 2017-06-26)
scripts/build.js (7886, 2017-06-26)
scripts/start.js (11218, 2017-06-26)
scripts/test.js (485, 2017-06-26)
src/ (0, 2017-06-26)
src/App.js (452, 2017-06-26)
... ...

- [What's this project?](https://github.com/bkkjs/pwa-online-hackathon/blob/master/#whats-this-project) - [What changes were made?](https://github.com/bkkjs/pwa-online-hackathon/blob/master/#what-changes-were-made) - [Adding in a service worker](https://github.com/bkkjs/pwa-online-hackathon/blob/master/#adding-in-a-service-worker) - [Adding in a Web App Manifest](https://github.com/bkkjs/pwa-online-hackathon/blob/master/#adding-in-a-web-app-manifest) - [Adding in a GitHub deployment step](https://github.com/bkkjs/pwa-online-hackathon/blob/master/#adding-in-a-github-deployment-step) - [What additional changes might be needed?](https://github.com/bkkjs/pwa-online-hackathon/blob/master/#what-additional-changes-might-be-needed) - [I've added in React Router and now my URLs don't work offline](https://github.com/bkkjs/pwa-online-hackathon/blob/master/#ive-added-in-react-router-and-now-my-urls-dont-work-offline) - [I'm using cross-origin APIs or resources, and they aren't working while offline](https://github.com/bkkjs/pwa-online-hackathon/blob/master/#im-using-cross-origin-apis-or-resources-and-they-arent-working-while-offline) - [How can I try out the Progressive Web App?](https://github.com/bkkjs/pwa-online-hackathon/blob/master/#how-can-i-try-out-the-progressive-web-app) - [How can I report bugs?](https://github.com/bkkjs/pwa-online-hackathon/blob/master/#how-can-i-report-bugs) ## What's this project? This is one approach to taking a project created with the [`create-react-app`](https://github.com/bkkjs/pwa-online-hackathon/blob/master/https://github.com/facebookincubator/create-react-app) tool and adding in some additional bits commonly found in [Progressive Web Apps](https://github.com/bkkjs/pwa-online-hackathon/blob/master/https://developers.google.com/web/progressive-web-apps/). ## What changes were made? GitHub's visual diff shows [all the changes needed](https://github.com/bkkjs/pwa-online-hackathon/blob/master/https://github.com/jeffposnick/create-react-pwa/compare/c-r-a-0.6.0...c-r-pwa-0.6.0) to make a Progressive Web App. They include: ### Adding in a service worker The service worker that's generated will ensure that the local images, JavaScript, CSS, and HTML for your web app will be cached and continue to work, even when a user is offline. It also will save bandwidth and improve performance while users are online, by only making network requests for those local resources when there's actually an update that's been deployed. A [`sw-precache`](https://github.com/bkkjs/pwa-online-hackathon/blob/master/https://github.com/GoogleChrome/sw-precache) dependency was added to `package.json`, and the `npm run build` command has been updated to call the `sw-precache` command-line interface after the `webpack` build process is completed. `sw-precache` generates a `service-worker.js` file that will automatically cache the other static files in the `build/` directory, and keep them up to date when you deploy changes. Code to register the service worker was also added to `index.html`. The service worker is only generated as part of the production build, so the development environment will continue to work as before. When running a production server locally, make sure you use a different port than `3000`, to ensure the service worker does not inadvertantly take control of the development environment. ### Adding in a Web App Manifest A [web app manifest](https://github.com/bkkjs/pwa-online-hackathon/blob/master/https://developers.google.com/web/updates/2014/11/Support-for-installable-web-apps-with-webapp-manifest-in-chrome-38-for-Android?hl=en) provides metadata about your web app. Along with a service worker, your web app needs a manifest in order to trigger the Add to Homescreen prompt (in supported browsers). ## What additional changes might be needed? By following the [changes made](https://github.com/bkkjs/pwa-online-hackathon/blob/master/https://github.com/jeffposnick/create-react-pwa/compare/c-r-a-0.6.0...c-r-pwa-0.6.0), you should end up with a Progressive Web App using React that's ready to be deployed to any static hosting environment. However, if you add in additional functionality to the starting point, you may need to update your `sw-precache` settings to ensure the service worker behaves properly. ### I've added in React Router and now my URLs don't work offline If you've followed the suggestions in the `create-react-app` documentation and added in [React Router](https://github.com/bkkjs/pwa-online-hackathon/blob/master/https://github.com/reactjs/react-router) using the History API to manage URLs, then you need to tell the service worker that navigations to all the random URLs your web app now supports should actually be fulfilled with the cached copy of your `index.html`. You can do this with the [`navigateFallback`](https://github.com/bkkjs/pwa-online-hackathon/blob/master/https://github.com/GoogleChrome/sw-precache#navigatefallback-string) option in `sw-precache`. Assuming you're using the `sw-precache-config.js` configuration file, the additional option would look like `navigateFallback: 'index.html'`. ### I'm using cross-origin APIs or resources, and they aren't working while offline The service worker generated by default by `sw-precache` only handles requests for local, static resources, like your images, JavaScript, CSS, and HTML. Requests made at runtime for, e.g., APIs or images that live on other servers won't be handled by the default `sw-precache` setup. This means they will stop working offline. The [`sw-toolbox`](https://github.com/bkkjs/pwa-online-hackathon/blob/master/https://github.com/GoogleChrome/sw-toolbox) allows you to set up runtime caching strategies, using URL patterns to determine what strategy and cache sizes to use. `sw-precache` provides an easy way to use `sw-toolbox` via the [`runtimeCaching`](https://github.com/bkkjs/pwa-online-hackathon/blob/master/https://github.com/GoogleChrome/sw-precache#runtimecaching-arrayobject) configuration option. ## How can I try out the Progressive Web App? The code from this project is deployed at https://jeffposnick.github.io/create-react-pwa/ ## How can I report bugs? If you've found a bug in the code output by `create-react-app`, please let the project maintainers know in their [issue tracker](https://github.com/bkkjs/pwa-online-hackathon/blob/master/https://github.com/facebookincubator/create-react-app/issues). If you've found an issue specific to the Progressive Web App bits (the service worker, the Web App Manifest, etc.), then please let us know in this project's [issue tracker](https://github.com/bkkjs/pwa-online-hackathon/blob/master/https://github.com/jeffposnick/create-react-pwa/issues).

近期下载者

相关文件


收藏者