
専門卒の3年目フロントエンドエンジニアである私がはじめて転職活動をしたので、その記録をここに残しておきます。  
あくまでも備忘録程度の詳細度ですが、私と近い属性の人に役立てば幸いです。

## 転職活動時の私のスペック

### 年齢

24歳

### 最終学歴

電子系専門学校のWebデザイン科卒

### 住居

東京都23区内（一人暮らし）

### 職業

Web A11yで有名な老舗Web制作会社のフロントエンドエンジニア

### プログラミングスキル

なにをもってプログラミングスキルというのかはさておき、完全Webフロントエンド専業マンだったので、無知の知を得ているくらいにはWebフロントエンドに関するスキルを有していました。

ざっくりいうとHTMLやCSSなどはもちろんのこと、TSやVue.jsといった、いわゆるモダン開発に使うような技術はひととおり扱えて、仮に知らないものであっても基礎知識があるため、すぐに吸収できるような状態でした。  
また、Web A11yで有名な会社に所属していたということもあって、基礎的なWeb A11y知識も持ち合わせていました。

Webフロントエンド以外のスキルでいうと、個人開発で触ったことがあるレベルのバックエンド（Node.js）とネイティブアプリ（iOS）のスキルを有していました。

## 転職の動機

転職の動機は以下の2点です。

1. 継続的に1つ乃至複数のサービスを成長させていきたかった
2. 単純にお給料をあげたかった

とくに、1点目の動機が強かったです。

前職場では、有難いことに新卒の時から多くのプロジェクトに携わらせていただき、さまざまな経験をさせてもらいました。ですが、その一方で受託制作という形態ゆえに継続的に1つのサービスを成長させていく経験がなかなか出来ず、歯痒さを感じていました。  
そんな思いを抱えながら社会人3年目に差し掛かかったところで、2点目の転職動機やその他の細々としたことが引き金となり、「自分にはもっと合う場所があるはずだ！！」と考えるようになりました。そうです、私はいわゆる3年目病に蝕まれていったのです（？）。

その結果として3年弱（実務年数でいうと2年10カ月強）で前職場を退職して転職活動をするに至りました。

## 転職活動について

### 転職活動準備

私は落ち着いた状態で転職活動をしたいと考えていたため、職についている時には転職活動準備をほとんどしていませんでした。そのため、退職後から約3カ月の間で以下の転職活動準備を行いました。

- 転職サイトへ登録
- これまで業務でやってきたことの棚卸し
- 自己分析
- ポートフォリオサイトの作成
- 自分のスキルを明示化するためにプロダクトをいくつか作成
- 職務経歴書の作成
- 履歴書の作成

#### 転職サイトへ登録

これは転職活動民が最初期にやることですよね。  
自分で言うのもなんですが私はかなりの面倒くさがりのため、以下の5つのダイレクトリクルーティング型の転職サイトのみ登録して、受け身の体制をとっていました。

- Green
- Findy
- doda
- Wantedly
- 転職ドラフト

