FrontendField Guide

React / Next.jsを中心に、複雑な要件を観察し、
扱いやすいインターフェースへ分類・設計・実装する。

CLASSFrontend Engineer

HABITATWeb / Mobile UI

ACTIVE SINCE2020 — Present

OBSERVECLASSIFYIMPLEMENTREFINE

◆React◆Next.js◆TypeScript◆Zustand◆Figma◆Vitest◆PHP / Symfony◆UI / UX◆React◆Next.js◆TypeScript◆Zustand◆Figma◆Vitest◆PHP / Symfony◆UI / UX

Plate 01 — Expertise specimens

SP-01Architecture

SP-01

モダン
フロントエンドの
設計・実装力

Figmaからの正確なコンポーネント実装と、Zustand/Reduxを用いた効率的な状態管理。

ReactNext.jsTypeScript

設計: 92
実装: 94
保守性: 88

SP-02Performance

SP-02

パフォーマンス
改善・品質担保

iOSの表示崩れ修正や、Vitestによる遷移テスト整備で、高速かつ安定したUXを担保。

再レンダリング最適化iOS対応自動テスト

調査: 90
改善: 86
品質: 91

SP-03Leadership

SP-03

アジャイル開発
& 推進力

ライブラリのリプレイス提案や、朝会進行でチームをリード。技術選定と多言語化も担当。

スクラム技術選定多言語化

提案: 84
連携: 90
推進: 87

Plate 02 — Field records

REC.01

2023.06
— 現在

// Frontend Engineer

某情報閲覧サイト改修、
会員登録リプレイス

ACTIVE

REC.02

2023.03
— 2023.06

// UI Engineer

化粧品会社
診断アプリ UI改修

ARCHIVED

REC.03

2020.12
— 2023.03

// Frontend

ゲームプラットフォーム
新規開発

ARCHIVED

REC.04

2020.06
— 2020.11

// Backend / EC

ECサイト (BtoB)
開発・改修

ARCHIVED

Plate 03 — Technology index

ReactNext.jsTypeScriptPHP / SymfonyMySQLZustandReduxFigma連携UI/UX設計パフォーマンス改善iOS表示修正自動テスト整備多言語対応アジャイル開発API設計・連携コードレビュー状態管理最適化共通コンポーネント化リプレイス推進B2B機能実装ドキュメント整備