こんにちは、アヤカルです。
プログラミングの学校に通い始めて２週間がたちました。いやぁ、みんなで机を並べて勉強するのって楽しいですね。
これまでに学校で習ったことで「なんと便利な！！」と思った機能やツールをぼちぼちまとめていきたいと思います。
今回はVisual Studio Code編です！
こんな方に向けて書きました
- 私と同じようにスタートラインに立つ方
- 今HTML & CSS を勉強している方
- 初心を思い出したいプログラマーの方
- プログラミングの学校で何を習うのか興味のある方
Visual Studio Code とは？
Visual Studio Code(以下VSCと略します)とは、テキストエディターです。コードを書くだけなら「メモ帳」でもかけるのですが、テキストエィターを使うと補助機能が豊富なので、めちゃめちゃコードが書きやすくなります！しかも無料！
インターネットで「Visual Studio Code」と検索するとダウンロードページが見つかりますよ。
秒で基本コードが書ける！
[html]形式で保存したファイル「！」と入力すると基本コードが出現！マジックかよ！？『html:5」と入力するとコードが現れるのは知っていましたが、さらに短くなるとは！
VSC 同じ要素（エレメント）を複数入力するとき…
リストを作成するときとか、いくつも同じ要素を入力するのは面倒ですよね。私なんて、何個入力したか忘れるし、後から数えても間違えてるし…（小学校から出直すべき）
そんな私のこともVSCさんは見捨てません！
たとえば <li></li> を５個入力したい時、ただ li*5 と入力するだけであら不思議！
マジックかよ！？
こんな無駄リストも作りたい放題です。
ローカル環境をサクッと構築
Live serverとはVSCの拡張機能で、簡易ローカルサーバーを起動してくれるツールです。
記述したコードの動作をサクッと確認できるので、便利です！
下準備として、Visual Studio Codeのマーケットプレイスで「live server」を検索しインストールします。
起動するときはVSCの画面の右下の方にある「live」をクリックします。
Macの場合は「command」＋「shift(⇧)」＋「P」でも起動しますよ〜。
ちなみに
あれ？変更したのに更新されてない…
というときは大抵ファイルを保存し忘れている時だったりします。
私は1日１回は「あれ？」って言ってます笑
今後も引き続き「ええ！そんな機能があったんかー！！」というものに遭遇したらシェアしたいと思います。
一緒に「ええ！そんな機能が…！！」と感動をわかちあえたら嬉しいです。
また、「ええ！そんなことも知らなかったのー！！」と逆に驚かれた方は、こんな私にコメントでいろいろ教えていただけますと嬉しいです。
ではまた〜
