bootstrap4のチートシートを使って簡単にサイト制作

FRONTEND

2019.04.29

2019.04.30

bootstrap4のチートシートを使って簡単にサイト制作

サイト制作において恐らく一番有名なフレームワークであろうbootstrap。これを使うことで、サイト制作にかかる時間を大幅に短縮できますし、デザイナーではなくても、ある程度のHTML、CSSの知識があれば誰でも簡単にサイトを作ることができます。

さらに、このbootstrapにはチートシートというものがあります。チートシートとはプログラマのカンニングペーパーのようなもの。これを活用することで、さらに簡単にサイトが作れるとのこと。bootstraoをよく使う人には当たり前の話なのかも知れませんが、僕は最近知りました。フレームワーク自体あまり好きではないので・・・上手く使いこなせればかなり便利だとは思うのですが。

hackerthemes

おすすめしている人が一番多いような気がします。サイトを覗いてみましたがたしかに便利そう。プレビューで確認しながらソースも見れます。

hackerthemes

Bootstrap4 CheatSheet

先に紹介したhackersthemesと似ていますが、こちらの方が掲載されているコンポーネントが少ないです。個人的にはhackersthemeの方が頼りになりそうですが、こちらも使っている人は多いみたい。

Bootstrap 4 CheatSheet

Bootstrap4 CheatSheet for Beginners

bootstrapで使われているclass名の一覧を確認できるようです。こちらはwebページではなくPDF。ダウンロードすればオフラインでも使うことができます。

Bootstrap4 CheatSheet for Beginners

Bootstrap4 CheatSheet

こちらもPDFで見ることができるチートシート。class名だけではなく、コンポーネントのソースも確認することが出来ます。印刷して手元に置いておくとちょっとしたときに見れるので便利かも知れません。

Bootstrap4 CheatSheet

チートシートの使い勝手の良さ

もちろん公式サイトのドキュメントの方が、最新の情報ですし、確実なのかも知れません。ただ、意外と目的のものを探すのが結構面倒だったりします。これはbootstrapに限った話ではないですが。そんなとき、こういったチートシートがあると作業を止めることもなくサクサクと制作を進めることが出来そうです。