This is a boilerplate project to quickly start a new Next.js front-end project
Write about 1-2 paragraphs describing the purpose of your project.
These instructions will get you a copy of the project up and running on your local machine for development and testing purposes. See deployment for notes on how to deploy the project on a live system.
What things you need to install the software and how to install them.
A step by step series of examples that tell you how to get a development env running.
yarn create next-app -e git@github.com:qhoekman/next-starter.git <project-name>
cd <project-name>
yarn install
Configure the .env
file with the correct values, e.g. NEXT_PUBLIC_API_ENDPOINT
needs to be set to the correct API endpoint.
The starter-kit is equipped with authentication and a example feature which can be used as a starting point for your project. To remove these run:
npm run gen cleanup
To start the development server run:
npm run dev
This will start the dev server on http://localhost:3000
npm run sb:dev
This will start the storybook server on http://localhost:6006
This project comes with a few generators to help you create a new component, page, hook or feature. You can run these generators by running:
npm run gen
The generator will ask you a few questions and then create the files for you.
The tests can be run for the entire project using:
npm run cy:open
This will open the Cypress Test Runner, where you can select which tests to run.
npm run cy:run
This will run all tests in the terminal.
npm run cy:run:ct
This will run all component tests in the terminal.
npm run cy:run:e2e
This will run all end to end tests in the terminal.
To run the project with SSL, you need to generate a certificate for localhost. You can do this by running the following commands:
brew install mkcert
mkcert -install
mkcert localhost
This will create a certifcate in the current directory which will be used by the dev server. You can now run the dev server with SSL by running:
npm run dev:ssl
This will start the dev server on https://localhost:3000.
You may only need this setup if the backend is runnin on a external domain over HTTPS and has CORS enabled with a secure cookie.
- TypeScript - Typed JavaScript
- Radix UI - UI Component Library
- Cypress - End to End Testing
- Storybook - UI Component Library
- TailwindCSS - CSS Framework
- NextJs - Meta Framework
- ReactJs - UI Library
- NodeJs - Server Environment