Bootstrapを使うとサイト制作を効率化できるって聞いたんだけど、どうやったら使えるようになるのかな?
この記事は、「細かいことはさておき、とりあえずBootstrapを使ってみたい」という方におすすめです。
この記事はBootstrapのver 4.3を基に記載しています。
Bootstrapを使う準備は5分で完了!
Bootstrapを使うためには何が必要?
Bootstrapを使うために、アプリケーションをダウンロードしたり、インストールしたり…という作業は必要ありません。
「あらかじめ用意されているデザインをHTMLで読み込む」ことで利用することができるようになります。
HTMLでデザインを読み込む方法は、
・インターネットから読み込む
・ファイルをダウンロードして読み込む
の2種類の方法がありますが、ここではより簡単に導入できる「インターネットから読み込む」方法で進めます。
この方法は「読み込み先のファイルが無くなった」など、自分でコントロールできない要因でデザインが崩れてしまう可能性があるので、Bootstrapに慣れるまでのテスト環境などの構築に適しています。本運用する場合は「ファイルをダウンロードして読み込む」方法を推奨します。
Bootstrap公式サイトからコードをコピペしよう!
Bootstrapは、HTMLでデザインを読み込んで利用するため、読み込むためのコードをHTMLに書く必要があります。
ご心配なく!
Bootstrapの公式サイトに掲載されている【Starter template】をコピペしてHTMLを新規作成すれば、必要なコードが記述されたHTMLファイルが秒で完成します。
【引用元:Bootstrap公式サイト】
これで、Bootstrapを使えるようになりました!
超簡単!!
編集後記
「環境構築」というと、アプリケーションをダウンロードしてインストールするようなイメージだったので、「Bootstrapというアプリケーションがない」っていうのが最初は理解できなくて戸惑ったので、この記事を書きました。