lpaulovt/nextjs-boilerplate

A simple project to start work with TypeScript, ReactJS, NextJS, Styled Components, Jest and Storybook.

NextJS Boilerplate

This boilerplate was developed with the following technologies:

• NextJS
• ReactJS
• Typescript
• Styled-components
• Next-PWA
• Storybook
• Jest
• React Testing Library
• Babel
• EsLint
• Prettier
• EditorConfig
• VS Code

📝 File Structure

---

nextjs-boilerplate
├── node_modules/
├── .next/
├── .jest/
│   └── setup.ts
├── .storybook/
│   ├── main.js
│   └── preview.js
├── public/
│   ├── img/
│   │   └── images.*
│   ├── manifest.json
│   ├── sw.js
│   └── workbox*.js
├── src/
│   ├── components/
│   │   └── Component/
│   │        ├─── index.tsx
│   │        ├─── stories.tsx
│   │        ├─── styles.ts
│   │        └─── test.tsx
│   ├── pages/
│   │   ├── _app.tsx
│   │   ├── _document.tsx
│   │   └── index.tsx
│   └── styles/
│       └── global.ts
├── .babelrc
├── .editorconfig
├── .eslintrc.json
├── .gitignore
├── .prettierrc
├── jest.config.js
├── next-env.d.ts
├── next.config.js
├── .package.json
├── README.md
├── tsconfig.json
└── yarn.lock

ℹ️ How To Use

---

# Create a project using this boilerplate
$ yarn create next-app -e https://github.com/lpaulovt/nextjs-boilerplate

# ✔ What is your project named?
$ project-name

# Install dependencies
$ yarn install

# Run the app
$ yarn dev

# Run tests
$ yarn test:watch

# Run storybook
$ yarn storybook

# Run build
$ yarn build

Made with ♥ by Paulo Lopes 👋 Get in touch!