Skip to content

Latest commit

 

History

History
74 lines (56 loc) · 2.59 KB

README.md

File metadata and controls

74 lines (56 loc) · 2.59 KB
Raw

🚀 Boilerplate and Starter for Next.js, Tailwind CSS and TypeScript ⚡️ Made with developer experience first: Next.js, TypeScript, ESLint, Prettier, Husky, Lint-Staged, VSCode, Netlify, PostCSS, Tailwind CSS.

Features

Developer experience first:

  • 🔥 Next.js for Static Site Generator

  • 🎨 Integrate with Tailwind CSS

  • 🎉 Type checking TypeScript

  • ✅ Strict Mode for TypeScript and React 18

  • ✏️ Linter with ESLint (default NextJS, NextJS Core Web Vitals, Tailwind CSS and Airbnb configuration)

  • 💡 Absolute Imports

  • 🛠 Code Formatter with Prettier

  • 🦊 Husky for Git Hooks

  • 🚫 Lint-staged for running linters on Git staged files

  • 🤖 SEO metadata, JSON-LD and Open Graph tags with Next SEO

  • ⚙️ Bundler Analyzer

  • 💻 Components and Design Patterns

Getting started

Run the following command on your local environment:

git clone [email protected]:gabrieldemian/evil-nextjs-boilerplate.git my-project-name
cd my-project-name
npm install

Then, you can run locally in development mode with live reload:

npm run dev

Open http://localhost:3000 with your favorite browser to see your project.

.
├── README.md                # README file
├── next.config.js           # Next JS configuration
├── public                   # Public folder
│   └── assets
│       └── images           # Image used by default template
├── src
│   ├── components           # Components folder
│   ├── layout               # Atomic layout components
│   ├── pages                # Next JS pages
│   ├── styles               # PostCSS style folder with Tailwind
│   ├── templates            # Default template
│   └── utils                # Utility folder
├── tailwind.config.js       # Tailwind CSS configuration
└── tsconfig.json            # TypeScript configuration

Deploy to production

You can see the results locally in production mode with:

$ yarn build
$ yarn start

The generated HTML and CSS files are minified (built-in feature from Next js). It will also removed unused CSS from Tailwind CSS.

You can create an optimized production build with:

npm run build-prod

Now, it is ready to be deployed. All generated files are located at out folder, which you can deploy with any hosting service.