About the role
Our front-end surface spans the public site, the customer portal and the internal admin console. It has to feel as fast and as considered as the infrastructure sitting behind it, because for most customers this is the only part of Yobitel they ever touch directly.
You will own that bar. The stack is Next.js App Router, TypeScript in strict mode, Tailwind and shadcn/ui, with React Server Components as the default and client interactivity added only where it earns its place. This is a senior individual-contributor role with real ownership of the design system, the performance budget and the accessibility standard, not a ticket queue.
What success looks like
- The performance budget holds as the surface grows, and regressions are caught before merge rather than in production.
- Design-system components get reused instead of re-invented per page.
- Accessibility is verified rather than assumed, including keyboard and screen-reader paths.
Responsibilities
- Build and maintain the shared component layer across the public site, the customer portal and the admin console.
- Hold the performance budget of under 150 KB initial JS and under 50 KB per route chunk, and keep Core Web Vitals inside target.
- Own accessibility to WCAG 2.2, covering keyboard navigation, focus management, contrast and screen-reader semantics.
- Decide deliberately between server and client components, and keep client-side JavaScript justified rather than habitual.
- Build data-dense interfaces such as dashboards, tables and monitoring views that stay readable and fast under real volumes.
- Work with design on motion and interaction detail, including honouring reduced-motion preferences.
- Review front-end pull requests and raise the standard of the code around you.
Requirements
- Shipped and maintained a production Next.js App Router application at meaningful scale.
- Strong TypeScript, comfortable in strict mode and without reaching for escape hatches.
- Genuine command of modern CSS and Tailwind, including responsive and theming concerns rather than only utility recall.
- Demonstrated ability to diagnose and fix real performance problems using profiling tools, not guesswork.
- Practical accessibility experience, including having tested with a keyboard and a screen reader.
- Care about craft in the details: loading states, empty states, error states and the transitions between them.
- Ability to work from design intent and push back constructively when something will not hold up in implementation.
Nice to have
- Experience with data visualisation or building charting and monitoring interfaces.
- Comfort with animation libraries such as Framer Motion, and judgement about when not to animate.
- Exposure to design-system or component-library authorship as a product in its own right.
- Familiarity with React Three Fiber or WebGL for interactive 3D surfaces.
Role reference: YJ-00005