- ターミナルに文字を打ってパソコンに命令できる
- このサイトのコードを自分のパソコンにコピーする
- 自分のパソコンの中でこのサイトを開く(
localhost:3000)
🧑🦰 道具(VS Code・Node・git)のインストールはおうちの人と。1回やれば、つぎからは自分でできます。
ターミナルって何?
いつもはマウスでアイコンをクリックするけど、プログラマは文字で命令することがよくあります。その文字を打つ黒い画面が ターミナル。打ったとおりにパソコンが動きます(だい1回の「バカ正直」をおぼえてる?)。
repo(リポジトリ)って何?
repo(リポジトリ)は、1つのアプリのコードがぜんぶ入った「フォルダのかたまり」。このサイトの repo は GitHub にあります。それを自分のパソコンにコピーすることを git clone(クローン=複製)と言います。
3つの言葉だけおぼえる
git clone …:repo を自分のパソコンにコピーするnpm install:アプリが動くのに必要な部品をそろえるnpm run dev:自分のパソコンの中でアプリを起動する
1. コードをコピーする。ターミナルでつぎを打つ(おうちの人が用意した置き場所で)。
$ git clone https://github.com/yo-iida/skj-docs.git
$ cd skj-docs
cd は「そのフォルダの中に入る」という意味だよ。
2. 部品をそろえる。少し時間がかかるので待とう。
$ npm install
3. アプリを起動する。
$ npm run dev
▲ Next.js
- Local: http://localhost:3000
こう出たら成功!ブラウザで http://localhost:3000 を開くと、いつものサイトが自分のパソコンの中で動いています。これからは、ここで自分の変更をためします。
※ 止めたいときは、ターミナルで Ctrl と C を同時押し。
💡 赤いエラーや「command not found」が出たら:その文をコピーして AI にはり、「これどういう意味?どうすればいい?」と聞こう。多くは Node や git がまだ入っていないだけ。おうちの人と一緒に直そう。
- ターミナルって何をするもの?(→ 文字でパソコンに命令する画面)
git cloneは何をする?(→ repo を自分のパソコンにコピー)- アプリを起動する命令は?(→
npm run dev) localhost:3000で自分のパソコンのサイトが開けた?
これで準備はかんりょう!つぎの Phase 1・だい4かいから、いよいよ自分でコードを書いて動かします。