React template with SSR by using Firebase Cloud Functions
Seel the deference bellow
- SSR Live: https://react-firebase-ssr.ridermansb.dev/
- CSR Live: https://react-firebase-nossr.ridermansb.dev/
Make sure you have firebase-tools installed
Install all dependencies
npm i
cd functions/
npm i
npm start will start webpack-dev-server on port 7003
Build the app to generate client.html
rm -rf public && PUBLIC_PATH=http://0.0.0.0:5000 npmR build -- --watch
PUBLIC_PATH is the hosting URL generated by firebase server
Inside functions folder, run webpack in watch mode
rm -rf dist/ && npmR build -- --watch
Start the server
npmR start:serve -- --host 0.0.0.0
Build the app to generate client.html
rm -rf public && PUBLIC_PATH=http://0.0.0.0:8000 npmR build -- --watch
PUBLIC_PATH is the hosting URL, check firebase.json file
Inside functions folder, run webpack in watch mode
rm -rf dist/ && NODE_ENV=production npmR build -- --watch
Start the emulators
npmR start:emulators
Tools that can help you in some way
-
prerender.io
Allows your Javascript website to be crawled perfectly by search engines. -
react-snap Pre-renders a web app into static HTML. Uses Headless Chrome to crawl all available links starting from the root.
-
pagespeed Test your page in all devices
-
snyk Enabling more than 400,000 developers to continuously find and fix vulnerabilities in open source libraries and containers
-
pingdom.com Enter a URL to test the page load time, analyze it, and find bottlenecks.
-
Codeball.ai Approve PRs using AI.