https://github.com/pedroestevaodev/boilerplate-nextjs
Complete boilerplate for projects with Next.js (App Router), created during the Advanced React course. Includes TypeScript, Tailwind, Styled Components, Storybook, testing with Jest and Cypress, as well as support for best practices with ESLint.
https://github.com/pedroestevaodev/boilerplate-nextjs
boilerplate boilerplate-template cypress eslint javascript jest jest-tests nextjs nextjs-app-router nextjs-boilerplate nextjs-tailwind nextjs-template nextjs-typescript react react-template react-testing-library storybook styled-components tailwindcss typescript
Last synced: 5 months ago
JSON representation
Complete boilerplate for projects with Next.js (App Router), created during the Advanced React course. Includes TypeScript, Tailwind, Styled Components, Storybook, testing with Jest and Cypress, as well as support for best practices with ESLint.
- Host: GitHub
- URL: https://github.com/pedroestevaodev/boilerplate-nextjs
- Owner: pedroestevaodev
- License: mit
- Created: 2023-08-04T00:57:41.000Z (almost 3 years ago)
- Default Branch: master
- Last Pushed: 2025-09-05T22:06:09.000Z (11 months ago)
- Last Synced: 2025-10-12T00:17:35.689Z (9 months ago)
- Topics: boilerplate, boilerplate-template, cypress, eslint, javascript, jest, jest-tests, nextjs, nextjs-app-router, nextjs-boilerplate, nextjs-tailwind, nextjs-template, nextjs-typescript, react, react-template, react-testing-library, storybook, styled-components, tailwindcss, typescript
- Language: TypeScript
- Homepage: https://www.pedroestevao.com
- Size: 1.22 MB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
- Security: SECURITY.md
Awesome Lists containing this project
README
# Boilerplate Next.js (App Router)
This is a [Next.js](https://nextjs.org/) boilerplate developed during the course called [React Avançado](https://reactavancado.com.br/).
## What is inside?
This project uses lot of stuff as:
- [TypeScript](https://www.typescriptlang.org/)
- [React](https://react.dev/)
- [NextJS (App Router)](https://nextjs.org/)
- [Tailwind CSS](https://tailwindcss.com/)
- [Styled Components](https://styled-components.com/)
- [Jest](https://jestjs.io/)
- [React Testing Library](https://testing-library.com/docs/react-testing-library/intro)
- [Storybook](https://storybook.js.org/)
- [Eslint](https://eslint.org/)
## Getting Started
First, run the development server:
```bash
$ npm run dev
# or
$ yarn dev
# or
$ pnpm run dev
```
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
## Commands
- `dev`: runs your application on `localhost:3000`
- `build`: creates the production build version
- `start`: starts a simple server with the build production code
- `lint`: runs the linter in all components and pages
- `test`: runs jest to test all components and pages in watch mode
- `cypress`: runs cypress to tests end-to-end
- `storybook`: runs storybook on `localhost:6006`
- `build-storybook`: create the build version of storybook
## Learn More
To learn more about Next.js, take a look at the following resources:
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
## Deploy on Vercel
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/import?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
## Using this boilerplate
To start a new project based on this boilerplate just run the code:
```bash
$ npx create-next-app -e https://github.com/pedroestevaodev/boilerplate-nextjs.git
# or
$ yarn create next-app -e https://github.com/pedroestevaodev/boilerplate-nextjs.git
# or
$ pnpm create next-app -e https://github.com/pedroestevaodev/boilerplate-nextjs.git
```