tatsuyankmura

株式会社ベイジのフロントエンドエンジニア、中村竜也のブログです。

独学・未経験でフロントエンドエンジニアになる方法

私は25歳の時に異業種から、Web業界に入りフロントエンドエンジニアになりました。

職業訓練校やスクールに通わず、知識ゼロの状態からフロントエンドエンジニアになるために行ったことや転職活動で使った求人サイト、面接で気をつけたポイントや意識したことをまとめてみようと思います。

これからフロントエンドエンジニアを目指している人、異業種からWeb業界への転職・キャリアチェンジを考えている方の参考になれば幸いです。

そもそもフロントエンドエンジニアとは

一般的にフロントエンドエンジニアとは、HTML/CSS/JavaScript/PHPなどを利用しWebサイトやWebアプリケーションの見た目や操作する部分を構築する人を指します。HTMLコーダーやマークアップエンジニアとの違いは、HTML/CSSの設計がメインの前者に対し、マークアップエンジニアJavaScriptPHPの実装、CMSや各種APIの知識・スキルなども求められてきます。

また、フロントエンドエンジニアはユーザーが直接操作し触れるところを作るため、実装の技術だけでなく、ユーザーが利用しやすい・操作しやすいと感じるためのUI/UXの知識も必要となります。デザイナーとの距離も近く、動きのあるUIやユーザーにとってのメリットを提案・話し合いを行い、ブラッシュアップをしてより良いものを作って行くコミュニケーション能力や熱意なども欠かせないです。

フロントエンドエンジニアと一言で言っても、様々なジャンルの実装があり、Webアプリケーションの構築を得意するエンジニアもいれば、アニメーションやWebGLなどの3Dを得意としているエンジニアがいたりと、そのジャンルによって必要となってくるスキルや磨く技術は変わってきます。

ただ総じて、HTML/CSS/JavaScript/PHPの知識はフロントエンドエンジニアを目指すのであれば必須の知識となるでしょう。

フロントエンドエンジニアになるためにやったこと

ここからは実際に私が行った勉強方法や面接のために行ったことなどを紹介していきます。

1. リファレンス本を見ながら実際にWebサイトを作ってみる

いろいろな本を読み漁りましたが、入門段階では知識を詰め込むよりも、実際に手を動かしWebサイトを作る方が楽しく効率的に知識を身につけることができます。

私的ですが以下2冊の本がオススメです。

たった二日で楽しく身につくHTML/CSS入門教室

HTML/CSSの基礎を学びながらWebサイトを構築していくリファレンス本です。テキストエディタの使い方やサーバーへのアップロードの方法も記載されており、手っ取り早く一度Webサイト制作を体験してみたい方にはオススメです。

これ1冊でゼロから学べる Webプログラミング超入門 ーHTML,CSS,JavaScript,PHPをまるごとマスター

上記の本よりは難易度が上がり、JavaScriptPHPのプログラミングも体験できます。こちらはリファレンス本ではなく、部分的なデザインやJavaScriptPHPを使った一部の機能を作成する内容です。HTML/CSSだけではのも足りなかった方が2冊目にチャレンジするのが良いかと思います。

2. 世の中のサイトのソースコードを真似してみる

本などで一通り学んでみたら世の中にある簡単そうなサイトのソースコードを真似して同じものを作ってみます。

私は前職がアパレル系の職種だったということもあり、好きなブランドのサイトで、かつ自分でも頑張れば構築できそうなサイトのHTML/CSSを真似して実装してみました。(JavaScriptをあまり使用していないサイト)最初は自分の考えだけで実装を行い、わからないところはそのサイトのソースコードを見て確認するという方法が効果的です。

3. 実際に自分でサイトを作り、世に出してみる

少しハードルが上がりますが、この活動は面接で有利になります。(理由は後述します)面接で見せるのが前提なので、手始めに自分のポートフォリオサイトを構築するのがオススメです。

私の場合は1.2の学習が終わった後は知人や友人にお願いして3つほど作成してみました。そのサイトを面接で見ていただき、採用につながった部分もあるかと思います。

転職で使った求人サイト

私は以下2つの求人サイトを利用し、未経験も募集している企業を中心に転職活動を行いました。

www.find-job.net

employment.en-japan.com

1.転職サイトの選び方

転職する際、どのサイトも同じようなものだと思い、特に利用するサイトは気にしないと思います。ただ企業側からするとそのサイトに掲載する理由があるかと思います。

その理由の一つだと思うのが、掲載費と採用報酬です。企業側からみて転職サイトに掲載する際の料金体系は掲載料型と採用報酬型の2つあります。掲載料型は月額制のイメージで、採用報酬型は1人採用したら〇〇万円といった仕組みです。

企業側からすると採用報酬型に比べ、掲載料型の方が採用のリスクは少なく、採用報酬型の場合、優秀な人でも、未経験の人でも同じ採用報酬を払わなければいけないのに対し、掲載料型は掲載している期間は採用し放題なので、未経験や実務経験なしの人でも受け入れやすいという傾向があります。

実際に採用担当の人から、「自社の応募サイトから応募してくれたら採用したい人はいる。」と聞いたことがあります。このことからも、未経験や実務経験なしの人は、掲載料型の転職サイトか面接を受けたい企業の自社サイトがある場合はその応募フォームから申し込む方が採用される確率は高くなるのではと思っています。

2.何社くらい受けたのか

コネやツテがない人は、数受けるのが一番確実な方法でしょう。私の場合は前職が平日休みだったこともあり、休日は1日2社面接を受けていました。

結果としては8社ほど面接を受けて、FindJobで1社、エンジャパンで2社、計3社内定をもらい、FindJobで受かった会社に転職しました。

面接で気をつけた・意識したポイント

1.面接官に見せられる実績をもっていく

制作会社の面接を受けると、「未経験可」にも関わらず応募の際に「ポートフォリオをのURLを掲載してください」、「実績をいくつか送ってください」と記載のある企業があります。そのためには、自分のポートフォリオサイトやブログなどの自分のコンテンツを持っている必要があります。

ただ、自分のコンテンツとは言っても、すごくクオリティが高かったり、面接担当者が目から鱗のようなものを求められているわけではありません。「未経験可」で実績や成果物を求められる時、その人のスキルレベルや知識レベルではなく、学習意欲やポテンシャルをみられることが多いです。Web業界は技術進歩や流行の流れが早く、学習意欲がない人はすぐに置いていかれてしまいます。もちろん企業側は学習意欲がない人・受け身な人は採用したくないでしょう。

そのため学習意欲やポテンシャルを感じてもらうためにも個人活動での実績や成果物があり、独学でも学習しているという姿勢をアピールしておく必要があります。(もちろん形だけではダメですが・・)

___

以上、私が独学・未経験でフロントエンドエンジニアに転職した方法を紹介しました。割と当たり前の内容ですが、約3ヶ月間の学習と上記の転職活動で無事キャリアチェンジをすることができました。内定も3社いただき、独学・未経験でもフロントエンドエンジニア、Web業界に転職できます。

もちろん未経験で転職をした分、転職後はかなりの学習と努力が必要になってきますが、そちらはまた別の機会にまとめてみたいと思います。