Defines architectural standards for algorithmic efficiency in enterprise-scale Vue applications. Introduces performance monitoring systems for computed properties and watchers through Vue DevTools and Lighthouse CI.
Roles · Frontend Developer (Vue) · Lead
What a Lead } should know
37 core skills, 54 in total. Expectations per skill, and what changes at the next level.
This page lists what a Lead } is expected to know and do, skill by skill. Core skills are the ones a manager and peers assess in a review cycle; the rest count only in self-assessment. Main areas: Programming Fundamentals, Frontend Development, API & Integration.
Core skills for a Lead
Grouped by area. The label on the right is the expected depth: Awareness, Working, Advanced or Expert.
Programming Fundamentals · 6
Defines architectural standards for async work in Vue applications — data fetching layer, caching strategy, background sync. Introduces error handling patterns and graceful degradation at organizational level.
Defines code quality standards for Vue teams — architectural guidelines, review checklist, automated CI checks. Builds code review culture focused on Composition API patterns and type safety.
Defines data architecture for large-scale Vue applications — normalization, denormalization, indexing in client stores. Designs universal composables for working with typed collections through TypeScript generics.
Defines pattern and anti-pattern catalog for Vue development in the organization. Introduces architectural solutions — Feature-Sliced Design, Clean Architecture adapted for Vue 3 and Nuxt 3 ecosystem.
Defines typing strategy for organizational Vue projects — config strictness, JavaScript migration, runtime validation integration. Introduces end-to-end type safety from API to templates through tRPC or typed fetch.
Frontend Development · 19
Defines performance budgets for organizational Vue project bundles — automated size checks in CI, growth alerting. Introduces optimization strategy — dependency audit, bundle analysis, automated size regression testing.
Defines component testing standards for Vue teams — coverage thresholds, testing patterns, review checklist. Introduces testing culture through training, templates and automated test quality checks in CI.
Defines performance budgets and Core Web Vitals SLA for organizational Vue projects. Introduces Lighthouse CI in pipeline, configures metric degradation alerting, trains teams on optimization.
Defines product-level CSS-in-JS architecture for Vue applications: evaluates styling strategies (SFC scoped vs CSS-in-JS libraries), establishes design token governance, and sets component API standards. Conducts architectural reviews ensuring scalable, accessible, and performant styling across teams.
Defines data layer architecture for organizational Vue projects — API client standards, caching strategy, error handling patterns. Introduces end-to-end type safety through tRPC or typed route rules in Nuxt 3.
Defines organization's design system architecture on Vue — governance, versioning, adoption strategy. Builds synchronization process between designers (Figma) and Vue components through tokens and code generation.
Standardizes micro-frontend approach in Vue ecosystem: creates CLI for scaffolding new micro-frontend with standard configuration, defines shared component library strategy, designs versioning and backward compatibility. Trains teams on micro-frontend patterns and anti-patterns.
Defines CSS architecture standards for Vue teams — methodologies, tooling, performance budgets for styles. Introduces automated CSS quality checking systems — Stylelint, visual regression through Playwright.
Defines product-level frontend architecture with Nuxt. Establishes standards and best practices. Conducts architectural reviews.
Defines PWA development standards for Vue teams — offline UX patterns, caching strategies, quality metrics. Introduces PWA testing processes through Lighthouse CI and automated pipeline checks.
Defines rendering strategy for organizational Vue projects — SSR vs SSG vs ISR for different content types, infrastructure requirements. Introduces SSR performance monitoring and Nuxt application deployment standards.
Defines state management strategy for Vue projects — modular Pinia architecture, cross-tab sync, migration patterns. Introduces store organization standards, trains teams on complex state management patterns.
Defines Tailwind CSS usage standards for Vue team — naming conventions, component abstractions, Storybook integration. Introduces design token system synchronized between Figma and Tailwind configuration.
Defines visual testing strategy for Vue teams — tooling (Chromatic vs Percy vs Playwright), baseline approval governance, code review integration. Introduces visual validation processes when updating design system.
Defines Vite configuration standards for Vue teams — shared presets, plugin governance, migration guide. Introduces Turborepo for monorepo with Vue projects, optimizes CI/CD pipeline through Vite artifact caching.
Defines product-level frontend architecture with Vue Core. Establishes standards and best practices. Conducts architectural reviews.
Standardizes accessibility in Vue ecosystem: defines a11y standards for Vue design system, creates composables for reusable accessibility patterns (useFocusTrap, useAnnouncer), designs a11y testing strategy. Trains teams and conducts accessibility audits.
Defines Web API usage standards for Vue projects — security review, permissions policy, privacy-first approach. Introduces architectural solutions for Platform API integration — Web Payments, Credential Management.
Defines Web Components strategy for the organization — when to use Vue components vs Custom Elements, shared library governance. Introduces publishing and versioning processes for Web Components from Vue codebase.
API & Integration · 2
Defines GraphQL strategy for Vue projects — schema governance, performance monitoring, security (query complexity, depth limiting). Introduces GraphQL standards — codegen pipeline, testing patterns, error handling.
Defines API integration standards for Vue teams — API design guidelines, error handling patterns, documentation. Introduces end-to-end type safety through OpenAPI type generation and runtime validation through Zod.
Cloud & Infrastructure · 1
Defines Vue application containerization standards — base images, security scanning, CI/CD integration. Introduces best practices — distroless images, non-root users, automated vulnerability scanning.
DevOps & CI/CD · 1
Defines CI/CD standards for Vue teams — shared workflows, deployment strategies, rollback procedures. Introduces GitOps practices for Nuxt applications, optimizes pipeline time through intelligent test splitting.
Testing & QA · 3
Defines accessibility testing standards and quality gates for Vue projects across the organization. Establishes automated a11y testing pipelines, Vue component library accessibility certification workflows, and WCAG compliance reporting for Vue/Nuxt products. Conducts architecture reviews ensuring Vue applications meet accessibility requirements and drives adoption of accessible component design patterns across Vue development teams.
Defines E2E testing strategy for Vue projects — test pyramid balance, critical path coverage, test environments. Introduces processes — test review, maintenance rotation, E2E test stability monitoring dashboard.
Defines unit testing standards for Vue teams — coverage thresholds, testing patterns, review guidelines. Introduces TDD culture, trains teams on testing composables and Pinia stores through practical workshops.
AI-Assisted Development · 2
Defines AI usage standards for Vue teams — approved tools, prompt templates, generated code review process. Introduces AI-assisted development workflow while maintaining Vue code quality and security.
Defines Copilot strategy for Vue teams — organization policy setup, content exclusions, usage guidelines. Introduces AI-assisted coding effectiveness metrics, trains teams on usage best practices.
Version Control & Collaboration · 2
Defines code review standards for Vue organization — review SLA, required checks, escalation process. Introduces automated review — ESLint, TypeScript strict, bundle size checks, Lighthouse CI in PR pipeline.
Defines Git workflow for Vue teams — branching strategy, release process, hotfix procedure. Introduces automation — semantic versioning, automated release notes, changelog generation for Vue component libraries.
Performance Engineering · 1
Defines performance budgets and SLA for organizational Vue projects — standards by application type, compliance monitoring. Introduces performance review in code review process, trains teams on Vue application optimization.
Additional skills
Not assessed by the team, but part of the self-assessment and the development plan.
What changes at Principal
0 skills get a higher expectation or become core when moving from Lead to Principal. The biggest jumps first.
} in the open competency matrix: 54 skills across 5 levels. The matrix is free for individuals and stays free.