エンジニア転職に差がつく【ポートフォリオ作成術】未経験は必須です！

ポートフォリオって必要なのかな・・
エンジニア未経験だけど作れるかな・・
作成するには何から始めたらいいのかな・・

こういった疑問にお答えします。ぜひ最後までお読みいただき、『転職に差がつく、ポートフォリオ作り』にお役立てください。

1 ポートフォリオとは?
2 なぜポートフォリオがいるのか?
3 未経験エンジニアとポートフォリオについて
4 ポートフォリオを作成する前に必要なこと
5 プログラミングの勉強方法
6 ポートフォリオ作成のポイント
7 未経験エンジニアのためのポートフォリオ作成術まとめ
8 ポートフォリオを公開しておこう！

ポートフォリオとは?

ポートフォリオとは、エンジニアやデザイナーの就職、転職時に見せる自分で作った作品のことです。具体的にはエンジニアの場合、webアプリ、iOSアプリ..etcなります。最近、人気のあるWebエンジニア転職ではRuby on Railsを用いたWebアプリケーションを作成してポートフォリオを引き下げて転職活動をするのが一般的です。

プログラミング初心者にオススメな「Ruby on Rails」の学習方法などをわかりやすく解説します！

なぜポートフォリオがいるのか?

なぜポートフォリオがいるのかを一言で言えば、他の求職者と差別化を図るためです。

企業側は未経験エンジニアを採用するのはコストがかかるため、自分でプログラミングを勉強出来る人(Web界隈ではよく、自走力のある人と言います。)を求めています。そのため求職者は「自分でも勉強をしていてプログラミングに興味があることを示すためにも、ポートフォリオを作成したほうが有利だ」というのが共通認識となっており、ポートフォリオの必要性が高くなっています。

未経験エンジニアとポートフォリオについて

作成しなくても面接にはたどり着けますが、近年のプログラミングスクールの激増と未経験エンジニアの供給量が増えて市場バランスが崩れた影響でほとんどの求職者がポートフォリオを作成して転職活動に挑んでいるので、もはやポートフォリオは必須になってしまった印象があります。

プログラミングスクール比較10選！社会人や未経験者にもおすすめ！【転職・就職にも有利】

ポートフォリオを作成する前に必要なこと

プログラミングを学習するのは必須だとしてもそれ以外に、ポートフォリオを作成する前に必要なことが4つあります。

行きたい会社がどんな技術を使っているのかを調べてみよう

必要なことは就職したい会社がメインとしている技術を使用してポートフォリオを作成することです。そのため行きたい会社が使っている技術をWantedly等で調べてみる必要があります。

他の求職者との差別化を考えよう

他の求職者が作成しそうなアプリのクオリティ(Railsの場合はRailsチュートリアルで作成したもの)の場合は差別化にならないため、他の求職者を超えるためにAWSやDockerといったインフラをつかったり、Webアプリの場合はフロントエンドのライブラリ(ReactやVue)などを使用してみたりする必要があります。そのため、いろいろな技術を学習する必要です。

プログラミング初心者におすすめなフレームワーク「Vue.js」の基礎知識！

調べてもわからない場合は後述するMENTAやココナラといったサービスを活用してエンジニアに聞いてみたり、プログラミングスクールに入校することをおすすめします。

ポートフォリオをつくって転職を決める！

なぜエンジニアを志望するのかをもう一度考えよう

自社開発の会社の面接では、なぜそのポートフォリオをつくったのか?なぜその技術を選択したのか？と深堀りされる可能性があります。そのため、エンジニアになりたい理由とともにポートフォリオにおいても面接で話せるストーリーが必要になります。

なぜ必要かというと自社開発の企業は入社後に求職者が企業のカルチャーフィットできるかどうかをとても意識しているからです。例えば、医療系のITベンチャー企業を受ける場合は病院のレビューサイトをポートフォリオを作成して自分の医療の思いをエンジニアになりたい理由とともに話すことが必要です。

覚悟を決めたら走り出そう

エンジニア転職では30歳を目安にポテンシャル採用(未経験採用)をしてくれない企業が出てきます。
そのため１日でも若い今日から始めるのが必要です。

プログラミングの勉強方法

まずはオンラインサービスを活用する

全くプログラミングに触ったことがないまたはプログラミングに苦手意識があるという方はプログラミングに適正があるかどうかを見るためにProgateやドットインストール、paiza ラーニングといったブラウザ上でプログラミングを学べるWebサービスを活用するのがおすすめです。

プログラミングスクールやUdemyで学習を進める

Progateが終わった段階でプログラミングスクールに行くのが最短で面接に進めるステップでとは思いますが、資金や時間の兼ね合いでプログラミングスクールで難しい方はUdemyなどの動画サービスを活用してプログラミングを学習するのが良いと思います。

Udemyは頻繁にセールをやっているのでセールのときを狙って講座を買いましょう !

