Bootstrap使ったら、誰でもかっこいいページ作れるんじゃないの？と調子に乗ってみたり、不安に思ってみたり。
本日もマナブさんの【保存版】プログラミング基礎の完全ロードマップ【挫折しない教材】で勉強中。
「９．Bootstrapを理解しよう【爆速でサイト制作】」に取り掛かりました。
BootstrapはCSS（Webサイトのデザイン）を簡単にするコードです。
普通はサイトの文字を表示させるHTML、サイトのデザインをするCSSで別々に書かないといけないんですが、Bootstrapを使うと、HTML内にCSSを簡素化して書いても、同じように表示される。
しかも、Bootstrapのサイトのコードをコピペするだけで、かっこいい感じに出来ちゃうんです。
マナブさんのブログ記事に載っていた以下の参考動画を見つつ
Bootstrap Tutorial For Beginners – Responsive Design with Bootstrap 3 – Responsive HTML, CSS
素人が15分程度で作れたのが……こんな感じ！
正直、上部のメニューバーを自力で作ろうとしたら、かなり大変なんですよね。
でも、これコピペだけで出来てます。
あと、下部の色がついたラインと、白い枠内のボタン（分かりづらいですが）も
<div class=”card”>
<div class=”card-heading bg-primary”>Widget 2</div>
<div class=”card-body”>
<a href=”#” class=”btn btn-primary”>do something</a>
</div>
</div>
という簡単なコードで構成されてます。
ちなみに、今回参考にした動画は少し古いものなので、”panel”という関数？が使われていますが、“panel”から”card”に変更してます。
というか、バージョンアップによって、似通った機能である2つのうち”panel”が廃止になったみたいです。
詳しく勉強したい方はBootstrapって検索したら、youtube動画とか見つかるはずです。
まだ勉強し始めなので、詳しくは書けませんが、このくらいで。
ただ本当に簡単に書けるので、勉強しやすいというのと合わせて、誰にでも出来そうで、需要があるのかどうか不安です。
まぁみんな忙しいですから、面倒なことは検索しないで、誰かに任せちゃうってこともあるかもしれないし。
あくまで、あくまでもHTML、CSSは基礎の基礎で、ボク自身もここは通過点としか思ってないので。
いえーい、簡単だーとか調子に乗ってる暇はないね、うん。
