見出し画像

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

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

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

当時、何気なくTwitterアカウントも同時に作りましたが大正解でした。

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

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

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

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

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

具体的な学習手順

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

言わずと知れたプログラミング学習サービスです。
HTMLCSSJavaScriptjQueryPHPまでやり、2週間ほど掛かりました。さっき確認したところLv.180になっていましたねw

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

2. Udemyを見ながらエディターを使ってみる

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

💡 Udemyの動画は必ずセール価格 (1200円〜1500円)で購入しましょう
通常価格はぼったくりなので注意。年に30回ほどセールの時期があります。つい買い貯めしがちですが、すぐに手を付けるものだけ買うのがオススメ。

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

正直今思うとインプット過多だったかなと思います。

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

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

とはいえ、この本をこなしたおかげでcontainerの使い方、positionプロパティ、擬似要素など基礎知識がかなり網羅されました。

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

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

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

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

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

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

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

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

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

💡30DAYSトライアルは、今年4月に買い切り型のオンラインスクール化して名称は「デイトラ」になっています
冒頭から色々書いてきましたが、本気でWeb制作をやりたい方は、最初からデイトラにお金払ってお世話になるのが一番効率良いと思います(笑)

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

ついに登場、僕の人生を変えたスクールです。

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

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

そしてこちらが、2019年の12月からの4ヶ月間で作ったWebサービスです。
TwitterでURL貼りまくりたい時にぜひ使ってみてください😉

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

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

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

CAMPの詳細や感想については長くなるので、これもまた別の記事にまとめたいと思います。気になる方はNinoさんにTwitterで相談してみてください。

さいごに

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

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

そして就職がゴールではなく、これから賞味期限付きのスキルを無限に習得し続ける旅が始まる訳なので、精一杯頑張っていこうと思います。
(ただ、ゲームと同じくらい楽しいので頑張っている感覚はほぼ無いです)

最後まで見て頂きありがとうございました 🙇‍♂️

🍵今後も「スクールに通うべきか否か」「効率の良い学習手順」「ポートフォリオ何作ればいいか」など、エンジニアを目指す人に役立つ発信をしていくので、Twitterとnoteのフォローをして頂けると嬉しいです!
この記事が気に入ったら、サポートをしてみませんか?
気軽にクリエイターの支援と、記事のオススメができます!
note.user.nickname || note.user.urlname

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

ありがとうございます!おちゃマルも喜んでます
30
エンジニアになるために取った戦略や、効率の良い学習方法などの知見を残します。

こちらでもピックアップされています

エンジニアを目指す人に役立つ記事
エンジニアを目指す人に役立つ記事
  • 4本

学歴も職歴も無い状態から、1年間の勉強期間を経て、フロントエンドエンジニアとして就職した経験を元に発信しています。

コメントを投稿するには、 ログイン または 会員登録 をする必要があります。