シリーズのトップは↓こちら
前回の記事は↓こちら
たまたまプライベートで人にNext.jsを叩き込む過程でgitを叩き込む機会がありまして、せっかくなので再びこの場をお借りしていっしょに復習します。
前回までのポイント（再掲）（抜粋）
-
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