【Next.js】Next.jsのインストール方法と初期設定

# nodebrewをインストール
brew install nodebrew

# インストールされたことを確認
nodebrew -v

# インストールできるバージョンを確認
nodebrew ls-remote

# 指定のバージョンをインストール
nodebrew install-binary v20.17.0

# インストールされたことを確認（v20.17.0が表示される）
nodebrew ls

# インストールしたバージョンを有効化
nodebrew use v20.17.0

echo 'export PATH=$HOME/.nodebrew/current/bin:$PATH' >> ~/.zprofile
~/.zprofile

# インストールしたバージョンが表示されることを確認
node -v

npx create-next-app@latest

# 質問事項の回答
✔ What is your project named? … cloud-work
✔ Would you like to use TypeScript? … No
✔ Would you like to use ESLint? … Yes
✔ Would you like to use Tailwind CSS? … Yes
✔ Would you like to use `src/` directory? … Yes
✔ Would you like to use App Router? (recommended) … No
✔ Would you like to customize the default import alias (@/*)? … No

cd cloud-work
npm run dev

:root {
  --background: #ffffff;
  --foreground: #171717;
}

@media (prefers-color-scheme: dark) {
  :root {
    --background: #0a0a0a;
    --foreground: #ededed;
  }
}

body {
  color: var(--foreground);
  background: var(--background);
  font-family: Arial, Helvetica, sans-serif;
}

@layer utilities {
  .text-balance {
    text-wrap: balance;
  }
}

export default function Home() {
  console.log("Hello, Next.js!");
  return <h1>Hello, Next.js!</h1>;
}

/** @type {import('next').NextConfig} */
const nextConfig = {
  reactStrictMode: false,
};

export default nextConfig;