Next.js from Scratch

Next.js is a full-stack React framework. In this tutorial we'll get started with Next.js by creating a simple 'Hello World' web app from scratch.

Getting Started

Next.js provides a command line utility called next-next-app that can be used to create a new Next.js project.

However, we're going to create a new Next.js app from scratch.

First we'll create a project folder and initialize it with npm.
```
mkdir my-next-app && cd my-next-app && npm init -y
```
Next we'll install the Next.js dependencies.
```
npm install next react react-dom
```
Next we'll create a pages directory and create a index.js file.
```
mkdir pages && touch pages/index.js
```
Next we'll add some code to index.js to render a <h1> element.
```
export default () => (
   <h1>Hello World</h1>
);
```
That's it! We're now ready to start our app. To do this, we'll run the following command:

npx next dev

If all went well you should see something like the following output

ready - started server on 0.0.0.0:3000, url: http://localhost:3000

Open http://localhost:3000 and you should see a simple page that says 'Hello World!'

In the next tutorial we'll add some style using Tailwind CSS.