All Projects → whilelucky → pwa

whilelucky / pwa

Licence: MIT license
An opinionated progressive web app boilerplate

Programming Languages

javascript
184084 projects - #8 most used programming language
CSS
56736 projects
HTML
75241 projects

Projects that are alternatives of or similar to pwa

Pwa
An opinionated progressive web app boilerplate
Stars: ✭ 353 (-0.56%)
Mutual labels:  postcss, react-router, universal, pm2
react-ssr-spa
Server side rendered single page app using reactjs official libraries.
Stars: ✭ 30 (-91.55%)
Mutual labels:  react-router, universal, pm2
Arc
React starter kit based on Atomic Design
Stars: ✭ 2,780 (+683.1%)
Mutual labels:  react-router, universal
React Ssr Setup
React Starter Project with Webpack 4, Babel 7, TypeScript, CSS Modules, Server Side Rendering, i18n and some more niceties
Stars: ✭ 678 (+90.99%)
Mutual labels:  postcss, react-router
Starter Lapis
Cutting edge starter kit
Stars: ✭ 72 (-79.72%)
Mutual labels:  postcss, react-router
React Redux Styled Hot Universal
react boilerplate used best practices and focus on performance
Stars: ✭ 147 (-58.59%)
Mutual labels:  react-router, universal
React Cnodejs.org
Material UI version of cnodejs.org, the biggest Node.js Chinese community.
Stars: ✭ 242 (-31.83%)
Mutual labels:  react-router, pm2
React Cool Starter
😎 🐣 A starter boilerplate for a universal web app with the best development experience and a focus on performance and best practices.
Stars: ✭ 1,083 (+205.07%)
Mutual labels:  postcss, react-router
React Redux Saucepan
A minimal and universal react redux starter project. With hot reloading, linting and server-side rendering
Stars: ✭ 86 (-75.77%)
Mutual labels:  react-router, universal
Reactql
Universal React+GraphQL starter kit: React 16, Apollo 2, MobX, Emotion, Webpack 4, GraphQL Code Generator, React Router 4, PostCSS, SSR
Stars: ✭ 1,833 (+416.34%)
Mutual labels:  postcss, universal
React Redux Graphql Apollo Bootstrap Webpack Starter
react js + redux + graphQL + Apollo + react router + hot reload + devTools + bootstrap + webpack starter
Stars: ✭ 127 (-64.23%)
Mutual labels:  postcss, react-router
Hops
Universal Development Environment
Stars: ✭ 158 (-55.49%)
Mutual labels:  postcss, universal
Js Stack Boilerplate
Final boilerplate code of the JavaScript Stack from Scratch tutorial –
Stars: ✭ 145 (-59.15%)
Mutual labels:  react-router, pm2
Isomorphic Lab
Isomorphic React experimentation
Stars: ✭ 144 (-59.44%)
Mutual labels:  react-router, universal
Universal React Tutorial
📓 How to build universal web apps with React.
Stars: ✭ 136 (-61.69%)
Mutual labels:  react-router, universal
Universal React Base
[OUTDATED] Super basic example to get you started with Universal (😦) React/Redux (+ API requests). Lightweight and straightforward.
Stars: ✭ 6 (-98.31%)
Mutual labels:  postcss, universal
Pm2
Node.js Production Process Manager with a built-in Load Balancer.
Stars: ✭ 36,126 (+10076.34%)
Mutual labels:  process-manager, pm2
Express React Boilerplate
🚀🚀🚀 This is a tool that helps programmers create Express & React projects easily base on react-cool-starter.
Stars: ✭ 32 (-90.99%)
Mutual labels:  react-router, universal
Simple Universal React Redux
The simplest possible Async Universal React & Redux Boilerplate app, that works on both Mac and Windows
Stars: ✭ 58 (-83.66%)
Mutual labels:  react-router, universal
React Base
atSistemas React/Redux Isomorphic Platform
Stars: ✭ 82 (-76.9%)
Mutual labels:  postcss, universal

Progressive Web App

A production grade progressive web app, to hit the ground running.

Setup

$ npm install

ENV Variables

  • NODE_ENV (build-dependent)

    • development: modules are bundled as is
    • production: modules are minified and uglified
  • PWA_ENV (build-dependent)

    • development: configs are obtained from /config/development.js
    • production: configs are obtained from /config/production.js
    • customPwaEnv: configs are obtained from /config/customPwaEnv.js
  • PWA_PUBLIC_PATH (build-dependent)

    • /build/client/: assets are fetched from the local filesystem
    • /production.cdn.com/build/client/: assets are fetched from this cdn path
    • /custom/path/: assets are fetched from /custom/path/
  • PWA_SSR (build-independent)

    • true: enable server side data fetching and rendering
    • false: disable server side data fetching and rendering
  • PORT (build-independent)

    • 8000: serve the app at port 8000
    • 1337: serve the app at port 1337

build-dependent: if any of these variables values have to be changed, assuming you change PWA_PUBLIC_PATH=//other.cdn.com in the staging:build script, then it requires a rebuild and a restart, npm run staging

build-independent: if any of these variable values have to be changed, assuming you change PWA_SSR=false in the staging:start script, then it only requires a restart, npm run staging:start

Usage

There are some useful npm scripts setup for you to start using these ENV variables effectively, please look at package.json to better understand how they're setup for each script.

Remember to run npm stop to stop all the pwa pm2 instances before using a different script from below.

Start as local development server with file watching:

$ npm start
# runs at http://localhost:8000
# npm run stop is automatically called for you after
# hitting ctrl+c to quit the webpack-dev-server

Start as local production server:

$ npm run development
# runs at http://localhost:1337

Start as staging server:

$ npm run staging
# runs at http://localhost:1337

Start as production server:

$ npm run production
# runs at http://localhost:1337

Using pm2:

$ npm run pm2 -- logs # follow all server logs
$ npm run pm2 -- list # list all processes
$ npm run pm2 -- kill # kill pm2 parent process
$ npm run pm2 -- help # show other available commands

License

MIT

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].