NextJs Boilerplate

A Better template with NextJs with technologies to improve development.

View Demo · Report Bug · Request Feature

Table of Contents

1. About The Project
   • Built With
   • Storybook
   • Lighthouse
   • Codecov
2. Getting Started
   • Prerequisites
   • Installation
3. Configuration
4. Contributing
5. License
6. Deploying
7. Contact

About The Project

🛠 Built With

The following tools were used in building the project:

• 
• 
• 
• 
• 
• 
• 
• 
• 
• 
• 
• 
• 
• 
• 

(back to top)

🌈 Storybook

Storybook is a frontend workshop for building UI components and pages in isolation. Thousands of teams use it for UI development, testing, and documentation.

⬇️ Start Storybook

# With npm
npm run storybook

# With yarn
yarn storybook

# With pnpm
pnpm storybook

⬇️ Build Storybook

# With npm
npm run build-storybook

# With yarn
yarn build-storybook

# With pnpm
pnpm build-storybook

Storybook Deploy ▶️

(back to top)

🏅 Lighthouse

Lighthouse Details ▶️

(back to top)

🔍 Codecov

Codecov provides metrics and insights into the results of tests through code coverage reports. Coverage reports are used to determine which lines of code were tested and which lines were not tested, which may contain bugs and syntax errors.

(back to top)

🚀 Getting Started

Prerequisites

To clone and run this application, you'll need Git and NodeJs (which comes with npm) installed on your computer.

Installation

1. Clone the repository.

git clone https://github.com/GabrielGuedess/NextJs-Boilerplate

2. Go into the repository

cd NextJs-Boilerplate

3. Install dependencies.

# With npm
npm i

# With yarn
yarn

# With pnpm
pnpm i

4. Start project.

# With npm
npm run dev

# With yarn
yarn dev

# With pnpm
pnpm dev

Note If you're using Linux Bash for Windows, see this guide or use node from the command prompt.

(back to top)

🚨 Configuration

• Cypress
  • Add CYPRESS_PROJECT_ID to Github.
  • Add CYPRESS_RECORD_KEY to Github.
• Chromatic
  • Add CHROMATIC_PROJECT_TOKEN to Github.
• Lighthouse
  • Add LIGHTHOUSE_BADGER_TOKEN to Github.

See the open issues for a full list of proposed features (and known issues).

(back to top)

👏 Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement".

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/NewFeature)
3. Commit your Changes (git commit -m 'Add some NewFeature')
4. Push to the Branch (git push origin feature/NewFeature)
5. Open a Pull Request

(back to top)

📄 License

Distributed under the MIT License. See MIT license for more information.

(back to top)

🌐 Deploying

(back to top)

⭐ Contact

Gabriel Guedes - @GabrielRGuedess - gabrielrguedess@gmail.com

Project Link: https://nextjs-boilerplate-gabrielguedess.vercel.app

---

Made with ♥ by 👨‍🚀 Gabriel Guedes 👋 Get in touch!

(back to top)