微経験フロントエンドエンジニアの職務経歴書｜React・Vue経験のアピール方法

「ReactでTodoアプリを作ったことはあるけど、業務で使ったのはjQueryとHTMLとCSSがほとんど。これってフロントエンドエンジニアとして職務経歴書に書けるのか」という悩みは、フロントエンドエンジニアの転職相談で非常によく出てきます。

フロントエンドエンジニアという職種は、会社によって求められる技術スタックが大きく異なります。HTML/CSS・jQueryだけの現場もあれば、React・TypeScript・GraphQL・テスト自動化まで一人で担う現場もあります。この「技術スタックのばらつき」が、微経験フロントエンドエンジニアの職務経歴書を「何を書けばいいかわからない」状態にしてしまう最大の原因です。

書類が通らない原因のほとんどは、ReactやVueの経験が浅いことそのものではなく、「どんな技術を・どんな文脈で・どう考えて使ってきたか」を言語化できていないことにあります。採用担当者は「ReactもVueもできます」という羅列より「このコンポーネントで・この課題を・このように解決した」という具体的な記述を評価します。

本記事ではフロントエンドエンジニアの実務経験1〜2年を「微経験」と定義し、HTML/CSS中心の経験からReact・Vue経験まで、どう職務経歴書に書けばよいかを解説します。

採用担当は何を見ている？微経験フロントエンドエンジニアの評価ポイント

書類が通らない微経験フロントエンドエンジニアに共通する3つのパターン

パターン①：技術スタックを羅列するだけで「使った文脈」がない

「HTML/CSS、JavaScript、React、Vue、TypeScript」と並べるだけでは、業務で実際に使ったのか・どのプロジェクトで何を解決するために使ったのかが伝わりません。

技術名には必ず「何のために使ったか」をセットで書くことが重要です。

パターン②：「コーディングを担当しました」で終わっていてレベルが伝わらない

「フロントエンドの実装を担当」と書くだけでは、HTML/CSSのマークアップのみなのか、JavaScriptの動的処理まで担当したのか、コンポーネント設計にも関わったのかが伝わりません。担当した実装の範囲を具体的に書いてください。

パターン③：「業務経験あり」と「学習中」を混在させている

業務で実際に使った技術と、個人学習・個人開発で使った技術を区別せずに書いてしまうと、採用担当者が実力を誤解します。「業務経験あり」「業務外で学習中」を必ず分けて明示してください。

書き方のポイント｜微経験だからこそ伝えるべき3つのこと

ポイント①：「技術を使った」より「何の課題を解決したか」を書く

「CSSでアニメーションを実装した」と書くのと、「スクロール時の視差効果（parallax）をCSSとIntersection Observer APIで実装し、ページの直帰率を改善する施策に貢献した」と書くのでは、評価の伝わり方がまったく異なります。

技術はあくまで手段です。「何の課題を・どの技術で・どう解決したか」という流れで書いてください。

ポイント②：担当した実装の「範囲と深さ」を明示する

「マークアップのみ担当」「JavaScriptの動的処理まで担当」「コンポーネントの設計から実装まで担当」のように、担当範囲の深さを明示します。「デザイナーから渡されたデザインをHTML/CSSに起こすことが中心だったが、半年後からJavaScriptの動的処理も担当するようになった」という変化を書くと成長の軌跡が伝わります。

ポイント③：「業務経験あり」と「学習中」を明確に分ける

スキルシートでは「業務経験あり」と「業務外で学習中」を必ず分けて書きます。「React（業務外で個人開発に使用中）」「TypeScript（業務外で学習中・基礎レベル）」のように明示することで、採用担当者が実力を正確に把握できます。

微経験フロントエンドエンジニアならではの悩みに答える

「ReactやVueを少ししか業務で使っていない。経験者として書いていいか」

業務での使用経験があれば「業務経験あり」として書けます。ただし使用範囲を正直に書くことが重要です。「Reactを使った既存コンポーネントの修正・バグ修正を3ヶ月間担当（新規コンポーネントの設計は未経験）」のように、業務での使用範囲を明確に書くと、採用担当者が正確に評価できます。学習中の技術は「業務外で学習中」として書いてください。

「コンポーネント設計の経験がなく、設計力をどうアピールするか」

コンポーネント設計の経験がなくても、「既存コンポーネントを読んで理解する力」「コードレビューで設計の意図を確認してきた経験」「個人開発でのコンポーネント分割の試み」は書けます。「設計は先輩が担当し、自分は既存コンポーネントを修正・追加実装してきたが、設計の意図をコードレビューや質問を通じて学んできた」という書き方で、成長の姿勢が伝わります。

例文

例①：フロントエンドエンジニア（実務1年・HTML/CSS・jQuery中心）

Web制作会社（従業員20名）にて、クライアントのコーポレートサイト・LPのコーディングを担当。デザイナーから渡されたデザインのHTML/CSSへの起こしを中心に対応。

例②：フロントエンドエンジニア（実務1年半・React導入補助）

