【DICスタジオVol.8】『現場のエンジニアを唸らせる』ポートフォリオの作り方

今回のDICスタジオは、『現場のエンジニアを唸らせる』ポートフォリオの作り方について、プログラミングスクールディープロ代表の野呂がお話します。
エンジニアとして就職するには、企業を知り、自分自身を知ることが大切です。自分自身のスキルを証明するには、ポートフォリオを見せるのが最も有効な方法です。これまで多くの方の転職サポートを行なってきた野呂が、『現場のエンジニアを唸らせる』ポートフォリオの作り方について解説します。

今回のDICスタジオは、『現場のエンジニアを唸らせる』ポートフォリオの作り方について、プログラミングスクールディープロ代表の野呂がお話します。
エンジニアとして就職するには、企業を知り、自分自身を知ることが大切です。自分自身のスキルを証明するには、ポートフォリオを見せるのが最も有効な方法です。これまで多くの方の転職サポートを行なってきた野呂が、『現場のエンジニアを唸らせる』ポートフォリオの作り方について解説します。

【こんな方におすすめ】
・全くの未経験からのエンジニアを目指している方
・プログラミングスクールを検討している方
・ポートフォリオの作り方を検討している方

【目次】
1. 相手を知り己を知れば百戦危うからず
　1 - 1 相手を知るには「求人票」「インタビュー記事」
　1 - 2 自分を知るには「履歴書」「職務経歴書」「ポートフォリオ」「適性検査」
　　1 - 2 - 1 履歴書
　　1 - 2 - 2 職務経歴書
　　1 - 2 - 3 ポートフォリオ
　　1 - 2 - 4 適性検査
2. ポートフォリオの3つのポイント
　2 - 1 企画設計をしよう
　2 - 2 開発をしよう
　2 - 3 品質や運用を意識しよう
3. まとめ

■話し手
ディープロ 代表 野呂 浩良
■聞き手
StartGate 永田 拓也

相手を知り己を知れば百戦危うからず

今回のテーマは『現場のエンジニアを唸らせる』ポートフォリオの作り方ですね。

唸らせるのがポイントなんですよ！

まずは就職活動の際にポートフォリオ以外も必要になると思うんですが、どんなものがありますか？

そうですね、まずはそこからお話していきましょうか。「相手を知り己を知れば百戦危うからず」という言葉を聞いたことありませんか？

聞いたことあります。

これは孫子の兵法から来ている言葉なんですね。この言葉は、エンジニアの就職活動にも役立ちます。

相手を知るには「求人票」「インタビュー記事」

そうなんですね。その心得から就活が始まっていくんですね。まずは相手を知ることからですか？

そうですね。相手を知るには、大きく2つあります。
1つ目は求人票をよく見ることです。求人票を見て、どんなエンジニアが求められているのか、年収や勤務地を知りましょう。求人票はどのサイトでもフォーマットが決まっていて、だいたいしっかり書かれています。Wantedlyさんは、コンセプトであえて給与に関して書かれていませんが、Greenさんやリクナビさんなど他のサイトでは条件が詳細に載っています。エンジニアだとGreenさんが条件をしっかり書いているので良いかなと思います。
2つ目はインタビュー記事です。すでに働いている先輩社員のインタビュー記事を掲載していることがよくありますので、そちらも見て欲しいです。

確かにインタビュー記事見かけますね。

その企業でエンジニアがどんな仕事を行なっているかがわかります。

自分を知るには「履歴書」「職務経歴書」「ポートフォリオ」「適性検査」

仕事内容を理解するにも使えるんですね。
続いて、「己を知る」とはどういうことですか？

「己を知る」ために4つのポイントがあります。
1. 履歴書
2. 職務経歴書
3. ポートフォリオ
4. 適性検査

なるほど。

その1：履歴書

永田さんは履歴書を書いたことがありますか？

ありますあります。アルバイトや就職活動の時に書いたりしましたね。

