本記事ではHTML＆CSSの開発環境の準備、「Visual Studio Code（VSCode）」のインストールをしていきます。
目次
Visual Studio Code（VSCode）
Visual Studio Code（VSCode）は、HTML＆CSSの開発環境を提供してくれます。
初心者から上級者まで愛用される無料アプリケーションです。
開発を始めたい場合、まずVSCodeをダウンロードすれば間違いはないでしょう。
Visual Studio Code – Code Editing. Redefinedより引用
インストール方法
インストールは簡単です。英語ですが、以下の手順でインストールを進めましょう。
アプリケーションでは日本語設定ができます。
- ダウンロードボタンをクリック
Visual Studio Code – Code Editing. Redefinedより引用
- 「VSCodeUserSetup-x64-1.82.0」を実行、インストール
「次へ」を押していき、インストールボタンをクリック
これでインストールは完了です。
VSCodeの設定
インストールが完了したら、アプリを開いて初期設定です。
確認項目にどんどんチェックを入れていきましょう。設定はあとで変更可能です。
日本語設定
日本語に設定しましょう。
- 画面上部、メニューバーのViewをクリック
- Command Paletteを選択
- Configure Display Languageと入力、選択
- プルダウンから日本語を選択、リスタート
- 日本語に設定できました。
開発ファイル作成
「新しいファイル」をクリック、任意の場所にフォルダを保存して開発スタートです。
↓
ここにHTML,CSSの内容を入力していくことになります。
仮に任意の文字列を入力してみてください。
※ここでは、「ここに入力していきます」と記入しています。
サイト上で確認するため、保存しましょう。Ctrl＋Sでも保存できます。
ブラウザ上の表示を確認するため、パスのコピーをクリックします。
任意のブラウザにURLをコピー＆ペーストしましょう。
※著者はChromeで実行しました。
問題なく表示されれば開発環境は構築完了です。
まとめ
お疲れ様でした。
今日はVSCodeのインストール方法、日本語設定方法、開発ファイルの作成方法について解説しました。
勉強したことを実際にここでアウトプットしてどんどんスキルアップしていきましょう。
