プログラミングを独学で習得する手順【フロントエンド 転職編】
昨今のエンジニアへの転職ブームや副業ブームが合わさって、プログラミング初心者の数が今爆発的に増えています。
プログラミングは、動画編集やAdobeソフトを用いたデザインなどと比べると、学習コストが比較的高く、挫折してしまう人が多いのが現実です。
「挫折してしまうならプログラミングスクールに行けばいい」という人がいるかもしれませんが、スクールは安くても8万円、高い場合には数十万円もかかることがあります。
「自己投資として、それくらいの投資をためらうなよ」と思うのはよろしくないです。
世の中にはいろんな人がいます。
スーパーかかあ天下で、毎月のお小遣いが月に３万円というかわいそうな夫がいるかもしれません！
世の中には数十万円〜数百万円とする優良教材があるくらいですから、通常であれば、10万円程度ならすぐにでも投資して欲しいレベルですが、各々の家庭でどのような事情があるかはわかりません。
プログラミングを独学で学ぶことは、結論を言ってしまえば可能です。
ただ、当然スクールに通うよりも、強いメンタルと正しい勉強方法の理解が求められます。
そのため、今回はそのようなスクールに何かの事情で通えない人のために、プログラミングをゼロから独学で学ぶ勉強方法についてまとめていきます。
この「プログラミングを独学で学ぶ手順」は、フロントエンド編とサーバーサイド編の二つに分けてまとめていきます。
さらにフロントエンド編では、「副業で稼ぐための手順」と「エンジニアに転職する手順」の二つに分けており、今回はエンジニアに転職するための独学での学習手順について、まとめていきます。
プログラミングの学習を始める前に
プログラミングの学習をする前にやらなければいけないことは、具体的な手順の前に、しっかりと継続的に学習できるマインドや作業環境を整え、正しい勉強方法を知ることです。
プログラミングは、転職するにしても、副業をするにしても、他の分野より比較的覚えることが多く、またエラーが多発することにより挫折しやすいことは事実です。
そのため、いきなり勉強に入るのではなく、必ず先ほど言った、学習する上でのマインドや作業環境、正しい勉強方法の理解は、必ず整えておいてください。
これらについては、以下の記事にまとめてありますので、熟読するようにしてください^^
STEP1：Progate
上記の記事を読んでくれたら、次からは早速具体的な学習に取りかかります。
一番初めに取り掛かるのは、よくネット上でも言われているようにProgateで問題ありません。
いきなり分厚い書籍などで学習を始めてしまうと、十中八九挫折してしまいます。
Progateの具体的な進め方やスケジュール感については以下のような感じです。
（）内が目安となる所要時間ですが、割とゆったりめに設定してあるので、このラインは超えないように努力してください。
- HTML&CSSコース：2週以下（3週間）
- JavaScriptコース：1週（1週間）
- jQueryコース：2週以下（1週間）
- Saasコース：1週（2日）
- Gitコース：1週（2日）
- Command Lineコース（2日）
もちろん、全て「道場コース」まで含んだスケジュールになっています。
2週以下と書いてある項目は、1週で十分だと思ったらすぐに次に進んでください、という意味です。
逆に2週以上はしないようにしてください。
Progateをぐるぐる周回するのではなく、次へ進んでわからなくなったら、都度戻るような学習にしましょう。
他にはWebパス開発なるものがありますが、フロントエンドエンジニアとして転職するだけであれば、バックエンドの知識はそれほどいらないです。
「GET」「POST」「PUT」「DELETE」の4つのHTTPメソッドが理解できていれば、業務に支障をきたすことはありません。
もしかしたら、転職してからバックエンド側も一部担当することになるかもしれませんけど、必要になったときに知識をインプットすれば大丈夫です。
初学者はとにかく必要最小限の知識だけインプットして、ささっと転職活動に移りましょう。
転職に必要な知識だけをインプットして、JavaScriptのフレームワークとか、UIUXの知識などのような、プラスアルファの知識は転職後に現場で学習した方が、効率がいいです。
Progateのより詳細な勉強方法や、ぐるぐる周回してしまう原因などをまとめた記事を以下に添付しておくので、こちらも合わせてご覧ください。
STEP2：簡単なサイトを作ってみる（1ヶ月）
STEP1でProgateが終わって、基本的な知識をインプットすることができたら、STEP2からはアウトプットベースの学習に移っていきます。
このSTEP2については、「副業編」と内容は同じになっていますが、大事な部分なので、念のためにもう一度説明しておきます。
どのようにアウトプットするかというと、自分が作ってみたいサイトを作るのが一番手っ取り早いです。
例えば、自分の場合は「海外を旅するバックパッカー用に、各国のバックパッカーが知りたそうな情報をまとめた静的なサイト」を作りました。
自分が大学生の頃にバックパッカーをやっていたこともあって、普通の旅行者とバックパッカーとでは、求めている現地の情報が若干違うことがわかっていました。
そのため、バックパッカーに特化した情報をまとめようと思ったわけです。
こんな感じで、自分の趣味と関連付けながら考えると、案外自分が作りたいサイトはすぐに決まったりします。
サイトの中身を考えるときは、自分が趣味をやる中で、「こんなサイトがあったら便利だな」程度で大丈夫です。
実際にリリースするわけではないので、需要があるとかないとか、その辺は深く考えなくてもいいです。
自分の日常生活を思い浮かべてみて、何かの「不（不満、不便…）」を解消してあげるサイトでもいいかもしれません。
何か思い浮かんだら、すぐに制作にとりかかるのが重要です。
上記のように考えてみても、どうしても作りたいと思えるものが浮かばないという人は、「模写」でも構いません。
副業する際に営業活動に使うポートフォリオとしては、やはり模写ではなく、オリジナルサイトの方がいいので、できたら模写ではない方がいいのですが。
模写するときに、どのサイトを模写すべきか迷う人は、まずはProgateの道場コースで作り上げたサイトと同じものを、自分のエディタで模写してみましょう。
ここのSTEP2では、実際に自分でエディタを使ってコーディングしてみるというのがポイントとなります。
エディタとしては色々種類がありますが、迷ったときはとりあえず、「Visual Studio Code」を選んでおけば大丈夫です。
このオリジナルサイトや模写は、最低2つ作るようにしてください。
おそらくこのSTEP2が最もハードですが、このアウトプット量をこなせば、基本的な、HTMLとCSS、JavaScript（jQuery）は扱えるようになっているはずです。
ここで心が折れてやめてしまったら、そこで試合終了です。
アウトプットは大変ですが、それだけ早く力がついていきます！
ポートフォリオサイトのオススメの制作方法を、以下の記事にまとめていますので、ぜひご覧ください。
STEP3：転職活動をする
ひとまず、HTML、CSS、jQueryを使って、自分のオリジナルサイトが二つ完成したら、ここで転職活動に移りましょう。
「このスキルセットで転職活動始められるの？」と思う人がいるかもしれませんが、答えは「可能」です。
何故ならば、確かにエンジニアに転職する際は、スキルが高いにこしたことはないですが、完全未経験の場合は、スキルよりもどちらかというとヒューマンスキルの方が重要だからです。
つまり、コミュニケーション能力や、レスポンスの速さ、メールの文章などですね。
実際に自分も転職活動をやっていたときに感じましたが、スキルよりも明らかにヒューマンスキルの方が重要視されていた印象です。
せっかくポートフォリオを持っていっても、ほとんど触れられずに終わることだってあったくらいです。
触れられたとしても、1〜2個の簡単な質問をされて終わりということが多かったです。
そのため、ポートフォリオサイトが2つできた時点で転職活動を始めるのは、戦略的にかなりありです。
変にVue.jsやReactなどのようなJavaScriptのフレームワークの勉強に時間をかけるよりも、面接対策に時間をかけた方が明らかにコスパがいいです。
企業側もJavaScriptのフレームワークとか、UIUX周りの知識などは、入社してから身につければいいというスタンスを取っていることがほとんどです。
転職活動時によく聞かれる質問やそれに対する答え方だったり、求人サイト「Wantedly」の使い方については、以下の記事にまとめていますので、そちらもフルに参考にしてみてください。
STEP4：JavaScriptのフレームワークを使ってサイトを作成する（4週間）
STEP3の段階でかなりの確率で転職活動は成功すると思いますが、何十社もうけたが、どこからも内定がもらえなかったとなった場合は、JavaScriptのフレームワークを勉強しましょう。
フロントエンドエンジニアとして入社したら、どうせVue.jsかReactかAngularなどのJavaScriptのフレームワークを使うことになるので、転職前に勉強しておいても1mmも損はないです。
オススメは、Angular以外です。
Angularよりも、Vue.jsかReactを使っている企業が多いし、何よりもAngularは学習コストが高いので、初学者には絶対に無理です。
ここでVue.jsかReactの二択になりますが、これに関してはどっちでもいいですね。
どっちのフレームワークも公式ドキュメントやチュートリアルは充実しているので、基礎を押さえるくらいならば、大して学習コストは変わらないです。
特にReactの方は、Progateでも扱っているので、Progateが大好きという方はReactでいいかもしれないです。
そして、フレームワークの基本を学習したら、自分のポートフォリオをフレームワークを使って作り直してみましょう。
もちろん、jQueryバージョンは残しつつですよ。
そして4週間ほどかけて制作が完了したら、再びSTEP3の転職活動に戻りましょう。
そして面接などでは、しっかりとJavaScriptのフレームワークを使って、ポートフォリオを作成したことをアピールしましょう。
ここまでしておけば、スキルセット的にはもうすることはないので、もし内定がなかなかもらえないようであれば、ひたすらヒューマンスキルを磨きましょう。
まとめ
プログラミングをゼロから学び始めて、STEP3の段階でうまくいけば、だいたい14週間ほどで転職活動が完了します。
つまり3ヶ月半くらいですね。
できれば、STEP4に行くことなく、STEP3で転職活動が終了するように、ヒューマンスキルを磨いて頑張りましょう。
何故ならば、STEP4で学ぶJavaScriptのフレームワークは、独学するよりも、明らかに現場に入ってから学習した方が効率がいいからです。
そのため、STEP3の転職活動は1〜2ヶ月は粘るようにしてください。
どうしても、自分が行きたいレベルの企業が、JavaScriptのフレームワークだったり、その他のプラスアルファを求めてくるようであれば、STEP4に進んでください。
ここで余談なんですけど、余裕のある人は、転職活動をしながら、発信活動用に、面接官からよく受けた質問とか、裏話とか、自分が経験した印象的なことを逐一メモしておくいいです。
そうすれば、転職活動後にTwitterでもブログでもYouTubeでも、発信できるネタになって自分をブランディング化することに役立ちます。
転職活動、なかなか大変だと思いますけど、大変なことの後にはいつだっていいことが待ってますからね。
塞翁が馬です。
それでは転職活動、応援しています^^
- STEP1：Progateで基礎知識をインプットする
- STEP2：簡単なサイトを作ってみる
- STEP3：転職活動を行う
- STEP4：JavaScriptのフレームワークを勉強する
今回の内容については以下の動画でも解説しているので、ぜひご覧ください^^
