今回やること
この記事では、VS Codeをインストールし、学習用フォルダを開いて、最初のファイルを保存できる状態にします。
VS Codeはファイル単体ではなく、学習用フォルダごと開くのが基本です。
前提条件
- パソコンでブラウザを開ける
- ファイルをダウンロードできる
- 任意の場所にフォルダを作れる
Node.jsやGitは、この記事では必須ではありません。
Step 1: VS Codeをダウンロードする
公式サイトから、自分のOSに合ったVS Codeをダウンロードします。
https://code.visualstudio.com/
インストール後、VS Codeを起動します。
確認すること:
- VS Codeが起動する
- メニューやサイドバーが表示される
- 新規ファイルを作れる
Step 2: 学習用フォルダを作る
デスクトップやドキュメントなど、分かりやすい場所に programming-practice フォルダを作ります。
programming-practice/
VS Codeで「File > Open Folder」からこのフォルダを開きます。
フォルダを開くと、左側のExplorerにフォルダ名が表示されます。
Step 3: 最初のファイルを作る
Explorerで新規ファイルを作り、memo.md という名前にします。
# 学習メモ
今日からプログラミング学習を始めます。
Cmd/Ctrl + S で保存します。
保存できると、ファイル名の横の未保存マークが消えます。
Step 4: Auto Saveを設定する
保存忘れを減らすため、Auto Saveを使ってもよいです。
Fileメニューを開くAuto Saveを有効にする
自動保存が苦手な場合は、手動保存でも問題ありません。大切なのは、変更したら保存する習慣です。
Step 5: ターミナルを開く
VS Code内でターミナルを開きます。
Cmd/Ctrl + `
または、メニューから「Terminal > New Terminal」を選びます。
ターミナルが開いたら、現在のフォルダが programming-practice になっているか確認します。
pwd
Windows PowerShellでは次も使えます。
Get-Location
ポイント: VS Codeでフォルダを開いてからターミナルを開くと、そのフォルダを現在地として作業しやすくなります。
よくあるエラー
| 困る状態 | よくある原因 | 確認する場所 |
|---|---|---|
| ファイルが見つからない | 別のフォルダを開いている | Explorerの一番上 |
| 保存されていない | Cmd/Ctrl + S を押していない | ファイル名横のマーク |
| ターミナルの現在地が違う | フォルダを開かずに起動した | pwd / Get-Location |
次にやること
VS Codeの画面構成と基本操作 で、Explorer、Editor、Terminal、Searchの役割を確認します。
まとめ
VS Codeは、フォルダを開いて使うコードエディタです。最初は、フォルダを開く、ファイルを作る、保存する、ターミナルを開く、現在地を確認する、という流れを確実にできるようにします。
