Frontend engineer Β· BtoB / spec-heavy products Β· Vue 3 @ work Β· React / Next.js elsewhere
Ex-sales (6y) β translating ambiguity into buildable scope.
| ποΈ | Scalable front-end structure β clear boundaries and contracts; refactor incrementally instead of one-off fixes |
| 𧩠| Team-level quality β reviews, tests, and automation so delivery doesnβt hinge on individual heroics |
| βΏ | A11y-aware shipping Β· IC track: impact through implementation, design tradeoffs, and review β not line management |
| Area | Outcomes |
|---|---|
| π Vue 2β3 | Shipped the migration without pausing the roadmap. Owned hands-on design, migration, and implementation inside a program-level re-arch (direction aligned with engineering leadership). Cut legacy risk after Vue 2 EOL; kept product work moving while paying down FE debt. |
| π€ AI Γ CI | Shifted critical checks from ad hoc review to the pipeline. Led end-to-end β proposal β design β implementation β adoption: AI-assisted PR review (diff-aware hints vs architecture / coding guidelines) and E2E test perspectives generated from changes (e.g. upgrade PRs). Tighter consistency pre-merge, less variance in what gets caught, quality gates became default β not optional polish. |
| π OpenAPI | Established a schema-driven FEβBE workflow with backend partners β clearer contracts, fewer late integration surprises, lower regression risk at API boundaries. |
| π₯ Collaboration | Facilitated alignment across PM, design, and BE when specs were fuzzy. Ran onboarding for partners and new engineers β faster ramp without relying on tribal knowledge. |
Pinia Β· MSW Β· GraphQL (Apollo) Β· NestJS Β· Firebase (side / pro bono)
| Repo | What it exercises | |
|---|---|---|
| π | lt_i18n_todo | Locale + TZ correctness when state, formatting, and UX must stay aligned Β· demo |
| π§ͺ | dm_i18n-rtl | RTL + i18n edge cases β layout, direction, and component assumptions under non-LTR languages (based on real product requests) |
| βΏ | dm_keyboard-a11y | Keyboard accessibility β focus management and operability without mouse (derived from real user feedback) |
| π£οΈ | dm_speech-contents | Speech + content UX β exploring voice interaction patterns and accessibility (based on real improvement needs) |
| π» | vc_attendance-list | Real-world scheduling system β used in an orchestra group; handles constraints, participation tracking, and practical UX tradeoffs |
| π | vc_recommend-books | Internal app development β built to share what colleagues read and their thoughts; designed to encourage lightweight contributions and used for onboarding |
| π€ | ai-dev-starter | Agent-ready FE starter β reproducible quality gates and AI-assisted workflows (independent from employer systems) |
Blog (JA): zenn.dev/hakushunγGitHub: github.com/hakushun