デイトラのロゴ

Webアプリ開発コース初級編

WEBサイトとミニアプリを作れるようになろう

DAY 13
Bootstrapでサイトを作ろう

さて、これまで2日間にわたってBootstrapの基礎を学びました。

今日は実際にBootstrapを使ってサイトを作っていきましょう!完成形はこちら(PC版)↓



HTML/CSS編で作ったデイトラアプリとほぼ同じボリューム感のサイトですが、前回は3日かけてコーディングしました。

今度はこれを1日で、しかも1時間程度でレスポンシブまで完成させます!

↑の画像素材をダウンロードして、動画に沿ってコーディングしていきましょう!


TIPS

01.Bootstrapを使って簡単なサイトを作ってみよう!

40分と少しボリュームのある動画ですが、真っ白な状態からレスポンシブまで作って、解説込みで40分です!

完成まで早すぎて感動すると思いますw


慣れればこのボリュームなら15分くらいで作れますよ!

※動画の21分10秒から解説している「Grid cards」ですが、こちらの解説は英語版の公式(https://getbootstrap.com/)にしかありません!日本語版公式(https://getbootstrap.jp/)にはないので注意してください!

02.どうしても英語の公式サイトが苦手な方へ

こちらのサイトは日本語版のBootstrapリファレンスです。

ここまで英語の公式サイトで調べながらコーディングしてきましたが、「どうしても苦手で入ってこない」という方はこちらを利用してください↓

Bootstrap4 日本語リファレンス

ただ、プログラミングの情報が多いのは日本語より圧倒的に英語です。


できるだけ情報は英語で検索することに慣れておいた方が後々のためになりますよ!