Getting started with Next.js has never been easier. Whether you’re new to the framework or setting up a fresh project, this guide walks you through everything—from installation to configuring TypeScript, linting, and project structure.

Let’s dive in!

🖥️ System Requirements

Before running Next.js, make sure your system meets the minimum requirements:

• Node.js: v20.9 or higher
• Operating systems: macOS, Windows (including WSL), Linux

Supported Browsers

Next.js supports modern browsers with zero configuration:

• Chrome 111+
• Edge 111+
• Firefox 111+
• Safari 16.4+

🧱 Installation: Create Your First Next.js App

The fastest way to spin up a new Next.js project is by using create-next-app, a command-line tool that automatically sets up your development environment.

Quick Start

Example using pnpm:

npx create-next-app@latest my-app --yes
cd my-app
npm run dev

💡 The --yes flag skips all prompts and uses recommended defaults (TypeScript, Tailwind, ESLint, App Router, Turbopack, and alias @/*).

⚙️ Create a Project Using the CLI

Run:

npx create-next-app@latest

You’ll see interactive prompts like:

What is your project named? my-app  
Would you like to use the recommended Next.js defaults?

Choosing “Customize” lets you select:

• TypeScript or JavaScript
• ESLint, Biome, or no linter
• Tailwind CSS
• React Compiler
• App Router
• src directory
• Custom import alias

After completing the setup, create-next-app generates your project folder and installs all dependencies automatically.

▶️ Run the Development Server

Start your project:

npm run dev

Then visit:

http://localhost:3000

Edit app/page.tsx—your browser auto-refreshes with updates.