RESPONSIBILITIES Core Responsibilities Frontend Architecture & System Design • Design scalable and maintainable frontend architectures for complex web applications. • Define application structure, module boundaries, and shared component strategies. • Drive decisions around: ▪ Rendering models (SSR, SSG, ISR, CSR) ▪ Styling architecture ▪ State and data flow • Apply architectural patterns such as: ▪ Component-driven architecture ▪ Feature/domain-based organization ▪ Micro-frontend patterns (when justified) ▪ Maintain architecture documentation, diagrams, and ADRs.
Frontend Engineering (Hands-on) • Build and maintain production-grade applications using Next.js and modern React. • Write clean and maintainable TypeScript code. • Design and evolve reusable component libraries and design systems. • Lead code reviews focusing on architecture, performance, and long-term maintainability.
Styling & UI Architecture • Design scalable styling strategies using: • CSS Modules • Styled-components / Emotion • Utility-first CSS (Tailwind or similar) • Traditional CSS / SCSS • Make trade-offs between: ▪ Runtime vs build-time styling ▪ Global vs scoped styles ▪ Design system tokens vs local overrides • Build and maintain: ▪ Theming systems ▪ Responsive and adaptive layouts ▪ Cross-browser and cross-device compatibility ▪ Ensure styling consistency and avoid CSS leakage and specificity issues.
State Management • Architect complex state systems with clear separation: • Server state • Client state • UI state • Experience with state libraries such as: ▪ Redux / Redux Toolkit ▪ Zustand, Recoil, Jotai ▪ React Query / TanStack Query ▪ Manage real-time and shared state across views and sessions. ▪ Prevent unnecessary re-renders and state coupling.
Real-Time Communication • Build real-time features using: • WebSockets • Server-Sent Events (SSE) • WebRTC • Design subscription models, reconnection logic, and data consistency strategies. • Coordinate real-time data flow with backend services and message brokers.