Last updated on September 21, 2023 by Ayaz Ali Shah
Next.js is a Javascript framework that creates search engine optimized, server-side rendering, and fast react apps with zero configuration. Server-side rendering means, Next.js creates HTML with content on the server and sends it as a response to the requested URL, so users see a fully rendered HTML page in the browser. The good point of server-side rendering is that the webpage loads fast and content renders before the page loads which makes it easy for search engines to crawl and index.
There are two ways to install Next.js 12 on Windows 10. One is automatic and the second is manual. We will be installing through automatic setup which is easy and recommended by the Next.js official team.
The latest stable version of Next.js is 12. To set up and install it on Windows 10 make sure that you have installed Node.js and its version should be 12.22.0 or later. To install node.js on Windows 10 follow this tutorial.
Next, run the following command into the terminal,
pnpm create next-appIn case, you don’t have pnpm installed then it would return an error “pnpm: command not found”. To install pnpm run the following command
npm install -g pnpmOnce pnpm is installed successfully, run the first command, which creates the Next.js app. It will ask you for the project name which can be anything. If the project name has more than one word then it is better to add hyphens between to make it readable. Sometimes, it takes a few seconds to complete it.
After following these steps, you should have Next.js 12 installed with the latest version on your Windows 10.
Run the below command into the git bash terminal to check out the installed Next.js version
npx next -vIt would return the version of your Next.js app, following is an example response,
Next.js v12.2.0There is one more way to check out the version which is the package.json file. Next.js keeps the package.json file in the root directory and contains a JSON array. In the array, the next object value shows the version which you can find under the dependencies array.
To run the Next.js app in the browser, open git bash and run the below command
npm run devThis command starts the development server. Once the command run, go to the browser and open the following link
http://localhost:3000/The development server serves the Next.js app on this URL.
Conclusion
In this article, we have discussed the steps to install Next.js on Windows 10, along with how to check the Next.js app version and run it on a development server.