NextJS & NestJS GraphQL Starter

A NextJS frontend and NestJS backend GraphQL starter pack that includes GitHub & Reddit authentication.

Is something missing?

If there is a feature missing that is used in most production-grade applications, please make an issue so we can discuss adding it in.

Features

• Google authentication
• GitHub authentication
• Reddit authentication
• Subscriptions
• Update basic profile information
• Server rendering
• Translation
• Session management
• docker-compose for client & server

Technologies

• NextJS
• Bumbag
• styled-components
• Apollo Client 3.0
• GraphQL Code Generator
• Yup
• TypeScript
• NestJS
• Mongoose
• TypeGraphQL
• react-i18next
• Docker
• React Hook Form

Getting started

1. Install the required packages

   cd client && yarn
   cd server && yarn

2. Update the .env files in the client & server

   cp client/.env.example .env
   cp server/.env.example .env

3. Start the server & client

   cd server && yarn dev
   cd client && yarn dev

The client requires that the server is started so it can read the schema to run codegen. To remove that functionality, remove the predev hook in client/package.json

Deployment

The easiest way to deploy is:

1. Create a DigitalOcean droplet using the Docker image
2. Setup Nginx with this guide: How To Install Nginx on Ubuntu 18.04
3. Clone the repository onto the droplet
4. Add your .env files with your production configuration to the client and server
5. Signup for MongoDB Atlas and get your connection string
6. Mode the build script to make it executable: chmod +x ./build.sh
7. Run the build script ./build.sh
8. Modify and copy the supplied nginx.conf into /var/etc/nginx/sites-available/default
9. Generate the SSL certificate with this guide: How To Secure Nginx with Let's Encrypt on Ubuntu 16.04

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

NestJS GraphQL tutorials

• Build a GraphQL Server with NestJS - https://youtu.be/bQPk4S_W-pc
• Adding MongoDB to a NestJS GraphQL Server - https://youtu.be/xnyULqzQ-Rk
• Username & password authentication - https://youtu.be/PXwnT25SZro

Support

Buy me a Coffee

Sign up to DigitalOcean I 💖 DigitalOcean

Subscribe on YouTube

License

MIT