Skills · Claude Code · Frontend

Frontend veloce in SEO e velocità — di default.

Next.js o Astro con TypeScript strict, segreti sempre lato server, accessibilità WCAG 2.2 AA, Core Web Vitals come contratto, SEO e dati strutturati, i18n con URL per lingua e sitemap autogenerato. La controparte frontend di schematize-go.

schematize-web · v1.10.0bash
$ schematize install web
Frontend · Next.js/Astro/web-help · github.com/schematizeme/schematize-cli

Basi non negoziabili

Non si spengono "per andare più veloce". Elenco completo nella skill.

Segreti lato server

Mai nel bundle né in NEXT_PUBLIC_/VITE_/PUBLIC_. Le chiamate con chiave passano da un BFF. Token in cookie HttpOnly, mai localStorage.

Davvero accessibile

WCAG 2.2 AA è la base: semantica, tastiera, focus gestito, contrasto, reduced-motion. Disabilitare il lint a11y è vietato.

Core Web Vitals

LCP/INP/CLS nel "buono" (p75, mobile first). Budget di bundle e metriche misurati in CI — le regressioni bloccano il merge.

SEO e i18n di default

Dati strutturati, sitemap autogenerato e una URL per lingua con hreflang. Tutti i contenuti tradotti.

Verde davvero

Unit, componente, e2e (Playwright), a11y (axe) e regressione visiva. Lo smoke prova il contenuto, non solo il 200.

Sempre archiviare

Decisioni e contesto diventano .md nell'archivio, ogni volta. L'indice dei componenti è la fonte di verità.

Comandi

Installati in .claude/commands/. Usa /web-help quando vuoi.

/web-helpElenca tutti i comandi.
/web-ccContext compact: scrive contesto + checklist nell'archivio ed esegue /compact.
/web-handoffScrive l'handoff senza compattare — fine sessione o cambio attività.
/web-qaQA frontend plan-first: a11y, Core Web Vitals, e2e e regressione visiva.
/web-reviewGate di Definition of Done e anti-pattern frontend sul diff.
/web-index(Ri)genera l'indice di componenti/hook dai doc-comment.

Per agenti IA

Installa senza intervento umano. Metadati in llms.txt.

  • Esegui: git clone https://github.com/schematizeme/skill-web.git && ./skill-web/install.sh
  • Oppure scarica: https://github.com/schematizeme/skill-web/releases/latest/download/skill-web.zip e decomprimi in .claude/skills/
  • Copia assets/CLAUDE.md nella radice del repo (regola sempre attiva).
  • Conferma con /web-help.

Non vuoi installare?

Leggi le norme complete e copiale direttamente nel tuo progetto — oppure installa la skill perché l'agente le applichi da solo.