VSCodeの始め方!【初心者向け】

みんな!今日は「VSCode ダウンロード mac」について話そうと思うんやで!プログラミングをする上で、エディタ選びは非常に重要なポイントやけど、その中でもVSCode(Visual Studio Code)は特に人気の高いツールなんやで!使いやすさや多機能さから、初心者から上級者まで幅広いユーザーに支持されているんよな。

この記事では、MacでVSCodeをダウンロードする方法を詳しく解説していくから、ぜひ最後まで読んでってくれや!

VSCodeをダウンロードする方法 【日本語対応】

VSCodeをダウンロードする方法について、サクッと解説するで。

まずは公式サイトにアクセス!そしたら、↓の画面が表示されるはずや。Mac (macOS 11.0+)のバージョンを選んで、ダウンロード完了するまで待機!※下の.zipやCLIにあるボタンは、とりあえず気にしなくておけ!

ダウンロードが完了したら、こんな感じで「Visual Studio Code.app」ていうのがあったらインストール完了や!もしこれがなくて、「VSCode-darwin-universal.zip」てやつしかなかったら、これをダブルクリックすることでインストールされるはずやで!

インストールが終わったら、VSCodeを起動すんべ!日本語化したいんやったら「拡張機能」のメニューを開いて、「Japanese Language Pack for Visual Studio Code」を検索してインストールするとええで。

ワイの画面ではもう日本語化されとるけど、多分これだけじゃ英語のままだと思うで。やから、command + Shift + Pで「コマンドパレット」言うやつを表示するんや。そこで”display”と入力してEnterを押すんや!

そしたら、言語の一覧が表示されると思うから、日本語をタップして日本語化完了や!

↓の感じで周りの言語が日本語なってたら成功や!お疲れさんやで!

🛠️初心者におすすめのVSCode拡張機能 3選

VSCodeはそのままでも使えるんやけど、「拡張機能」を入れるともっと便利になるんや。ここでは、初心者に特におすすめのものを3つ紹介すんで!ダウンロードの方法は↑で説明した、日本語化の拡張機能と同じや。

①Prettier – Code formatter

コードを自動で整形してくれるツールやで。

Before:

After:

→ インデントやスペースのミスが防げて、読みやすくなんで!

②Live Server

これは、HTMLファイルをブラウザですぐ表示できる拡張やで。HTMLは簡単に言うと、Webサイトとかを作るのに使う言語や。

例えば↓みたいなHTMLを書いたとするやろ?

これのファイル(青くなってるindex.html)を右クリックして、「Open with Live Server」をクリックすると…!

こんな感じで、自動でブラウザに反映したページが表示されるねん!便利やろ〜

③Code Runner

これは、コードをVSCode上ですぐ実行できる拡張や。

  • 対応言語:Python, JavaScript, C, Java, など多数
  • エディタで右クリック → 「Run Code」で実行完了!

→ 「ターミナルを開いて…」といった操作が不要やから、初心者でも手軽に試せるで!

📝まとめ

拡張機能名役割
Prettierコード整形
Live ServerHTML確認用サーバー
Code Runnerワンクリック実行ワンクリック実行

VSCodeは、拡張機能を上手に使うことで、プログラミング学習の効率がグッと上がるで。まずはこの記事で紹介した3つを入れて、快適なコーディング環境を手に入れてみてくれや!