Next.js Base

A Next.js setup for use as the base of other projects.

Getting Started

Installation

1. Install all dependencies from the CLI:

npm install

2. Add the following line to your etc/hosts file to enable a custom local domain (on Mac /etc/hosts or on Windows C:/Windows/System32/drivers/etc/hosts):

127.0.0.1 custom-domain.local

Development

The application can be run locally with hot reloading at http://custom-domain.local:3000:

npm run dev

Starting a New Project

• Remove package-lock.json from the .gitignore file
• Specify a new project name in the package.json and document title element
• Specify a new custom domain for local development instead of custom-domain
• Remove the disallow all from the robots.txt when ready to go live

Built With

Code

• Next.js - React Framework
• TypeScript - Strongly typed programming language that builds on JavaScript
• Styled Components - CSS-in-JS solution for embedded styles

Unit Testing

• Jest - Testing Framework
• React Testing Library - React DOM testing utilities
• user-event - Simulate real events that would happen in the browser

Tooling

• Prettier - Opinionated code formatter
• Eslint - Linting rules with Next.js, TypeScript, Prettier and React Testing Library
• Stylelint - Linting the CSS in Styled Components
• EditorConfig - Consistent coding styles across various editors and IDEs
• Husky - Pre-commit Git hook fixing lint issues with lint-staged
• Node Version Manager - Consistent version of node

Redux (redux branch)

• Redux Toolkit - Recommended opinionated library to write Redux logic
• Redux Wrapper for Next.js - Manages store instances across page rendering

Design System (chakra-ui branch)

• Chakra UI - Modular and accessible component library
• Storybook - Build and test UI components in isolation

License

This project is licensed under the MIT License - see the LICENSE.txt file for details