はじめに
こんにちは。いとです。
実はつい最近、人生初仕事の、ある企業のキャンペーンページ(1枚)をコーディングする案件をやっておりました。
使ったのはHTML、CSS、Javascript,（jQuery ）です。
初めての実戦だったこともあり、変に力が入り、少し体調がおかしくなっていますが、なんとか形にすることはできたと思います。
ここまで来るのに約1ヶ月ほどかかりました。
今回はそんな経験を生かして、これからプログラミングを始める人に向けて、僕がしてきた勉強を紹介していきます。
初心者の方には少しは役に立つと思いますので、ぜひ読んでみてください。
伝えたいこと
この記事を通してみなさんに伝えたいことはたった一つです。
「とにかく早く実践するべし」
この意味は下を読めばわかると思います。
では順番に紹介していきます。
1,progate２周（HTML、CSS）
出ました。初心者プログラマーの強い味方。
こんな便利なものが月額1000円以下で使えるのです。
使わない手はありませんね。（ステマじゃないです。）
特にHTMLとCSSに関してはここで十分基礎を学習できるので、初心者なら最低でも２周はしましょう。
僕のprogateの取り組みは以下の通りです。
まず道場以外を２周→ヒントを見ながら道場１周→何も見ずに道場１周
ここで意識したことは、自分が今何をしているのかを明確に意識することです。
「floatを指定したら横並びになるんだな。」
「marginは外側、paddingは内側の空間を作るんだな。」
みたいな感じです。正解した後にすぐに進むのではなく、一度いじって変化を見るのも勉強になった気がします。
ただ正直、ここまでやっても力不足は感じていました。しかし、少し早いくらいでprogateは卒業しました。
結果的にこの判断は正しかったと思っています。その理由は以下で詳しく説明します。
2.ドットインストールでBootstrapを知る。
progateは学習のしやすさを重視している分、大切だけど難しいために省かれているものもあります。
その穴を埋めるのがこの段階です。
Bootstrapは、各要素を簡単に配置するための道具です。（ざっくり）
他にも教材はあるのですが、ドットインストールの以下の動画がわかりやすかったので、共有しておきます。
Bootstrapの基本から、簡単なサイト制作までここででできます。
3.本格的なサイトを模写する。
多分、ここからが大変です。
僕はYouTubeの二つの動画で学習しました。
一応貼っておきます。
https://youtu.be/9cKsq14Kfsw 基本編
https://youtu.be/V_lAhqLXT9A 応用編
たしかにすごく勉強にはなったのですが、音声が英語ですので、少し大変でした。
しかし、英語が苦手でも、コードは基本的に英語で書きます。
ですので、ここはどうにか頑張ると後が楽になることは間違いないです。
ちなみに、これらの動画で書くコードは商用利用可能ですので、改良して好きなように使うことができます。一石二鳥ですね。
4.案件開始！！
「え、もう？」と思った方もいるかもしれませんが、そう、もうやるんです。
ちなみに、ここまでJQueryの勉強は全くしていませんでした。
これは僕の感覚ですが、JavascriptとjQueryはその場でググればなんとかなります。
（一度触っておきたい人は、この本番の前にprogateで1周だけしておくと良いかもしれません。）
はじめにHTMLを書き、CSSで装飾し、最後にJavascriptやjQueryで動きをつけていきます。
もちろん、何度もググりながら。
苦闘すること１週間弱、なんとか一枚のページを形にすることができました！
一番はじめの「伝えたいこと」で書いた意味がわかっていただけたでしょうか？
僕も案件を振られた時、ハンパじゃないほど不安でした。
締め切り中に間に合うのか、そもそも自分なんかが一枚のページを作れるのか。
間に合いましたし、ちゃんと見本通り作れました。
人間は危機感があった方が早く成長できるものです。
だから、今学習中の皆さんも「ちょっと不安」くらいのタイミングで、クラウドソーシングなり、友達のお店のHP制作なりの仕事を受けてしまうべきだと思いますよ！
最後に
とここまで偉そうに語ってきたものの、僕もまだまだ初心者です。
一緒に頑張っていきましょう。
では。
この記事が「ためになった」「面白かった！」と思った人はこちらをクリック！！
現在、家庭教師の募集も行っています！気になった方、体験授業の申し込みは下の記事からお願いします！（残り1人分の空きしかありません。体験授業のお申し込みはお早めにお願いします。）
