こんにちは、LLENNです。
サイト模写が難しくて萎えている人:プログラミングの基礎学習を一通り終えたので、サイト模写をしています。ですが、難しすぎて全く進みません。どうすればいいですか?
こんな疑問、悩みにお応えします。
結論としては、「BootStrapを学習する」ことが、裏技です。
本記事の内容
・サイト模写が難しくて挫折しそうな時の対処法:「BootStrap」を使おう
・サイト模写の裏技「BootStrap」を学習する方法
・ある程度進んでいるなら、難しくてもゴリ押しでOK。
・サイト模写が難しくて挫折しそうな時の対処法:「BootStrap」を使おう
・サイト模写の裏技「BootStrap」を学習する方法
・ある程度進んでいるなら、難しくてもゴリ押しでOK。
この記事を書いている僕は、サイト模写の難しさに負けて一度挫折しました。
ですが、裏技を知ってからはびっくりするほどラクになったので、あなたにもその方法をお教えしますね(^^)
サイト模写が難しくて挫折しそうな時の対処法:「BootStrap」を使おう
いきなり結論ですが、サイト模写が難しく感じるなら「BootStrap」を使いましょう。
理由は2つ。
・サイト模写が圧倒的に早くなる → 初心者でもスムーズに模写を進められる
・今後の制作でも使える
BootStrapとは?
簡単に言うと、コーディングを効率化するために用意された「テンプレート」のようなもの。
正確には、「CSSフレームワーク」ですが。まぁ、「コーディングがラクになるんだな!」くらいの認識でオーケーです。笑
・ナビゲーションバーが作れない。。。
・オシャレな配置をマネしたいけど、CSSで指定するのがムズい。。。
「BootStrap」を使えば、複雑なCSSをすっ飛ばして最速で構成できるので、こんな悩みは冗談抜きで吹っ飛びました。
「初心者が詰まりやすいポイント」をサクッと乗り越えられるのが、「BootStrap」なので、学ばない手はないですよ。
サイト模写の裏技「BootStrap」を学習する方法
「少しインプット → 実際に手を動かす」でいいかなと。
インプット教材は以下です。
ブログ記事1本
こちらの記事です。正直、概念を理解するのにはマジでピッタリな記事なので、一通り目を通してください。
動画1本
上記の記事を見終えたあとは、動画で学習するのがおすすめです。
理由としては、実際のコーディングの様子を見ながら学習できるからですね。
補足:いきなり実践に移ってしまってもOK。
ちなみにですが、「記事1本でマルっと理解できたよ!」という方は、模写に戻っていきなりコーディングを始めてもOK。
プログラミングは手を動かした方が慣れますので。
動画を使う人向け
ドットインストール有料版を使うのもありですが、「Udemy」にある以下の動画が、コスパが良く勉強になります。
≫ Bootstrap 4 From Scratch With 5 Projects
BootStrapで、実際にサイトを作るまでのカリキュラム。英語の動画ですが、画面を見ながら実際に手を動かしていけば、ぜんぜん大丈夫です。
通常価格で購入すると少し高くて萎えますが。。。けっこう頻繁にセールもやってるので、自己投資だと思ってポチってしまいましょう。
ここまでやれば、 BootStrapを使いこなせるようになるハズ。お疲れ様でした(^^)
参考:BootStrapで、どれくらいサイト模写がラクになる?
結論、めちゃくちゃ楽になります。
どの程度かと言いますと、「地方から都心まで、これまでは自転車で行っていたが、電車が使えるようになった」くらいですね。
※分かりにくくてゴメンナサイ(^^)
【スルー推奨】
別のアカウントでもツイートしましたが、「Airbnb」の模写サイトがほぼ完成しました。
余白などはまだですが、大枠です。
「BootStrap」は、学んでおいて損のないフレームワークですね😆 pic.twitter.com/6C15CCql4r
— LLENN(レン)@ブロガー19歳 (@LLENNblog) April 6, 2020
僕は、上記サイトの模写の9割を、わずか4時間で終えられました。
(ちなみにですが、AirbnbのサイトはBootStrapで開発されているそうです。)
たぶん、普通にCSSとか使ってたら大枠だけで2日近く掛かっていたかと思います。
ある程度進んでいるなら、難しくてもゴリ押しでOK
ここまで、初心者がサイト模写をする際に学んでおくべき「BootStrap」についてご説明してきました。
ただ、半分以上が完成していて、その地点で「キツいな。。」と感じているなら、そのまま普通にCSSでゴリ押した方がいいかもしれません。
なぜなら、既にあなたはCSS成形の能力を証明できているから。自分を信じて続けてしまいましょう。
ただ、圧倒的に「ラクしたい。」「早く作ってしまいたい。」と思うなら、ツールを使うのがオススメ。
「BootStrap」で、サイト模写をサクッとやっちゃいましょう(^^)
繰り返しですが、学習方法は以下の通り。
「BootStrap」の学習手順
→こちらの記事に一通り目を通し、概念を理解する。
→Udemyの動画教材内で手を動かしながら、実践。
※≫ Bootstrap 4 From Scratch With 5 Projectsは、セール時に買うのがお得です。
人気記事