**Your Mission** To engineer a high\-performance, flexible digital platform that empowers marketing teams to build complex layouts without code. You will leverage an AI\-first development workflow (using tools like Cursor and Claude) to accelerate the delivery of a pixel\-perfect, component\-driven architecture that achieves elite performance metrics (Lighthouse 95\+, LCP \< 2\.5s) and handles complex AI interactions with graceful fallbacks. **Rol Overview** We are looking for a forward\-thinking Frontend Developer to lead the implementation of a modernized, decoupled web ecosystem. This is not a standard website build; you will be engineering a **Headless Architecture** using React, Vue or **Next.js (React)** connected to a modern Headless CMS via GraphQL. You will bridge the gap between creative vision and technical execution, building a modular "Block\-Based Page Builder" system. Uniquely, this role requires an **AI\-augmented approach**: we expect you to utilize advanced AI coding assistants to write cleaner code, automate boilerplate, and solve complex logic faster than traditional methods. This role requires a unique blend of **Performance Engineering** and **AI\-Augmented Development**. You will build interfaces that handle both real\-time user queries and long\-running asynchronous AI tasks, ensuring the experience remains seamless even under heavy load. **Key Responsibilities** * **Develop the Component Library:** Build a robust system of reusable UI components using modern Web frameworks such as VueJS, React or **Next.js** , ensuring strict adherence to the visual design system and WCAG accessibility standards. * **Build the "No\-Code" Page Editor:** Engineer a modular block\-based page builder that allows content creators to assemble flexible page layouts dynamically, decoupling content from code. * **Performance Engineering (Crucial):** You are responsible for meeting strict SLA targets: **Lighthouse scores of 95\+** and **Largest Contentful Paint (LCP) under 2\.5 seconds**. You must master caching strategies, bundle splitting, and image optimization. * **Resilient AI UI Integration:** Build interfaces for Generative AI search that support **Graceful Degradation**. If the AI engine slows down or fails, your UI must instantly revert to standard search/content views without breaking the user experience . * **Asynchronous Task Management:** Implement UI patterns (notifications, toasts, progress bars) to handle asynchronous background processes (like AI content generation) so the user is never forced to wait . * **GraphQL Data Layer:** Architect the frontend to fetch data via **GraphQL** for the public site (for speed) and REST for secure backend integrations . * **AI\-Accelerated Development:** Actively utilize AI tools (Cursor, Claude CLI, Gemini) to generate unit tests, refactor code, and rapidly prototype features. **Core Skills and Competencies** * **Tech Stack:** Deep expertise in VueJS, **React.js**, **Next.js** (Server\-Side Rendering/App Router), and **TypeScript**. * **Data Fetching:** Advanced proficiency with **GraphQL** (clients like Apollo or TanStack Query) to minimize payload sizes. * **Performance Optimization:** Proven ability to optimize for Core Web Vitals (LCP, CLS, INP) and familiarity with Edge/CDN caching strategies . * **AI\-Assisted Workflow:** Proficiency in using AI coding tools (Cursor, Claude CLI) to accelerate development cycles. * **Security Awareness:** Understanding of frontend security best practices (handling tokens, ensuring PII is not logged in browser consoles). * **Testing:** Ability to use AI tools to generate test suites for "Critical Rendering Paths" to ensure performance benchmarks are never regressed. **Required Stack** * **Core:** React.js, Next.js (App Router), TypeScript. * **Data:** GraphQL (Apollo/TanStack Query) for public site speed. * **AI Tooling:** Cursor, Claude CLI (Mandatory proficiency). * Code versioning: Git Domain of Mastery * **Component\-Driven Development (CDD):** Breaking down complex visual designs into atomic, reusable software components. * **Graceful Error Handling:** Designing "Fail\-Safe" UIs that function perfectly even when downstream AI services or APIs experience latency. * **Generative UI Patterns:** Understanding how to design interfaces that handle streaming text and variable\-length answers from Large Language Models (LLMs). * **Privacy\-First UI:** Experience implementing robust cookie consent managers and "Opt\-In" tracking UI logic. Job Type: Full\-time Pay: $30,000\.00 \- $45,000\.00 per month Work Location: Remote