実は履歴書はフォーマットに沿って書くだけで良いんですね。その際は、できるだけフォーマットや罫線を揃えましょう。人の性格が出ますからね。エンジニアの仕事は間違いなく行なうことが大切です。気を抜かずにフォーマットに沿って、間違いなく書きましょう。

履歴書は紙に書いたら良いですか？

エンジニアが紙に書いてどうするんですか（笑）「紙の方が個性があって良い」と言うかもしれませんが、紙でなくPDFで提出しましょう。

確かにそうですね（笑）

その2：職務経歴書

2つ目の職務経歴書で差別化されます。その方のアピールができます。職務経歴書はポートフォリオの次に大事なものです。職務経歴書の概要だけ話すと過去・現在・未来の自分の整理をすることです。事実を書いていき、そこに意見を付け加えていく。「こういう実績を出せたのはこういうことをしたからです」という具合です。あとは、その実績を周りからどう評価を受けたのかも大事です。

大事ですね。職務経歴書は、「『採用担当者の心をグッとつかむ！』職務経歴書の作り方」で詳しく解説しているので、こちらもあわせて見ていただきたいですね。

その3：ポートフォリオ

※ディープロの卒業生の宮崎 雄介さんのポートフォリオJobmiru

3つ目のポートフォリオとは、自分のスキルの証明をするものです。

スキルの証明！？

企業はこういうものを作って欲しいと思って採用するわけじゃないですか。過去にどれだけのものを作った人なのか見たいわけです。その際に実力を証明するのがポートフォリオです。

超大事じゃないですか。

エンジニアとして働いている方は基本的に業務で書いているコードをポートフォリオとして公開することができません。なぜなら、守秘義務があるからなんです。だから業務とは別でポートフォリオを作成する必要があります。未経験の方でポートフォリオがあると、すごく良いです。

そうなんですね。

今回のメインテーマになるので、後ほど詳しく解説します。

お願いします。

その4：適性検査

4つ目の適性検査は、得意不得意を自分で認識しておく必要があります。

いくら気合いがあって、「僕頑張ります！」という場合でも、そもそもの素質がありますもんね。

人は、もともと色々なものを持っているんです。みんな違って良いんです。ストレングスファインダーという適性検査がありますが、自分を知るのにおすすめです。

そういう形で自分を知ることができるんですね。

ポートフォリオの3つのポイント

ポートフォリオの詳細をお話していきます。たくさんありますからね！

おっ、メモしなきゃ（笑）

ポートフォリオの3つポイントについてお話しします。
1. 企画設計をしよう
2. 開発をしよう
3. 品質や運用を意識しよう

その1：企画設計をしよう

まず企画設計って何ですか！？わからないです（汗）

企業は、「何を作ったのか」「どうやって作ったのか」気になるじゃないですか。そのポートフォリオがユーザにとってどんな良いことがあるのか。それらをしっかりアピールするためには説明しないといけません。ベンチャーやスタートアップに就職したい場合は、新しいものを生み出すのが主な仕事ですから、新しい価値を生み出すことは大きな加点になります。

なるほど。

企画設計は3つの要素があります。
1. カタログ設計
2. 仕様書
3. プラスα
1つ目のカタログ設計は、どういう製品なのか概要を整理し、ユーザのメリットをすべて記したカタログです。
2つ目の仕様書は、「機能一覧」「テーブル設計」「ER図」「サイトストラクチャ」のことです。

・・・わからないことがいっぱいあります（苦笑）

「機能一覧」「テーブル設計」に関してはフォーマットがあります。「ER図」「サイトストラクチャ」は無償で作れるツールがあります。エクセルで作るより、専用のツールを使った方が楽です。私はサイトストラクチャを作成するProttというツールが好きで、紙芝居感覚でめちゃくちゃ便利です。
3つ目はプラスαです。例えば、作ったものがちゃんと見れるようにしておくということですね。GitHub上で公開リポジトリにし、ソースコードを見えるようにしておく。READMEと呼ばれる、「はじめにお読みください」みたいなのがあるんです。そのREADMEにそのポートフォリオをインターネット上で動かせるURLを添付したり、ログイン用のユーザIDやパスワードを用意しておきます。

