Introduction

Next.js project setup without any hassle.

Check out the complete documentation HERE.

Prerequisites

These VSCode extensions should be installed: ESLint | Prettier | Import Cost

Installation

Step 1. open terminal and create next.js project with typescript

npx create-next-app@latest --ts

✔ What is your project named? … my-app

✔ Would you like to use ESLint? … No / Yes = Yes

✔ Would you like to use Tailwind CSS? … No / Yes = Yes

✔ Would you like to use src/ directory? … No / Yes = Yes

✔ Would you like to use App Router? (recommended) … No / Yes = Yes

✔ Would you like to customize the default import alias (@/*)? › No / Yes = Yes

Project create done then run

Step 2: Open the project directory in your terminal

cd my-app

Step 3: In my-app directory open terminal and this comment

npx nextjs-eslint-prettier-setup

Open the application with your code editor. It is good to use VSCode.

To run the application enter this command

yarn dev

Your project is now ready!

Default port 3000 will be used. If it is not free then the next port will be used.