見出し画像

未経験から1年以上掛けてフロントエンドエンジニアになるまでにやったこと

Haruka Kawaguchi

2019年の1月からプログラミングを勉強し始め、2020年の4月に無事内定を頂き、エンジニアとしてのキャリアをスタートされることが出来ました。

紆余曲折した過程や、使用した教材やスクールについて、同じ道を通る方のためにログを残しておこうと思います。


エンジニアを目指すきっかけ

きっかけはマナブさんのYouTubeの1本の動画でした。

「バイトするよりクラウドソーシングでLP作成する方がオススメ」といった主旨の内容で、具体的な学習手順が示されていたことにより、前々からあったプログラミングへの興味に火がつきました。

僕は、最終的にはWeb制作のフリーランスではなく、Webアプリ開発の正社員として就職する道を選びました。

しかし、マナブさんの動画が「あなたへのおすすめ」に表示されていなかったら今の自分は居なかった訳なので、とても感謝しています🙏

具体的な学習手順

1. Progateでプログラミング初体験

言わずと知れたプログラミング学習サービスです。

HTMLとCSS、JavaScript、jQuery、PHPまでやり、2週間ほど掛かりました。その後も何回か使っていたので、ついさっき確認したところ Lv.180 になっていました。

初めてプログラミングに触れる人は圧倒的にProgateがオススメです。
無料の記事や教材もたくさんありますが、流石に1000円をケチることで大幅にタイムロスするのは勿体ないので、課金して1ヶ月でやり切るべきです。

2. Udemyを見ながらVSCodeを使ってみる

たにぐちまことさんの動画教材を購入し、「どうやらVSCodeというエディターが主流になっているらしい」などと調べながら進めた記憶があります。
説明がとても丁寧で、Progate上がりの人にちょうど良い難易度でした。

⚠️ Udemyの動画は必ずセール価格 (1200円〜1500円)で購入しましょう。
通常価格はぼったくりです。年に30回ほどセールの時期があります。

セール時にはつい買い貯めしがちですが、すぐに手を付けるものだけ買うことをオススメします...。(自戒)

3. 技術書でマークアップの細かい知識を得る

ここで初めて技術書で勉強してみる訳なのですが、正直インプット過多だったかなと思います。

今でこそ「分からない→ググる」を無限にこなすようになりましたが、最初の頃は突然海の真ん中に放り出されて「何をしたらよいか分からない」状態になるのでアウトプットが怖くなるんですよね...。

この辺りで一度、まずは書いたことのあるコードでも良いので、見本が無い状態で、エディターでマークアップしてみることをオススメします。

とはいえ、この本をこなしたおかげでcontainerの用途、positionプロパティ、擬似要素など、基礎知識の抜け漏れがかなり埋まりました。

初学者には書籍は必須ではないと思っています。
性質上仕方ないのですが、情報が古くなりがちなのと、マークアップであれば分かりやすい記事や教材がネットに溢れていることが理由です。

ただ、本より網羅的に学べる教材はないので1,2冊くらいはアリです。

当時は無かった本なのですが、今から選ぶならこれがオススメです！
書店で立ち読みしたのですが、分かりやすくて感動しました。

4. 30DAYSトライアルで実務形式に近づく

「30DAYSトライアル」は「30日間、毎日ツイートされる課題をこなしてWeb制作のスキルを身に着けよう」という主旨の企画です。

なんと当時は無料で、教材とロードマップの提供、企画によるモチベート、質問出来るコミュニティまで用意されている楽園状態でした🙄

デザインカンプをピクセルパーフェクトでマークアップする課題をこなしたことで自信が付き、自分でデザインも含めて作ったLPを片手にマークアップエンジニアとして就職活動をしました。

結果は、2社で面接させて頂けたものの内定には至りませんでした。そもそも応募数が圧倒的に少ないのですが、本当にWeb制作がやりたいのか迷っていました。その迷いが結果にも反映されてしまったような気がします。

Web制作をするか、Webアプリ開発をするか、みたいな話は長くなってしまうのでまた別の記事で書こうと思いますが、Web制作を勉強し始めた方には、その延長線上にWebアプリ開発の選択肢もあることを知っておいて欲しいと思っています。

ちなみに「30DAYSトライアル」は、今年4月に買い切り型のオンラインスクール化して名称は「デイトラ」になっています。

冒頭から学習手順を書いてきましたが、本気でWeb制作をやりたい方は、最初からデイトラにお金払ってお世話になるのが一番効率良いと思います。

5. CAMP (現Flock) でWebアプリの開発スキルを身に付ける

就活失敗後、Webアプリ開発を学ぶために入会した「CAMP」は僕の人生を変えたプログラミングスクールです。

※ 現在は「Flock」という名前に改称し、リニューアルされています。
以下の文章は僕が在籍していた「2019年の12月〜2020年4月」時点のスクールの状況を元に書かれているため、情報が古い部分があるかと思います。

エンジニア歴6年のNinoさんが運営しており、完全オンラインでオリジナルのWebサービス開発のサポートをがっつりしてくれます。
愛のあるスパルタ教育で、コピペ実装に頼らない自走力が身に付きます。

Ninoさんの腕が気になる方は、YouTubeでライブコーディングを見てみてください。この動画では1時間でポケモン図鑑を作っています。

CAMPでは、フロントにはJavaScriptのフレームワークのAngular、バックエンドにはFirebaseを使って、デザイン含めてすべて1人で制作します。

これを実績にして、今度はフロントエンドエンジニアとして就職活動を行い、無事に希望する会社から内定を頂くことが出来ました！

「リンク集メーカーMIRU」については、Qiitaで詳しく紹介しています。
ポートフォリオ制作中の方などは参考になるかもしれません。

さいごに

最初はWeb制作をやっていくつもりで勉強していたので、遠回りもしました。しかし、学歴や職歴に乏しい人がJSのフレームワークを習得してフロントエンドエンジニアになるには、6ヶ月程度は必要ではないかと思います。

このご時世なので、未経験エンジニア市場はさらに厳しくなっています。
周りの人ではなく過去の自分と比較し、焦らずじっくり成長し続けることで、今まで求められていた水準以上に即戦力になることを目指すことが大切になると思います。

そして就職がゴールではなく、これから賞味期限付きのスキルを無限に習得し続ける旅が始まる訳なので、楽しみながら頑張っていこうと思います！

以上になります。最後まで見て頂きありがとうございました。

おちゃマルの餌代にします