初めてのBootstrap

オリジナルアプリを作成するにあたって、Bpptstrapを使ってみることにしました。

Bootstrapは簡単にレスポンシブなデザインのWebページを作成することができるため、非常に人気なようです。

 現在、アルファ版のBootstrap5が出ているようですが、今回のオリジナルアプリにはbootstrap4を導入しています。

実際にBootstrapを使用してみます。

コードの書き方はこのサイトがとても参考になりました。

ヘッダーのテンプレート部分にBootstrapを用いました。

率直にとても使いやすいという印象を受けました。

ナビゲーションバー以外にも、link_toタグにclass属性で"btn btn-primay"とするだけで

↑これが

↑こうなりました。

CSSをいじることなく、すぐにボタンが完成しました。

classのprimaryの部分を変更することで色を変更することもできるようです。

とても簡単ですね。

これからBootstrapを利用して、よりリッチなサイトを目指していきます！