Overview:
This product is a Next.js boilerplate that comes with TypeScript and Storybook integration. It provides a set of features and configurations to help developers quickly set up their Next.js projects with a solid foundation.
Features:
- Next.js 11: The boilerplate utilizes the latest version of Next.js, bringing new features and improvements to the development experience.
- Storybook 6 integrated with Next.js: Storybook is seamlessly integrated into the Next.js project, allowing for easy component development and testing.
- SCSS globally available variables and mixins: The boilerplate provides SCSS variables and mixins that can be accessed globally throughout the application.
- SCSS variable imports from JSON files: It allows importing SCSS variables from JSON files, making it easier to manage and share variable values.
- ESLint with predefined rules: ESLint is set up with predefined rules to ensure code consistency and catch common errors.
- Stylelint with SCSS and Prettier integration: Stylelint is configured to lint SCSS files and has integration with Prettier to enforce consistent code formatting.
- Prettier: The boilerplate includes Prettier for code formatting. It is configured to not conflict with ESLint and Stylelint rules.
- Husky and lint-staged pre-commit hooks: Husky and lint-staged are used to run linters and formatting tools automatically before committing code.
- Templateman for fast components creation: Templateman is included to provide a convenient way to generate components quickly.
- Prepared GitHub Actions and Gitlab CI/CD configurations: The boilerplate comes with pre-configured workflows for GitHub Actions and Gitlab CI/CD, making it easier to set up continuous integration and deployment.
- Prepared example components and directory structure: It provides a set of example components and a well-organized directory structure to give developers a starting point for their projects.
Installation:
To initialize the project and install the required dependencies, follow these steps:
- Run the following command to install the dependencies from the
package-lock.jsonfile:npm install
Summary:
This Next.js boilerplate with TypeScript and Storybook integration provides developers with a solid foundation for starting their Next.js projects. It includes various features such as SCSS variables, linting with ESLint and Stylelint, pre-commit hooks, and pre-configured CI/CD workflows. With the provided example components and directory structure, developers can rapidly build their applications using best practices.