Bootstrapとは、Twitter社が開発したCSSのフレームワークです。通常は自分でスタイルを実装していく必要がありますが、Bootstrapを利用すれば、ボタンやフォームなど既に用意されているスタイルを適用するだけで、誰でも素早く整ったデザインのページを作ることが可能になります。
今回は、さらに簡単かつ素早くスタイルを開発できるブートストラップのチートシートをご紹介します。

プレビューを見ながらコードを確認できるチートシート

既存のBootstrapのチートシートというのは、Bootstrap 3 cheat sheetのように、グリッドなどに使われているスタイルをPDFにまとめたものでした。一方で、今回ご紹介するBootstrap 4 Cheat Sheetは、要素をクリックするとコード・スニペットとプレビューを表示してくれる便利なチートシートです。
Bootstrap 4 Cheat Sheet
「Code snippet」右上のCopyボタンを押すと、一発でコードをコピーすることができます。プレビューを見ながらコードをコピーできるので非常にわかりやすいです。
Bootstrap 4 Cheat Sheet2
Alert、Dropdown、Form、ProgressなどBootstrapで使われているほとんどのトピックを網羅しています。また、各要素の右横の?マークに公式ドキュメントへのリンクが貼ってあるので、詳細な情報を手に入れたい場合はそちらを参照するといいでしょう。
Webサイトをさらに早くかつ簡単にコーディングしたい方はぜひ利用してみてください。