Table of Contents
To create a new project in Next.js, follow these steps:
Step 1: Install Node.js
Make sure you have Node.js installed (preferably the latest LTS version). You can check by running:
node -v
If it’s not installed, download it from Node.js official site.
Step 2: Create a Next.js Project
Use the following command to set up a new Next.js app:
npx create-next-app@latest my-next-app
or if using yarn:
yarn create next-app my-next-app
or if using pnpm:
pnpm create next-app my-next-app
Replace my-next-app with your desired project name.
Step 3: Navigate to the Project Directory
cd my-next-app
Step 4: Start the Development Server
Run the following command:
npm run dev
or
yarn dev
or
pnpm dev
The server will start at http://localhost:3000/.
Step 5: Open the Project in VS Code (Optional)
If you use Visual Studio Code, you can open your project with:
code .
Step 6: Integrate Tailwind CSS (Optional)
Since you’re planning to integrate Tailwind CSS into your JavaScript projects, you can install it in your Next.js project with:
npm install -D tailwindcss postcss autoprefixer
npx tailwindcss init -p
Then, configure Tailwind in tailwind.config.js and import it into globals.css.
Read other awesome articles in Medium.com or in akcoding’s posts.
OR
Join us on YouTube Channel
OR Scan the QR Code to Directly open the Channel 👉
