前から存在は知ってたけど、実際に試してみたらやっぱり便利だし、見た目もきれいに仕上がる。久しぶりに、SocialRSSを修正しようと思って、ふとこれまで使っていたBlueTripからBootstrapに切り替えてみようと思ったら、短時間でできた。
そもそもCSSフレームワークとは
CSSのレイアウト定義が予めされていて、グリッドを使ったレイアウト構成やテーブルデザインなど、基本的なデザイン要素が簡単に使えるようになっているもの。そのまま使う場合はデザインにある程度制約が入るものの、基本的なデザイン要素が既にあるので、開発が速い。
Bootstrapとは
Twitterが公開しているCSSフレームワーク。もともとはTwitterが社内で利用していたものをオープンソース化したもの。
Bootstrap, from Twitter |
ライセンスはApache License 2.0。利用や配布に制限はないが、ソフトウェアなどにApache Licenseであることを記載する必要がある。実際BootstrapのCSSファイルをダウンロードしてみると、最初にApache Licenseであることが記載されている。
Bootstrap適用結果
修正前のSocialRSSはこちら。
導入した結果はこちら。デザイン的にもすっきりした。デザイン変更の所要時間も１時間ぐらいかな。
あと、このサイトでデフォルトじゃないデザインに変更した。これも、CSSファイルを置き換えるだけなので、すごい便利。
Bootswatch: Free themes for Twitter Bootstrap |
Bootstrapの学習はドットインストールで
参考にしたのは、ドットインストール。ここのメニューにBootstrapがあったので、これを見ながら、いじりたいところだけ効果的に学習できた。すごい助かった。
3分動画でマスターする初心者向けプログラミング学習サイト – ドットインストール |
最初の使い方を学ぶんだったら、これで大体OKな気がする。たまにしか開発しない人にとってはありがたい。
あと、最近読んだ「小さなチーム、大きな仕事」を参考に、不要というか自分が要らないと思う機能とか要素は削った。自分が使いたいサービスにしたいし。