ユーザIDやパスワードの用意ですか？

企業は、確認のために新しくアカウントを作るのが面倒くさいんでやりたくないんですよ。だから、こちらで確認用のユーザIDとパスワードを用意してあげます。そういう配慮が大事です。あとプラスαでREADMEに記載することとして、「導入手順」「開発言語のバージョン」など別のエンジニアがクローンして開発する時に必要な情報を載せておくことですね。

なるほど、そこまで書いておくと良いんですね。

その2：開発をしよう

ポートフォリオの2つ目のポイントの「開発しよう」について解説します。開発時に意識する7つのポイントがあります。

7つもあるんですか！？

行きますよ！
1. コードの可読性
2. デザインパターンに沿った実装
3. セキュリティを考慮した実装
4. ライブラリの活用
5. WebAPIの活用
6. ワイヤーフレームに沿って書こう
7. 開発の履歴を整理しプロセスを辿る

これはどういうことですか？

1つ目のコードの可読性は、スタイルガイドを遵守してください。スタイルガイドは、RubyやPython、HTMLなどそれぞれにあります。

2つ目のデザインパターンに沿った実装は、Ruby on Railsで例えると、ファットコントローラにならないようにしましょう。コントローラに何でも書かない。オブジェクト指向をわかっていればそんなことはしません。でないとぐじゃぐじゃになっちゃいます。

スマートじゃないんですね。

3つ目のセキュリティを考慮した実装は、例えばインスタンスメソッドの活用です。自分じゃないユーザがログインできないようにするとか、httpリクエストがあった時にパラメータをセキュリティ上問題なく受け取れるようにしておくことなどですね。

4つ目のライブラリの活用は、すでに便利なプログラムの部品がインターネットに転がっているので、それを活用して車輪の再発明をしないようにすることです。基本的な機能を実装する技術力は必須なので、ログイン機能などはライブラリを使わず、自分の力で実装すると企業に良い印象を与えられると思います。企業は、セッション管理が意識できてるかどうかって結構気にされています。

5つ目のWebAPIの活用は、Googleマップや最近だとコインチェックなどがありますね。WebAPIは他のサービスと連携して活用することです。

6つ目のワイヤーフレームに沿うとは、自分でフッターヘッダーなどフロントのデザインを構想して、フロント部分のコードを書くことです。その際にフレームワークのBootstrapなどを使わずに、生のHTML/CSS で書いた方が印象が良いと思います。

7つ目の開発の履歴を整理しプロセスを辿るのは、GitHubで開発履歴を見られるのでブランチを切ったり、コミットメッセージをちゃんと書くことですね。

かなりボリュームがありますね。

その3：品質や運用を意識しよう

3つ目の品質や運用は、単体テストを行なって欲しいですね。MVC構造で言ったらモデルの部分だけでいいので、ちゃんと動くか保証するためのテストコードを書くことです。

品質は大事ですもんね。

これらが全部できたら、 「こいつすごいな！」と現場のエンジニアは唸りますよ！

まとめ

そういうことなんですね。今日はポートフォリオの作り方についてギュッとお話していただきました。最後はまとめをお願いします。

就活に必要なのは、「相手を知り己を知れば百戦危うからず」です。相手を知るには、事前に「求人情報」「インタビュー記事」を見ましょう。自分自身を知るには、以下の4つが大切でしたね。
1. 履歴書
2. 職務経歴書
3. ポートフォリオ
4. 適性検査

今回のメインテーマはポートフォリオですね。『現場のエンジニアを唸らせる』ポートフォリオの作り方は、以下の3つのポイントです。
1. 企画設計をしよう
2. 開発をしよう
3. 品質や運用を意識しよう

開発時に意識する7つのポイントは以下の通りです。
1. コードの可読性
2. デザインパターンに沿った実装
3. セキュリティを考慮した実装
4. ライブラリの活用
5. WebAPIの活用
6. ワイヤーフレームに沿って書こう
7. 開発の履歴を整理しプロセスを辿る

これだけのことができたら現場のエンジニアを唸らせることができますね。本日はありがとうございました。