【Next.js】yarnでnextjs + typescriptをインストールしてみた

はじめに

yarnでnextjsをインストールしてみたのでの備忘録として書き留めておく。

1. yarnのインストール

インストールコマンドを実行する。

sudo npm install -g yarn

正常にインストールされたか確認する。

# バージョン確認
yarn -v

#実行結果
1.22.22

2.nextjs + typescript環境作成

以下コマンドを実行

yarn create next-app --typescript .

上記コマンドを実行したら下記を聞かれるのでお好みでNo/Yesを選択。

✔ Would you like to use ESLint? … No / Yes
✔ Would you like to use Tailwind CSS? … No / Yes
✔ Would you like to use `src/` directory? … No / Yes
✔ Would you like to use App Router? (recommended) … No / Yes
✔ Would you like to customize the default import alias (@/*)? … No / Yes

下記メッセージが出力されたらとりあえずOK。

Success! Created samplenextjs at ディレクトリパス

✨  Done in 122.95s.

3. 画面で確認

下記コマンドを実行する。

yarn dev

その後下記URLへアクセス。

http://localhost:3000

下記画面が表示されれば完了。

終わりに

nextjsかっこいい。。。