参考資料:インフラストラクチャノードバー

install

まずnpmとnodeがインストールされているかどうかを確認します.
node -v
npm -v

確認したら、
npm init
あなたに作ってあげます.

最初はpackage name
独自のパッケージ名を作成したら
みんなenterを押せばいいです.

package.json

package.jsonの設定を以下のように変更します.

{
  "dependencies": {
    "next": "^9.5.5"
  },
  "name": "react-nodebird-front",
  "version": "1.0.0",
  "main": "index.js",
  "devDependencies": {},
  "scripts": {
    "dev": "next",
    "build": "next build"
  },
  "author": "Jakdu",
  "license": "ISC",
  "description": ""
}

nextをインストールします.
npm install next@9

pages

reactのみを使用する場合は、「react-router-dom」からインポート
インポートする必要がありますが、nextを使用する場合はpagesフォルダを作成するだけです.

import React from "react";

const home = () => {
  return <div>test</div>;
};

export default home;

npm run dev
スクリーン上

見えるものを確認できます.