This is NextJS framework starter code with SSR enabled, Tailwind CSS with PurgeCSS preconfigured, and react-redux installed. Before using this starter code, you must install Yarnpkg
npm install -g yarn
Development mode
yarn dev
Built version in development mode
yarn deploy:dev
Built version in production mode
yarn deploy:prod
This starter code also has Firebase Analytics installed for you, with web vital metrics being logged to firebase on pages/_app.js
.
You must provide your firebase configurations on .env.development
or .env.production
file like this
NEXT_PUBLIC_FIREBASE_API_KEY=<Your firebase API KEY> NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=<Your firebase AUTH DOMAIN> NEXT_PUBLIC_FIREBASE_DATABASE_URL=<Your firebase DATABASE URL> NEXT_PUBLIC_FIREBASE_PROJECT_ID=<Your firebase PROJECT ID> NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=<Your firebase STORAGE BUCKET> NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=<Your firebase MESSAGING SENDER ID> NEXT_PUBLIC_FIREBASE_APP_ID=<Your firebase APP ID> NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID=<Your firebase MEASUREMENT ID>
The default metrics being logged are FCP, LCP, CLS, FID, and TTFD on every page (See: Web Vitals). For example, if you access http://localhost:3000
, you can see on your analytics dashboard on StreamView an event named FCP_/
.
These logs will be useful if you want to track and monitor your website performance.
© Azhary Arliansyah