前回までのポイント（再掲）（抜粋）

cd
- フォルダの中に入る
npm run dev
- （作ってる途中の）Next.jsを動かす
- だいたいhttp://localhost:3000で見れる

今回のポイント

gitはバージョン管理のツール
- 作業のきりがいいところ毎にフォルダまるごと記録するツール
..は上のフォルダ
git clone ほしいやつ
gitで取ってきたNext.jsのプロジェクトにはnpm i

`git`をインストール

今回も環境によってまちまちなので、説明をふんわりさせてください😢
多くの場合↓このページの説明にそって、コマンドでインストールするのがかんたんではないでしょうか。

特にWindowsを使っている場合は。

ここに載っているコマンド、winget install --id Git.Git -e --source wingetを使うとかんたんなようです。

前回までのお手本フォルダを取ってくる

そうです。みんなに大人気のGithubです。今回からお手本フォルダを公開しています。

ではまずターミナルでもPowerShellでもOKなのでコマンドの画面を出します。

コマンドの画面に入力してエンター

cd お手本フォルダを置く場所

たとえば、Next.jsのフォルダがまとめてあって、その中のNext.jsのフォルダの中で作業中であれば、cd ..などとしてもいいかもしれませんね。..というのは１つ上のフォルダです。ちなみに.は今のフォルダです。

では早速取ってきましょう。

コマンドの画面に入力してエンター

git clone https://github.com/tenshoku-2024/typescript-oni-spartan-dojo

これを実行すると、

Cloning into 'typescript-oni-spartan-dojo'...
remote: Enumerating objects: 38, done.
remote: Counting objects: 100% (38/38), done.
remote: Compressing objects: 100% (25/25), done.
remote: Total 38 (delta 8), reused 38 (delta 8), pack-reused 0
Receiving objects: 100% (38/38), 62.05 KiB | 3.10 MiB/s, done.
Resolving deltas: 100% (8/8), done.

具体的な数値は変わるかもしれませんが、だいたいこんなのが出てくるのではないでしょうか。これで取ってこれています。

取ってきたお手本を動かす

まずはお手本のフォルダに移動します。

コマンドの画面に入力してエンター

cd typescript-oni-spartan-dojo

次に、Node.jsのパッケージをインストールします。

コマンドの画面に入力してエンター

npm i

次はいつもの動かすときのコマンドを実行します。

コマンドの画面に入力してエンター

npm run dev

このような画面が出るようにしたつもりです。意図した画面が出ました🎉

今回はここまでにしました✨

今回のポイント

gitはバージョン管理のツール
- 作業のきりがいいところ毎にフォルダまるごと記録するツール
..は上のフォルダ
git clone ほしいやつ
gitで取ってきたNext.jsのプロジェクトにはnpm i