登録したとは書きましたが、実際に機能したのはWantedlyと転職ドラフトくらいで、他のサービスについては正直そこまで使っていませんでした（転職ドラフトについては[別記事](https://sitagakey.me/blog/post/2021/07/20210720_1)で、そのサービスの良さを記しているのでぜひご覧ください）。

ちなみに、エージェントサービス[^1]については、なぜかあまり良い印象がなく、今回の転職活動では一切使っていません。ただし、自分の観測範囲上だとエージェントサービス経由で転職されている方が多いので、とくに拘りがなければエージェントサービスを使ってみるのもいいかもしれません。

[^1]: 転職時に必要な諸々の作業などを仲介人が対応してくれるサービスを指しています

#### これまで業務でやってきたことの棚卸し

その名の通りなのですが、これまで自分が業務で何をやってきたのかを通年および案件単位でまとめました。  
これをしたことで、自分が業務でなにをやってきたのかということが可視化され、面談や面接の際に自分がなにをやってきたのか相手に伝えやすくなりました。

この作業は、退職前の1カ月ほど前からやっていたのですが、自分の携わった案件概要を3年分抽出するのは苦行以外のなにものでもなかったので、転職を考えている人は早めに行動しておいたほうが良いと思います（人間って意外と1カ月前のことですら覚えていないものです）。

#### 自己分析

私は専門学校卒で、技術採用をしてもらった身であり、一般的な就職活動をしたことがありませんでした。  
そのため、本格的な自己分析をするのははじめてだったので、とにかく念入りに分析をしました。

たとえば、自分の幼年期から今までの年表を作成して、そこから自分の持つ強みや弱みなどをさぐったり、自分の頭の中に漠然とあった短、中、長期それぞれの目標や夢を明確化しました。

結果的に、自分の考えの言語化であったり転職活動の軸の形成ができました。

#### ポートフォリオサイトの作成

”エンジニアの転職＝ポートフォリオサイトを作成する”のイメージがあったので、2週間ほどかけてとりあえず作りました。

ただ、ポートフォリオサイト内には前職場の案件実績なども含めており、サイトを作り終えた後に「なんだか前職場を裏切っているような感じがするなあ」と感じて、結局一度も使うことなくお蔵入りとなりました。

#### 自分のスキルを明示化するためにプロダクトをいくつか作成

ポートフォリサイトをお蔵入りさせたと先述しましたが、やはり自分の実力を知ってもらうためには、なにかしら形のあるものを見せられなくてはいけません。  
ということで、自分の抱えている問題などをベースに複数のプロダクトを作成して、[GitHub](https://github.com/sitagakey)上にコードをアップロードをしました。

関連記事：

- [無職になったから自分の課題を管理するためのアプリを作ったンゴ日記アプリ](https://sitagakey.me/blog/post/2021/02/20210218)
- [アイデア出しに役立つアプリを作ったからみんな使え！！](https://sitagakey.me/post/2021/04/20210417)

#### 職務経歴書の作成

職務経歴書はmd形式で管理して、必要に応じてVS Codeを使い、そのファイルをpdf形式にして出力していました（pdf形式にした時の枚数が3枚に収まるように工夫しました）。  
ちなみに職務経歴書のアウトラインは悩んだ末、以下に落ち着きました。

- 職務経歴書
  - 基本情報
    - 氏名
    - GitHub
    - フロントエンドスキル
  - 職務経歴
    - 会社名と所属期間
      - 職務概要
        - 会社でやってきた職務の概要を記載
      - 実績
        - 直近3件の案件を抜粋して、その案件の概要であったり、どのような機能を開発してきたのかを記載（もちろん案件名などの守秘義務系はボカす）
  - 自己PR
    - 自分の強みであったり、次の会社で役に立つであろうポイントを2つ記載

#### 履歴書の作成

今回選考を受けさせていただいたすべての会社が紙の履歴書不要とのことだったので、履歴書は[JISZ8303](https://www.jisc.go.jp/app/jis/general/GnrJISNumberNameSearchList?toGnrJISStandardDetailList)（一般的な履歴書に使われているJIS規格）に沿ってHTMLで作りました。  
なぜ、HTMLで作ったのかと言うと、志望動機などの項目欄の高さや位置などを柔軟に変更できるからです。あとは、私が求めるフォーマットの履歴書がネット上に落ちていなかったからです。

ちなみに、履歴書を自作する際の豆知識ですが、JISZ8303には名前欄や志望動機欄といった市販の履歴書で頻出するような項目を載せなくてはいけないという規定はありません。すなわち、履歴書に載せる項目は作る人の自由であるというわけです。

極端な話、名前欄がなくてもJISZ8303に準拠していると言えるわけですが、そんなことをすると履歴書と呼べなくなってしまうので、ある程度は市販の履歴書に書かれた項目を踏襲するとよいでしょう。

### 転職活動本番

先述した準備を終えた後、そこから2カ月強の間、カジュアル面談を含む転職活動の本番に挑みました。  
今回の転職活動でカジュアル面談を受けさせていただいた会社は6社で、そこから選考に進ませていただいた会社は3社でした。

ちなみに選考を受けさせていただいた会社の結果は、1社1次選考落ち、1社最終選考辞退、1社合格です。

#### カジュアル面談について

今回の転職活動を通じて、はじめてカジュアル面談を経験したのですが、転職活動をする際は必ずこの面談を受けるべきだと感じました。また、その際は自分と同じ職種の方であったり、今後その会社に入社したらコミュニケーションを取るであろう方達に同席してもらうことが肝要であるとも感じました。その理由は簡単で、「選考を受ける前に、今後自分が働くであろう環境の雰囲気や、スキルレベルなどを知ることができるから」です。

選考を受ける前に会社の雰囲気やスキルレベルなどを知ることで、自分とミスマッチな会社に対して履歴書を書いたり、余計な選考期間を過ごす回数が減ります。それから、一緒に働くであろう方達と話をすることで、その職場での将来像がより詳細に見えきて、志望動機などがパッと思い浮かびやすくなります。

#### 面接について

いずれの会社も1次面接は割と雑談ベースだったので、最初の自己紹介こそ声が震える場面はありましたが、比較的落ち着いて受け答えができていた気がします。  
質問は技術的なものが多く、普段から目的などを意識してコード書いていた自分としては、そこまで詰まるような質問はありませんでした。  
評価軸としては、技術面が大半を占めている印象で、次点で人柄などが評価されていたのではと考えています。

最終面接についてですが、1社のみしか受けていないのでこれが普遍的なものかは不明なものの、「会社に入社してなにをしたいのか」を中心に問われたと記憶しています（緊張のせいで途中の記憶が飛んでいます）。  
「なにをしたいのか」というのは自己分析の中で見出したつもりだったのですが、最終面接を通して、依然として抽象度が高いことに気付かされました。ここらへんに関しては自分1人だと気がつきにくいので、面接前などに友達や家族といった第三者に確認してもらうが吉です。  
この最終面接での評価軸は、「その会社の目的を共に達成していく気持ちがあるのか」という意識的な部分だったのではと考えています。

ちなみに、1次選考を含めてすべての選考結果は早くて次の日、遅くとも4日後にはいただけました。

## 初転職活動を終えてみての感想

「**転職活動って思っていたよりも、めっちゃ時間がかかる！**」というのが素直な感想です。

正直、長くて2カ月くらいで終わるものだと思っていたのですが、大幅に予定がずれ込み5カ月強もかかってしまいました。  
ある意味で就活がはじめてだったということもあり、準備期間などの見積もりがガバガバだったというのが原因ですね（ガハハ）。

ちなみに、このガバガバ見積もりのせいで、もともと120万ほどあった貯金が、各社の選考を受けていた時期には家賃や生活費に削られ底をつく寸前でした。そういったこともあり、各社からの選考結果を待っている時は、明日への不安から鬱状態になっていました。

今だからこそ笑えますが、当時は身動きができないほどに精神がやられていました…。  
皆さんが転職活動をする際は、「転職活動は時間がかかるものだ」ということを理解した上で、活動していただければと思います。そうすれば、私のような悲惨な目に合わなくて済むでしょう彡(^)(^)

## おわりに

有難いことに最終面接を受けた会社とご縁があり、8月1日より正式にフロントエンドエンジニアとして働かせていただくことになりました。

人、サービス、会社の方針、どれをとっても素晴らしいとしか言いようがない会社だと思っており、その会社で働けることを今からとてもワクワクしています。  
実際に働いてみてからじゃないとわからないことも多々あると思いますが、全力で次の会社に尽くして行くつもりです！


専門卒の3年目フロントエンドエンジニアが初転職するまでの話


[こちらの記事は転職ドラフト体験談投稿キャンペーンに参加しています](https://job-draft.jp/articles/251)

題名の通り、フロントエンドエンジニアである私が、転職ドラフトというダイレクトリクルーティング型の転職支援サービス経由で転職をしたため、この記事ではその感想をつらつらと書いていきます。先に結論を述べておくと大変満足しています。

転職活動自体については、「[専門卒の 3 年目フロントエンドエンジニアが初転職するまでの話](https://sitagakey.me/blog/post/2021/07/20210720_2)」という記事に詳細を書いていますので、興味がある方はそちらも合わせてご覧ください。

## 転職ドラフトに登録したきっかけ

私よりも早くに転職をされた前職場の先輩に転職について相談をした時、「転職ドラフトっていうおもしろいサービスがあるから試しに登録してみれば」と紹介をしていただいたのが登録のきっかけです。

ちなみに、サイトをはじめてみた時の印象は「なんだか怪しげなサイトだなあ」です。笑

## サービス登録後

サービスの登録自体は、先輩から紹介があった日にすぐしたのですが、レジュメ（職務経歴書）の登録が面倒だったため、そこから数ヶ月放置していました。  
ですが、転職活動を本格的に始動したタイミングで重い腰をあげて、レジュメの登録をするに至ります。

レジュメ登録後は、転職ドラフト運営の方からレジュメの審査があるわけですが、返却されることなく一発通過することができました。  
ただ、「レジュメに〇〇を書くと詳細度があがってより良くなるよ」といったご指摘[^1]をいただいたので、そのご指摘を元にレジュメを少し修正して、2021年5月度のドラフトに参加をしました。

[^1]: レジュメ添削は無料な上に、とても的確なので本当に有り難かったです

## 転職ドラフトでの指名状況

ドラフト初参加でしたが、有難いことに5社の指名をいただくことができました。  
希望年収を未設定の状態にして参加したのものの、いずれの指名額も私が心の中で希望していた額よりも大幅に上回っていたので驚きました。また、自分の市場価値が結構高いことを知れて素直に嬉しかったです。

ちなみに最終日まで私の指名は0だったので、「こりゃだめだ」と期待はまったくしていなかったのですが、最終日の夕方頃から一斉に指名メールが届きはじめました。  
ですので、指名が無くて落ち込んでいる人は最終日の締め切り時間まで希望を捨てないでおくと良いと思います。

私の観測範囲上では、バックエンドやインフラ系のスキルをもっている方々が早めの段階から多くの指名をもらっていたので、指名数や市場価値を高めたいと思うのであれば、そこらへんの実績を作っておくのが一番でしょう。

## 面談と面接について

指名を頂いた5社の内、3社の面談を受け、そこから2社に絞って面接を受けました。  
いろんな方の体験談にも書かれていますが、指名をもらったからといって確実に内定が出るわけではありません。

とくに、指名文が数行程度の会社はあまりこちらのレジュメや実績を把握していないので、面談と面接を受ける際は注意が必要だなと感じました。つまるところ、そういった会社に指名をもらったとしても双方ミスマッチである確率が高く、面接で普通に落ちる可能性があります。

逆に指名文がしっかりと書かれていたり、レジュメ以外の実績にコメントをくれる会社については、先に述べたような問題はなく、建設的な面談や面接ができたように感じました（内定をいただいた会社はこちら側に属していました）。

兎角、面接を経て自分と会社がミスマッチであれば落ちますし、そうでなければ受かるということです。ただ、指名をもらっているということは、ある程度の技術的適性があるとも考えられますので、その点は自信をもって挑んでいただければいいと思います！

## 内定後の提示年収額

最終的に第一志望であった1社から内定をいただくことができ、その会社からは転職ドラフト上で提示していただいた額より気持ち上の年収を提示いただくことができました！  
最悪、転職ドラフト上で提示いただいた額の90%内であれば問題ないと考えていたので、それを超える額を提示頂いた時の高揚感は忘れられません。

ちなみに、その会社の内定を承諾して8月から一緒に働かせてもらう予定です！

## 転職ドラフトを使ったことがない方へのメッセージ

転職を考えているエンジニアの方であればとてもオススメできるサービスです！

このサービスは現在進行形でユーザーが増えているということもあり、今後は人が溢れて参加者のレジュメが埋もれていってしまう可能性があります。  
先駆者のみが甘い蜜を吸えるというのが世の定めです。やって損はないと思いますので、少しでも興味がある方は早めにサービス登録を済ませてドラフトへ参加すると良いかもしれません！


フロントエンドエンジニアが転職ドラフト経由で転職をしたので感想をつらつらと書く


「[THE 拡散思考](https://the-divergent-thinking.netlify.app/)」という拡散的思考を活用したアイデア出しアプリを作ったのでアプリの概要ざっと書き残しておきます。

## アプリの目的

アイデア出し時の視野を広げることを目的としています。

## 機能

拡散的思考特化のアプリにしたかったため「ユーザーの入力したワードを元に、関連するワードを大量に表示する」という1機能のみ実装しています。今後も大きな機能追加は予定していません。

## 内部仕様

特記することはあまりないので、このアプリの根幹機能である関連ワード取得についてのみ書きます。  
この機能には「Google Suggest API」を使用しているのですが、APIの仕様が公開されていないようなので結構手探りで使うことになりました。

ちなみにJavaScriptでこのAPIを使う場合はパラメーターに`client=chrome`もしくは`client=firefox`を追加して、レスポンスを`text/javascript`形式で受け取ってjsonpで読み込む必要があります。このAPIについて調べると検索上位の記事に「現在はXMLしか取得できない」などと書かれているわけですが、JavaScriptの場合はどうあがいてもCORSエラーを抜けることができなないため逆にXMLの取得はできないと思います。

以下のコードは実際にAPI取得のときに使っているものです。ご参考までにどうぞ（jsonpの読み込みには[fetch-jsonp](https://www.npmjs.com/package/fetch-jsonp)というライブラリを使用しています）。

```ts
async getSuggestWord(query: string): Promise<string[]> {
    return await fetchJsonp(`https://www.google.com/complete/search?hl=ja&client=chrome&q=${query}`).then((res) => res.json()).then((res) => {
        const query = res[0];
        const words = res[1];
        const replacedWords = words.map((word: string) => word.replace(`${query} `, ''));

        return replacedWords;
    }).catch((err) => {
        return [`__error__: ${err}`];
    });
},
```

## おわりに

自分で作っておいて言うのものなんですが、なかなか有用なものを作った気がします彡(^)(^)  
使っていてすでに直したい部分がいくつかあったので、今後もちまちま更新していこうと思います。おわり。


アイデア出しに役立つアプリを作ったからみんな使え！！

先日「[カダイの付箋](https://kadai-no-fusen.site/)」という課題管理Webアプリケーションを制作したので、制作の経緯など記しておきます。

## 制作した経緯

端的にいってしまえば、無職になったので自己管理を徹底せねばと思ったからです。

無職になると24時間すべてを自由に使えるわけですが、ざっくりな予定しか立てずに行動をしていると、大した成果もなく日々があっという間に過ぎてしまいます。  
また、そうしているうちに「あの時ああしていれば」、「この時間にあの作業やってたら」のようなタラレバが嵩んでいき、過去を後悔するようになります。

そういった後悔を回避するには、今ある課題から目を背けずに整理し、明示して、解決する必要があります。  
この課題の「整理・明示・解決」の方法は人それぞれやり方があると思うのですが、私はこの無職の期間中は基本家におり、その間のほとんどはPCを触っているだろうと予想しているので、一番無理なく続けることができそうなWebアプリケーションを使う（作る）という方法を選択しました。

## 制作の流れ

制作は、「機能要件の定義」、「WF（情報設計）作成」、「実装」の3工程で行いました。  
機能用件の定義の段階では、自分が欲しいと思った機能をMDファイルに書き殴っていきました。  
また、実業務の課題管理をする際に使用していた、「Backlog」および「Win 10に付属している付箋ソフト」などが有する機能をまとめたりもしました。

そして、それら基にWFを起こしていきました。

<tl-img
    src="/images/blog/post/2021/02/20210218_2.jpg"
    alt="カダイの付箋のWF">
</tl-img>

WFなんて久しく書いていなかったので、なかなか骨が折れました…。  
WFができてからはゴリゴリ実装作業を開始したのですが、もともと1週間程度で終わらせようと思っていたのに、なんだかんだ2週間くらいかかってしまいました（それもこれも作業環境がﾜﾙｲｾｲﾀﾞ）。

少し内部的のことも書いておくと、このアプリケーションのデータ保持には「[IndexedDB API](https://developer.mozilla.org/ja/docs/Web/API/IndexedDB_API)」というをモノを使用しています。  
もともとFirebaseを使って認証機能およびデータの保持をしようと思っていたのですが、それ（というか認証機能）をつけてしまうとこのアプリケーションの手軽さが消えて、おそらく継続して使わなくなるだろうと考え、現在の実装になりました。

同じようなAPIに「[Web Storage API](https://developer.mozilla.org/ja/docs/Web/API/Web_Storage_API)」などがありますが、なぜそれらを使わなかったのかというと、IndexedDB APIのバージョンアップ機能や非同期で処理が実行できる点に魅せられたからです。

## おわりに

すでに自分で使っていて気になる箇所がいくつかあったので、今後もアップデートを重ねてより良いサービスにしていきたいと思います彡(^)(^)

ちなみにデザインについてはある程度WFで想像を膨らまして、実装でそれを落とし込めればいいかなと思い端折りましたが、結局そのせいで実装の微調整を繰り返して余計な時間を食ってしまいました。やはりデザインはしっかり作ってから実装作業をしなくちゃなあと思いました（コナミ）。

無職になったから自分の課題を管理するためのアプリを作ったンゴ

今まで「Next.js × microCMS」で構成していた当ブログを「Next.js × md」の構成へ変更しました。  
リプレースした理由は

*「記事を書くのにわざわざブラウザ開くのが面倒臭い」*

これに尽きます。  
ここ数年はブログを書くと言えば、所属している会社の技術ブログくらいだったのですが、そこでは記事をmdで管理しており、

「記事を書いたやで！あとはgitでリポジトリにぽいや〜彡(^)(^)」

これだけで完結していたのです（厳密にはもう少し工程がありますが）。  
そんなmd湯に使っていたため、今更ブラウザを開いて、サイトにアクセスして、記事を書くなんてことはできるわけなかったのです。

なにはともあれ、骨の折れるリプレース作業が終わったので、今後は当ブログにのんびり記事を投稿していこうと思います。

タグ：日記

専門卒の3年目フロントエンドエンジニアが初転職するまでの話

フロントエンドエンジニアが転職ドラフト経由で転職をしたので感想をつらつらと書く

アイデア出しに役立つアプリを作ったからみんな使え！！

無職になったから自分の課題を管理するためのアプリを作ったンゴ

ブログを「Next.js × microCMS」から「Next.js × md」の構成へ変更した