自社サービスを持つWeb系企業（従業員50名）にて、既存のjQueryベースのフロントエンドをReactに移行するプロジェクトに参加。HTML/CSS実装を中心に、React既存コンポーネントの修正・追加も担当。

例③：フロントエンドエンジニア（実務2年・Vue・TypeScript使用）

SaaS企業（従業員80名）の開発チーム（フロントエンド担当3名）にて、Vue 3・TypeScriptを使った管理画面のフロントエンド開発を担当。

書き方ステップ

ステップ①：経験したプロジェクトと担当した実装をすべて書き出す

プロジェクト名（社外秘の場合は業種・規模で代替）・期間・担当した実装の範囲（マークアップ・JavaScript・コンポーネント設計・テストなど）を一覧にします。

ステップ②：技術スタックを「業務経験あり」と「学習中」に分けて整理する

業務で実際に使った技術と、個人学習・個人開発で使っている技術を必ず分けて整理します。「業務外で学習中（個人開発で使用）」と明示してください。

ステップ③：「何の課題を解決するために使ったか」を整理する

各技術を使った実装について、「何の課題を解決するために実装したか」「どんな工夫をしたか」「どんな結果につながったか」を書き出します。

ステップ④：成長の軌跡を時系列で整理する

入社直後に担当できた実装・半年後に担当できるようになった実装・現在担当できる実装を時系列で並べます。この変化を書くことで採用担当者は「入社後もこのペースで成長できる人」と判断しやすくなります。

ステップ⑤：「技術→使った文脈→課題→解決→成長」の流れで書き直す

「〇〇を使いました」という記述を「何の課題を・どの技術で・どう解決し・そこから何を学んだか」という流れに書き直します。

NG例 → 改善例｜通らない書き方の直し方

失敗①：技術を羅列するだけ

失敗②：「業務経験あり」と「学習中」が混在している

失敗③：経験の浅さを前置きにしてしまう

失敗④：自己PRが抽象的で終わっている

経験年数別アドバイス

実務経験1年前後

HTML/CSSのマークアップ・jQueryでの実装が中心で、ReactやVueへの関与はまだ限られている時期です。実績の数字が少なくても、「担当した実装の範囲」「コードレビューでの学び」「品質を担保するための工夫」が1〜2つあれば十分にアピールになります。

振り返るべき問いは「担当した実装でどんな技術的な課題に直面して、どう解決したか」「コードレビューで指摘された内容を次の実装にどう活かしたか」「業務外でReact・Vueの学習を進めているか」の3つです。

実務経験1年半〜2年

担当範囲がHTML/CSSからJavaScript・React・Vueへ広がっている時期です。この段階では「担当範囲の変化」と「モダンフロントエンドへの関与経験」を両方書くことが重要です。

「最初はHTML/CSSのマークアップのみだったが、今はReact・Vueでのコンポーネント実装・テスト作成まで担当している」という変化を明示してください。コンポーネント設計への関与・TypeScriptの型定義・ユニットテストの作成経験も積極的に書きましょう。

よくある質問

まとめ

微経験フロントエンドエンジニアの職務経歴書で評価されるのは、技術の数ではなく「どんな課題を・どの技術で・どう解決し・どう成長してきたか」です。

• 「微経験フロントエンドエンジニア」とはフロントエンド実務1〜2年。技術名の羅列より「使った文脈」の言語化が鍵
• 技術スタックは「業務経験あり」と「業務外で学習中」を必ず分けて書く
• HTML/CSS・jQueryの経験でも、実装の精度・工夫・品質担保の仕組みを書けば十分にアピールできる
• ReactやVueの経験が浅くても、既存コンポーネントの修正・追加実装・コードレビューへの関与は書ける
• 担当範囲の変化（マークアップのみ→コンポーネント実装→テスト作成）を時系列で示す
• 自己PRは抽象的な表現ではなく、具体的な実装エピソードとコードの品質へのこだわりで書く

ショクレキでは、ヒアリングをもとに職務経歴書を一緒に作成するサービスを提供しています。「HTML/CSSしか経験がなくて不安」「ReactやVueの経験が浅くて書けない」という方は、ぜひ一度ご相談ください。

LINEで無料相談する

無料ダウンロード

書き方をまとめて確認したい方へ

職務要約・自己PR・実績の書き方から、主要11職種の作成例、提出前のチェックリストまで収録しています。

職務経歴書の書き方ガイドを無料で受け取る →

梶原

運営責任者

XLINEContact

人事・採用担当として1,000名以上の面接、30社の採用支援に携わった経験をもとに、職務経歴書の作成代行・添削を行っています。 採用側での経験をもとに、評価される書類づくりをサポートしています。「経験はあるのに書類で落ちる」という方に特に支持をいただいています。 これまでのご支援数は370名以上。製造・IT・金融・医療・サービス業など、幅広い業界・職種に対応しております。 職務経歴書の書き方にお悩みの方は、お気軽にご相談ください！