［PR］：今なら新規受講生割引中です｜Udemyの登録は世界最大級のオンライン学習サイトUdemyから！

オリジナルのアプリケーションを作成する

ほとんどのプログラミングスクールでは、卒業前に自分のオリジナルアプリケーションを作ります。それをポートフォリオとして面接に挑むことが最短ですが、資金や時間の兼ね合いでプログラミングスクールで難しい方は自分で時間を作ってアプリケーション開発を進めることになります。

自力でアプリケーション開発では初学者には難易度が高いので、エラーに詰まったときや就活で悩むことがあると思います。そういう方でも最近ではオンラインでプログラミングの相談出来るMENTAというサービスやココナラなどいろいろなサービスがあるので、それらを活用してみると良いと思います。

ポートフォリオをつくって転職を決める！

ポートフォリオ作成のポイント

インデントなどのコーディングスタイルについて

面接では面接官の方にコードを見せると思いますが、エンジニアの面接官の場合、インデントや句点のあとにスペースがないなどのコーディングスタイルが整っていないと、汚いコードを書く人だと悪印象を与えてしまいます。そのため使用するコーディングスタイルについて調べて、読みやすいコードを書くように心がけましょう。

エラーを詰まったところをQiitaなどで情報発信をする

Web系の企業の場合はQiitaを書いている求職者には好印象があります。なぜなら、ほとんどの求職者は勉強ばかりでアウトプットがポートフォリオくらいしかないというのが現状だからです。それゆえにエラーなどでつまったことろなどを解決して、なぜエラーになったのか、解決方法をアウトプットすると良いと思います。

Twitterで他の求職者とつながろう

Twitterで「#駆け出しエンジニア」や「#駆け出しエンジニアとつながりたい」で検索するとWeb系の企業にエンジニアに転職を目指している方がたくさんみつかるので、つながって情報交換をしたり励まし合うとプログラミングに挫折しずらいと思います。

プログラミング学習始めました！
現在はProgateでHTML,CSSを進めています
それと並行して下の本を進めていこうと思っています#駆け出しエンジニアと繋がりたい #プログラミング初心者 #progate pic.twitter.com/qQ8KPpK3vN

— Lux@プログラミング (@kiprogik) March 23, 2020

今日は本を2冊ほど読破する予定。

フロントエンド系のHTML/CSSを実践的に学習したいなと思っていますが、3/27付近にMacBookAirが届くのでそれまでは考え方の勉強などをしようかなと思っています☺️#今日の積み上げ #初心者エンジニア #駆け出しエンジニアと繋がりたい pic.twitter.com/ITAznWX5Tx

— sy@駆け出しエンジニア (@sy66451070) March 15, 2020

3/22（日）500日チャレンジ 32日目

学習時間:5時間

総学習時間：40時間30分

内容：HTML上級コース完了
　　　HTML上級道場完了
　　　HTMLflex box完了
　　　スクール（HTML）2h

初めてProgateで多い日が付きました。#今日の積み上げ #プログラミング初心者 #駆け出しエンジニアと繋がりたい pic.twitter.com/FfpFJoIr1G

— キョン@プログラミング学習中 (@Departure_Kyon) March 22, 2020

CSS

①width: 100%;
②width: 100vw;
の違い

①は親要素の中で横幅いっぱいになる
②はウィンドウの横幅いっぱいになる

なので所構わず画面の横幅いっぱいにしたいときは
width: 100vw;
を使う#駆け出しエンジニアと繋がりたい #プログラミング初心者 #プログラミング学習

— しゅう@自作ブログ×エンジニア (@shu_bottom) March 22, 2020

note書きました！
コーポレートサイトでよくあるハンバーガーメニューのJS（jQuery）を、
コンストラクタ(クラス)・インスタンス・オブジェクトなどを使って実装してみました😉

ポイントは、

「複雑な処理をフラグ管理する」

です！！#駆け出しエンジニアと繋がりたい https://t.co/xzToVLwLPg

— いちくん@25歳独学未経験でWebエンジニアになれたひと (@ichikun0000) March 22, 2020

READMEなどに作成するアプリケーションの概要をまとめよう

ポートフォリオはGitHubなどでコードを公開して、面接に応募するときにURLを添付することになります。せっかく作成したポートフォリオですが採用面接を行ってくれる人事やエンジニアの方は仕事が忙しく、じっくりポートフォリオをみてくれない可能性があるという現状もあります。そんなとき、面接官はほぼ必ずリポジトリの『README』をざっくり読む可能性があります。

『README』とはアプリケーションの概要とアプリケーションの動かし方を記述するためのファイルです。『README』が書かれていないポートフォリオはコードすら見てもらえない可能性が高いのでアプリケーションをつくって満足せずに『README』にしっかりアプリケーションの概要をキチンと書くことをおすすめします。