今日、プライベートで久しぶりにWEBサイトのコーディング(といっても更新的な何かですが)を頼まれて、2月に買ったばかりのつよつよPC(OMEN 45L)でメインで使用するテキストエディタもインストールしてなかったので、Visual Studio Codeをインストールしてみました!
ChatGPTともAPI連携が可能みたいで、すごい将来性も感じます!今回は、私が実際にインストールして、日本語化までやってみたレポートをいたします!
Visual Studio Codeとは
Visual Studio Codeは、Microsoft社が開発したテキストエディタで、Windows版、Mac版、Linux版があり、無料で利用可能です!
HTML/CSS/javascriptなどをを記述する際は、ほかにも「サクラエディタ」や「Atom」などもありますが、今回私が取り上げた主たる理由としては、ChatGPTのプラグインがある!という部分に尽きます!
WEBブラウザでWEBサービスのURLを開けば、ログイン不要ですぐに利用できます!
ここのところずっと本業でも、そもそもコードすら書いてないよ!という状況が続いていて、プライベートでも自分がコードを書かなくても、将来的にAIがサイトを作ってくれるよ(・v・)。とテキストエディタは『サクラエディタ』だけインストールして、ブログ記事を書いたり、たまにソースコードをいじる場合もこれでいいかとサクラエディタを惰性で使っていたのですが、Visual Studio CodeはChatGPTのAPIを利用できる拡張機能がある!ということと、ボタン一発で見事なサイトをAIが作成してくれるのも、もうちょっと先かな…というような現状もあるので、再びもう少し、WEB制作のコーディングを自分でもやってみようかな!と思い導入してみました。ChatGPTのAPIを利用する具体的なネタとしてもVisual Studio Codeで後日試してみようと思います!
なお、以下ChatGPT(GPT-4)にVisual Studio Codeについて聞いてみた回答も共有します!
VSCode(Visual Studio Code)は、マイクロソフトが開発しているオープンソースのテキストエディタで、プログラミング言語のコード編集に広く使われています。VSCodeは、多くのプログラミング言語とフレームワークに対応しており、拡張機能を通じてさらに機能を追加することができます。デバッグ、Gitの統合、シンタックスハイライト、自動補完、リファクタリング、コードナビゲーションなど、プログラマーにとって便利な機能が多数搭載されています。また、VSCodeはWindows、macOS、Linuxの各プラットフォームで動作するため、幅広いユーザーに対応しています。
インストール手順
早速Visual Studio Codeを使ってみるにあたりまずはインストールしないと始まらない!ということで、インストール方法をご案内します!
とりわけ難しいことはなく、公式サイトからインストーラーをダウンロードして、【次へ】をポチポチ押していくだけでインストールできます。
公式ページからインストーラーをダウンロード
ダウンロードしたexeファイルをクリック
セットアップの案内に従ってインストール
インストールが完了したら、Visual Studio Codeが起動します。
最低限の初期設定(日本語化設定)
Visual Studio Codeには多数の拡張機能があり、コード作成を自動補助してくれたり、間違いも見つけてくれるなど、自分のニーズにあった機能を追加できますが、とりあえずまずはユーザーインターフェイスが英語なので、今回は最低限の導入のご案内ということで、メニューなどを日本語化する拡張機能のインストールとその有効化についてもご案内しておきます!
①拡張機能のアイコンをクリック
②検索窓に【jap】と入れる
③japanese language pack for visual studio codeの【install】をクリック
④Visual Studio Codeを再起動する
⑤VIEW>Command Paletteをクリック
⑥検索窓に【Configure Display Language】と入力→選択
⑦日本語をクリック
⑧【Restart】をクリック
以上で日本語化されます。
まとめ
ChatGPTも連携可能なVisual Studio Codeは今後のWEB制作におけるテキストエディタとしておすすめ!
古くはAdobe(旧macromedia)のDreamweaver(…今も存在はしていますが…)、だったり、Atomなど、WEBサイトのコーディングに特化したエディタがこれまでたくさん登場していますが、Visual Studio CodeはMicrosoftのソフトで、ChatGPTをはじめ様々な拡張機能があることから、現状においてはもっともおすすめできるテキストエディタかな!と思います!
Visual Studio Codeをはじめ、FigmaやCanva、Notionなども活用することで、今後の新しいWEB制作のフローをちょっと研究してみようと思います。
※それまでにボタン一発で素晴らしいWEBサイトが作れてしまうAIサービスが登場してしまうかもしれませんが…それはそれで、その時までのお楽しみということで!
また画期的な活用方法が見つかったら、ブログでご紹介したいと思います!
なお、Visual Studio Codeについてもっと知りたい!という方は以下書籍などもありますので、参照してみてくださいね(・v・)ノ
また、VS Codeなどのエディタを活用する前に、そもそもWEBサイトやブログをやってみたい!という方には、以下のロリポップサーバーやエックスサーバーのドメインなどもおすすめです!
ちょっと前に【個人サイト】がTwitterのトレンド入りをしたり、最近はSNSの共有疲れや、そもそも外部サービスの突然の利用規約変更や垢BAN、サービス終了などで困ったことになることが多いのか、自分で用意したサーバーで運営するWEBサイトやブログが注目をあびているみたいですし、興味があったら、ぜひ始めて見てくださいね(*・ω・)!