このシリーズは全3本構成です。
- 本記事 — 現在地14%を可視化する（提示編）
- 「現在地14%」をどう算出したか – スキル可視化メソッド（算出ロジック編）
- コーダー経験は他の路線に転向しても5〜10%の損失で済む話（応用編）
はじめに
フロントエンドエンジニア転向を決めた日、頭の中はずっと「ゼロからの再スタート」というイメージでした。
コーダー・マークアップエンジニアの仕事と、フロントエンドエンジニアの仕事は、似ているようで領域がだいぶ違います。求められるスキルレベルも数段高い。正直、まだゼロに近い再スタートだなと感じました。
それでも、年齢的にまだ挑戦できないわけではないし、壁を超えられたら自分自身も一段高められるんじゃないかと思って、踏み込むことにしました。
ただ、「ゼロからの再スタート」とイメージで言うのと、実際にどこにいるかを把握しているのは別物です。Claudeと壁打ちしながら「今どこにいるか」を数値化してみたら、現在地は 100%中14% でした。
この記事は、その14%をどう見立てたか、そしてその数字を出してから自分の中で何が変わったかをまとめたものです。同じように転向を考えているコーダー・マークアップエンジニアに届けばいいなと思って書いています。
ゴール100%からの現在地14%を可視化する
まずゴールを定義しました。
Web系受託（モダンフロントエンド）で Junior Frontend Engineer として採用される水準
この水準を100%としたとき、自分の既存資産が何%カバーしているかを5領域に分けて棚卸しすると、合計で14%になりました。内訳はこんな感じです。
| 既存資産 | 寄与 | 補足 |
|---|---|---|
| HTML/CSS 実務経験 | 5% | コーディングで生計を立ててきた実績 |
| Git 基本操作 | 3% | commit / branch / PR はできる |
| クライアント対応・要件ヒアリング経験 | 4% | 制作会社・エンドクライアントとのやりとり経験 |
| 実案件の納品経験 | 2% | 納期管理・複数案件並行・品質担保の実績 |
| 合計 | 14% |
残り86%は、TypeScript・React・Next.js・テスト・設計力・チーム開発文化への適応など、これから半年で埋めていく領域です。
ここで大事なのは「14%という数字そのもの」より、「ゼロじゃない場所からスタートできる」と分かることでした。
既存資産の棚卸し：数字の根拠
各項目を、もう少し細かく見ていきます。
HTML/CSS 実務経験：5%
コーダーとして2年、フリーランスで30件以上の案件をこなしてきました。BEM や FLOCSS の設計、SCSS の運用も実務レベルで使っています。Junior Frontend Engineer の求人票で「HTML/CSS の実装ができること」が必須要件に入っている割合を考えると、ここはほぼフルスコアと見ていい領域でした。
ただし、アクセシビリティ（WCAG 2.1）対応やパフォーマンス最適化（Core Web Vitals）まで踏み込んだ経験はないので、「マークアップ枠の中でも上位層」とまでは言えない。だから配分の半分くらいに収まっています。
Git 基本操作：3%
commit / branch / push / PR の流れは個人開発レベルで回せます。GitHub にもコードを上げています。
ただ、チーム開発でのブランチ戦略・コードレビュー文化・CI/CDパイプライン構築などはまったく未経験です。「Git は使える」と「チーム開発の Git ができる」は別物だと感じていて、ここは控えめな数字にしました。
クライアント対応・要件ヒアリング経験：4%
これは個人的に、転向後の面接で一番効いてくるかもしれないと感じている領域です。
要件ヒアリング・提案・修正の折衝・進行管理を、フリーランスとして一人で回してきました。エンジニアの採用面接で「ビジネス側とのコミュニケーション能力」が見られるという話をよく聞きますが、これは完全未経験者の方が苦戦しやすい部分なので、相対的に強みになりそうです。
実案件の納品経験：2%
「コードを書いてお金をもらったことがある」という事実は、書類上は短い表現ですが、面接では具体的なエピソードに展開できます。納期管理、複数案件の並行、クオリティ担保。どれも「現場で揉まれた経験」として話せます。
完全未経験者がこれと同等のものを示すのは難しいので、ここも転向組ならではの資産だと考えています。
「未経験」と「転向」は別物だと思った話
転向を考えているとき、自分は「未経験者」のカテゴリに入るのかどうかが気になっていました。
求人票の「未経験OK」を見て応募していいのか、それとも「実務経験者」枠で見てもらえるのか。エージェントとも話して、市場リサーチも自分でやってみて気づいたのは、「未経験」と「転向」は同じカテゴリではない、ということでした。
完全未経験者（プログラミング歴ゼロからのスタート）と、コーダー歴のある転向者では、
- HTML/CSS の基礎が固まっているかどうか
- Git の操作に慣れているかどうか
- 「コードを書いて納品する」プロセスを経験しているかどうか
- クライアントとのやりとりができるかどうか
このあたりがすでに違います。研修コストが下がるという意味で、企業側にもメリットがある立ち位置です。
「14%」という数字は、その「違い」を自分の言葉で説明できる材料にもなります。面接で「未経験ではなく転向です」と言うとき、根拠の数字があるかないかで重みが変わります。
数字にしてみて変わったこと
正直、14%という数字を初めて見たときは「思ったより道のりが遠いな」と感じました。Aホッとしたか、B焦ったかで言えば、Bの方が強かったです。
ただ、不思議なことに、数字を見たあとの方が前向きになれました。
それまでは「何か手を打たなきゃ」「学習を始めなきゃ」という漠然とした焦りだけがあって、具体的に何から手をつければいいか分かりませんでした。「フロントエンドの勉強しよう」と思っても、ロードマップを眺めて固まってしまう。
棚卸しをしてからは、
- 自分が持っているもの（14%）
- これから埋めるべき領域（残り86%・特に TypeScript と React/Next.js の50%）
- どの順番で何を学ぶか
このあたりが具体的に見えてきました。漠然とした不安が、ステップに分解できる課題に変わった感覚です。「とりあえず何かやらなきゃ」が「次はこれをやればいい」に変わる。これは思った以上に大きな変化でした。
まとめ：数値化は心理的なツール
転向を考えている段階で、自分の現在地を数値化するのはかなり有効だと感じています。理由は3つです。
- 「ゼロじゃない場所」からスタートできることが分かる — 既存資産が見えると、心理的な負荷が下がります
- 不安が具体的な課題に変わる — 「何かやらなきゃ」より「次はこれ」の方が手が動きます
- 完全未経験者との違いを言語化できる — 面接でも、自分の中の納得感としても、根拠が持てます
数字そのものが正解という話ではなく、「数字にしてみる」プロセスが効きます。実際にどう算出したかの方法論は、シリーズ2本目の「算出メソッド」にまとめています。
転向先がフロントエンドではなくバックエンドや他の路線でも、コーダー経験はある程度転用できます。その試算はシリーズ3本目の「転用試算」で書いています。
道のりは遠く感じますが、現在地が見えていれば、一歩ずつ進めます。同じ場所にいる方の参考になればうれしいです。
written by 松尾｜フリーランスWebコーダー
コメント