🔎
まるで予測変換!｜Bootstrap クラス名補完機能（IntelliSense）
VSCode拡張機能でクラス名の候補を出す
「実際に開発で使っていくとなるとクラス名を覚えないといけないのかな…？」
そうハードルが高く感じている人も多いのではないでしょうか？
実は、VSCodeの拡張機能として、クラス名を途中まで入力すると予測して候補を表示してくれる補完機能があります。
それが「Bootstrap IntelliSense（ブートストラップ インテリセンス）」です。
Bootstrap IntelliSense
① VSCode拡張機能を検索し、インストール
- 画面左側、アクティビティバーから「拡張機能」タブを選択
- 検索欄に
bootstrap intellisenseと入力 - 「Bootstrap IntelliSense」をインストール
② 補完機能を試してみよう
- まずは適当なディレクトリをVSCodeで開く
-
index.htmlファイルを作成し、HTMLの雛形を作成
「!（エクスクラメーションマーク）」を入力すると、一瞬でHTMLの雛型が作成できます。
-
BootstrapをCDN形式で導入
公式ドキュメントの「Include via CDN（CDN経由でインクルードする）」からコードをコピーします
index.htmlの<head>タグ内に記述しましょう -
コードを書いて試してみる
試しに「fs」とクラス名を入力してみると、以下のようにいくつかの候補が表示されました。今回はfs-1を選択してみましょう。フォントサイズが変更されるはずです。
暗記は「発想するため」の武器を集めるためだけに使って欲しい
プログラミングはカンニングOK。
古の義務教育の弊害か、なんでも覚えようとする人が多いようにも感じます。そんなのめんどくさいじゃないですか。楽をするために、効率的にするために人々は技術を発展させてきました。先人の知恵と道具を借りましょう。今回ご紹介した補完機能も楽をする一例です。
そして、「ここをもっと楽したい」その思いを開発にぶつけていきましょう。
Discussion