Start your NextJS PWA project in seconds.

_{Created by Jithin Antony and maintained with ❤.}

Features

• Material UI
• Firebase Cloud Messaging (with Push Notification)
• Typescript Support
• PWA Support
• Authentication (Google Sign-In)
• Cloud Firestore
• Twilio
• SendGrid

Prerequisites

• Firebase
• OAuth client ID (from Google Cloud Platform)
• Sendgrid (Optional, if you aren't use)
• Twilio (Optional, if you aren't use)

Installation

To install NextJS-PWA-Boilerplate, follow these steps:

Download Repo:

git clone https://github.com/JithinAntony4/nextjs-pwa-boilerplate your-project-name

Install Dependencies:

npm install
# or
yarn install

Add Firebase to your web app:

Goto Firebase Console -> Project Settings -> General -> your apps, Click Add App and download the config which will used in this project. And update public/firebase-messaging-sw.js with these credentials.

Download Firebase Admin SDK Config:

Goto Firebase Console -> Project Settings -> Service accounts -> Firebase Admin SDK

Click Generate new private key, then copy that values and paste into .env

Create & Configure .env:

NODE_ENV=[production||development]
TOKEN_SECRET=your_secret_key (which will used for encryt sessions)

SENDGRID_API_KEY=your_sendgrid_api_key
FROM_MAIL=from_email_from_sendgrid

TWILIO_FROM=phone_no
TWILIO_ACCOUNT_SID=your_twilio_account_sid
TWILIO_AUTH_TOKEN=your_twilio_auth_token

AUTH_COOKIE_TOKEN_NAME=cookie_name
AUTH_COOKIE_TOKEN_AGE=28800(in mileseconds)

# use the values from firebase-config.json
PUBLIC_FIREBASE_API_KEY=your_firebase_api_key
PUBLIC_FIREBASE_AUTH_DOMAIN=your-project.firebaseapp.com
PUBLIC_FIREBASE_PROJECT_ID=your-project
PUBLIC_FIREBASE_STORAGE_BUCKET=your-project.appspot.com
PUBLIC_FIREBASE_MESSAGING_SENDER_ID=0123456789
PUBLIC_FIREBASE_APP_ID=0123456789
PUBLIC_FIREBASE_MESUREMENT_ID=0123456789

PRIVATE_FIREBASE_TYPE=place_your_value
FIREBASE_PRIVATE_KEY_ID=place_your_value
FIREBASE_PRIVATE_KEY=place_your_value
PRIVATE_FIREBASE_CLIENT_EMAIL=place_your_value
PRIVATE_FIREBASE_CLIENT_ID=place_your_value
PRIVATE_FIREBASE_AUTH_URI=place_your_value
PRIVATE_FIREBASE_TOKEN_URI=place_your_value
PRIVATE_FIREBASE_AUTH_PROVIDER_x509_CERT_URL=place_your_value
PRIVATE_FIREBASE_CLIENT_x509_CERT_URL=place_your_value

GOOGLE_AUTH_CLIENT_ID=your_google_auth_client_id (from GCP Console)

Usage

First, run the development server:

npm run dev
# or
yarn dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying pages/index.tsx. The page auto-updates as you edit the file.

Contributing to NextJS-PWA-Boilerplate

To contribute to NextJS-PWA-Boilerplate, follow these steps:

1. Fork this repository.
2. Create a branch: git checkout -b <branch_name>.
3. Make your changes and commit them: git commit -m '<commit_message>'
4. Push to the original branch: git push origin <project_name>/<location>
5. Create the pull request.

Alternatively see the GitHub documentation on creating a pull request.

Contributors

Thanks to the following people who have contributed to this project:

• @JithinAntony4 💻 📖 🎨

Credits

• create-next-app
• next-pwa
• @material-ui/icons
• @material-ui/core
• @material-ui/lab
• firebase
• firebase-admin
• localforage
• passport
• twilio
• nodemailer
• @hapi/iron
• next-connect
• swr
• react-google-login

License

This project is licensed under the MIT license, Copyright (c) 2021 Jithin Antony. For more information see LICENSE.md.