NextJS Template

A simple NextJS template

View Demo · Documentation · Report Bug · Request Feature

📔 Table of Contents

• About the Project
  • Screenshots
  • Tech Stack
  • Features
  • Color Reference
  • Environment Variables
• Getting Started
  • Prerequisites
  • Run Locally
  • Running Tests
  • Deployment
• Usage
• Roadmap
• Contributing
  • Code of Conduct
• FAQ
• License
• Contact
• Acknowledgements

🌟 About the Project

📷 Screenshots

👾 Tech Stack

Client

• Javascript
• React.js
• NextJS
• Redux Toolkit
• React Query
• TailwindCSS
• Mantine
• Storybook
• ESLint
• Prettier
• Iconify

Server

• Typescript
• Express.js
• Golang
• Nest.js
• SocketIO
• Prisma
• Apollo
• GraphQL

Database

• MySQL
• PostgreSQL
• Redis
• Neo4j
• MongoDB

DevOps

• Docker
• Jenkins
• CircleCLI

🎯 Features

• Feature 1.
• Feature 2.
• Feature 3.

🎨 Color Reference

Color	Hex
Primary Color	#222831
Secondary Color	#393E46
Accent Color	#00ADB5
Text Color	#EEEEEE

🔑 Environment Variables

To run this project, you will need to add the following environment variables to your .env file:

• NextAuth configs:

  NEXTAUTH_SECRET: Used to encrypt the NextAuth.js JWT, and to hash email verification tokens.

  NEXTAUTH_URL: When deploying to production, set the NEXTAUTH_URL environment variable to the canonical URL of your site.

  Note: Doesn't have to set NEXTAUTH_URL when deploying to vercel.

E.g:

# .env
NEXTAUTH_SECRET="my-secret-key"
NEXTAUTH_URL="http://localhost:3000/"

You can also check out the file .env.example to see all required environment variables.

🧰 Getting Started

‼️ Prerequisites

This project uses pnpm as package manager:

npm install --global pnpm

🏃 Run Locally

Clone the project:

git clone https://github.com/DuckyMomo20012/nextjs-template.git

Go to the project directory:

cd nextjs-template

Install dependencies:

pnpm install

Start the server:

pnpm dev

🧪 Running Tests

To run tests, run the following command:

pnpm test

🚩 Deployment

To deploy this project run:

pnpm deploy

👀 Usage

Use this space to tell a little more about your project and how it can be used. Show additional screenshots, code samples, demos, or links to other resources.

// foo.jsx
import Component from 'nextjs-template';

function App() {
  return <Component />;
}

🧭 Roadmap

• Todo 1.
• Todo 2.

👋 Contributing

Contributions are always welcome!

📜 Code of Conduct

Please read the Code of Conduct.

❔ FAQ

• Question 1

  • Answer 1.

• Question 2

  • Answer 2.

⚠️ License

Distributed under MIT license. See LICENSE for more information.

🤝 Contact

Duong Vinh - @duckymomo20012 - tienvinh.duong4@gmail.com

Project Link: https://github.com/DuckyMomo20012/nextjs-template.

💎 Acknowledgements

Here are useful resources and libraries that we have used in our projects:

• Awesome Readme Template: A detailed template to bootstrap your README file quickly.