Skip to main content

Installing Nextjs

Next.js is a powerful React framework developed by Vercel that allows you to build server-side rendering and static web applications. It's an essential tool for any web developer looking to create fast and scalable applications.

Before we dive into the installation process, you will need to have Node.js and npm installed in your system. Node.js is a JavaScript runtime environment that executes JavaScript code outside of a browser. NPM is a package manager for the Node JavaScript platform.

Here's how to install Node.js and npm:

  1. Go to the official Node.js website (https://nodejs.org/en/) and download the installer.

  2. Run the installer (the .msi file you just downloaded).

  3. Follow the prompts in the installer. Accept the license agreement, click the NEXT button a couple of times and allow the installer to run.

  4. Restart your computer.

You can verify the installation by opening your terminal or command prompt and running these commands:

node -v
npm -v

The above commands will display the Node.js and npm versions installed on your system.

Now, let's move on to installing Next.js.

The easiest way to start a Next.js project is to use create-next-app, which sets up everything automatically for you. To create a new app, open your terminal or command prompt, navigate to where you want to create your new project, and run the following command:

npx create-next-app@latest nextjs-blog --use-npm --example "https://github.com/vercel/next-learn-starter/tree/master/learn-starter"

In the above command, 'nextjs-blog' is the name of your new project. Feel free to replace 'nextjs-blog' with the name you prefer for your project.

This command will:

  • Create a new Next.js app in a directory called nextjs-blog.
  • Set up the latest version of Next.js, React, and React-DOM in your project.

Once the installation process is complete, navigate into your new project directory with this command:

cd nextjs-blog

To start your new Next.js app, run this command:

npm run dev

After running the command, you should see a message telling you that the server is running at http://localhost:3000. Open that URL in your browser, and you will see your new Next.js app.

Congratulations! You've just installed Next.js and created your first Next.js app. In the next tutorials, we'll explore how to build amazing things with Next.js. Stay tuned!