学習期間５ヶ月、独立後４ヶ月で月収３０万を突破した「なる（@naru000006）」です。
この記事では、未経験から５ヶ月でフリーランスになった私が実際に行った学習ロードマップを紹介しています。
学習をはじめる前に…
「コーダーになる！」「フリーランスになる！」と決意し、半ば勢いで校長に「年度末で退職します」と宣言した私が最初にしたことは…
「同じ境遇の先人を探すこと」でした。
きっと世の中には、未経験からフリーランスのコーダーになってがっぽり稼いでいる人がいるはず…！
そう思った私はブログやTwitter（当時はまだTwitterでした）でいろんな人の学習記録を読み漁り…
正直我流でやっていく自信は全くなかったため、結果が出ている人の学習過程を徹底的にパクろうと心に決めていました。
その際、はらさんのYoutubeやしょーごさんのブログを大変参考にさせていただきました。
学習１ヶ月目:コーディングの基礎を叩き込む
学習１ヶ月目の学習内容はこちらです。
Progate
Progateでは無料かつゲーム感覚でWeb制作の基礎であるHTMLやCSSを学ぶことができます。
なんて素晴らしいんだ！！！
しかも、Progateのすごいところは「コーディングの環境が準備されている」ことなんです。
普通、コーディングをしようと思えば「VS Code」というエディターをPCにインストールする必要があります。
「さあ、コーディングを勉強するぞ！」と思ってもなんだかよくわからない難しそうなソフトをインストールしなければならないのはなかなかハードルが高いですよね。
なんと、Progateはアカウントを登録するだけで簡単にWeb上でコーディングできちゃうんです。
なんて素晴らしいんだ！！
しかし、そんなProgateも１つ注意点があります。
それは…「Progateをやりすぎないこと」
ゲーム感覚でついついProgateをやりこんでしまうのですが、一通り「HTML＆CSSコース」が終わったら次の学習ステップへ進むことをお勧めします。
そして、「道場レッスン」は必ず飛ばしましょう。
道場レッスンでは、学習したことを元に１から自分でデザインカンプ通りにコーディングを行うのですが…正直、学習レッスンと道場レッスンのレベルがかなり違うため、現段階で道場レッスンをするのは時間の無駄だからです。
道場レッスンを３周もした私が言うのだから間違いありません。
参考書「１冊ですべて身につくHTML＆CSSとWebデザイン 入門講座」
ProgateでHTMLとはなんぞやがなんとなくわかったら、参考書で学習しながらサイトをまるっとコーディングしていきます。
この参考書のよいところは、エディターソフトの導入からコーディングまで丁寧に説明されていることなんです。
参考書を読みながら手を動かすだけであら不思議、かわいいカフェのサイトが作れちゃいます
HTMLとCSSの基本構造を学ぶには最適な入門書です。
Codejump(入門編)
Codejumpは「作って学ぶコーディング学習サイト」の名前の通り、レベル別にたくさんのコーディング課題が用意されています。
すべての課題にヒントや答えのソースコード、デモサイトが用意されているため、自分で１からコーディングをするのに不安な方でも安心して取り組むことができます。
また、このCodejumpの面白いところは、課題の単価が設定されていることなんです。
コーディング時間を計測して、時給を割り出してみるのもおすすめです。
私は最初びっくりするほどの低単価でした…（笑）
学習２ヶ月目:jQueryでアニメーションを実装！感動！
学習２ヶ月目でアニメーションについて学習していきます！
Webサイトではいろいろなアニメーションが使われています。
スクロールすると下から浮き上がってきたり、ボタンにカーソルを重ねたら色が変わったり、クリックしたら文字が出てきたり…
それらのコードは「JavaScript」という言語で書かれているのですが、いきなりJavaScriptを書くのはかなり難しいです。
しかし！「jQuery」というJavaScriptを簡単に記述できるプラグインを使用すると簡単にアニメーションをつけれちゃうんです。
実案件でもjQueryはよく使われているため、はじめは「jQuery」について学習することをおすすめします。
jQuery標準デザイン講座
私が学習に使用したのはこちらの「jQuery標準デザイン講座」です。
1つ1つの課題を丁寧に説明してくれているので、この１冊をやり切ればjQueryは完璧！
Web制作でおなじみハンバーガーメニューだって作れちゃいます。
See the Pen ハンバーガーメニュー by narukichi06 (@narukichi06) on CodePen.
はじめてハンバーガーメニューを実装したときの感動…！！！
自分の思い通りにコードが動いてくれる嬉しさはコーダーならではですね！
この本ではほかにも様々なアニメーションを学習することができるのですが、一番大事なことは…
「完璧を追い求めないこと」
「jQueryってこんなことできるんだ～」程度の理解でOKです！
「本を見ずに実装しないと…」なんて考える必要ありません！
だって、実案件でも何も見ずにコードを1から書くなんてことはないからです。
コーダーに必要なのは「分からないことはググって実装できること」であって「何も見ずに１からコードを書く」ことではないからです。
お客さんにとって重要なのは、「納期通りにミスなくコーディングしてくれること」だからです。
コーディングの学習で大切なのは「調べれば実装できる力」を身に着けること
コメント