Creating Progressive Web Application in 2 simple steps with React.JS
This tutorial uses the boiler plate “ReactPWA” created by my team at Atyantik Technologies Private Limited, and assumes that you have nodejs ≥ 8.4 installed on your machine.
While working on many challenging project we faced a common requirement of creating a boilerplate that takes care of SEO, Progressive nature of app and optimization. Thus we created a boilerplate that supports Server Side Rendering, Code Splitting, Social Sharable cards (yes even for dynamic pages), Image optimizations etc.
NOTE: The boilerplate is production ready and have been used on live sites but is still in beta phase. We are looking for contributors! So if you have good experience with ReactJS. Please help us improve the code.
So lets get started with Progressive Web Application.
Step 1) If you are already familiar with git, clone the repo or you can click this link to download the copy
git clone https://github.com/Atyantik/react-pwa.git
Step 2) Install the dependencies
cd react-pwa && npm install
To view the example application you can simple start the application with
npm start
and open http://localhost:3007 (default port) to view it. TADA, your “Hello, World!” program is up and ready
Well you will need to do a lot more to add your custom icons and default SEO details to create a full fledged PWA, but this is just to get you started.
For detailed documentation please visit: https://www.reactpwa.com/docs/en/initial-setup.html