# frontend-dev-guidelines

> Diretrizes de desenvolvimento de frontend para aplicações React/TypeScript. Padrões modernos incluindo Suspense, lazy loading, useSuspenseQuery, organizaçã

- Fonte: https://doutorai.pt/componentes/skills__frontend-dev-guidelines
- Tipo: Skills
- Categoria: Desenvolvimento
- Downloads: 218
- Site: Doutor AI (https://doutorai.pt) - ferramentas de IA para pequenos negócios em português

Componente da comunidade open-source, selecionado, traduzido e adaptado pelo Doutor AI.

## Para que serve e como usar

Uma **skill** que ensina o Claude Code a executar bem tarefas de desenvolvimento. É conhecimento empacotado que o modelo passa a usar sempre que for relevante.

1. Instale a skill (comando acima).
2. No Claude Code, descreva o que precisa - a skill ativa-se sozinha quando o contexto encaixa.
3. Não precisa de decorar comandos: fala em linguagem natural e a skill faz o resto.

## Instalar (Claude Code)

```bash
mkdir -p .claude/skills/frontend-dev-guidelines && curl -fsSL https://doutorai.pt/data/lib/skills__frontend-dev-guidelines.md -o .claude/skills/frontend-dev-guidelines/SKILL.md
```

Cole este comando no terminal, na pasta do seu projeto, e o componente é instalado automaticamente.

## Conteúdo

```
---
name: frontend-dev-guidelines
description: Frontend development guidelines for React/TypeScript applications. Modern patterns including Suspense, lazy loading, useSuspenseQuery, file organization with features directory, MUI v7 styling, TanStack Router, performance optimization, and TypeScript best practices. Use when creating components, pages, features, fetching data, styling, routing, or working with frontend code.
---

# Frontend Development Guidelines

## Purpose

Comprehensive guide for modern React development, emphasizing Suspense-based data fetching, lazy loading, proper file orga

- 🔒 Conteúdo completo no plano Pro (7,99€/mês) -
```

## Componentes relacionados

- [PocketBase API Rules](https://doutorai.pt/componentes/skills__pocketbase-api-rules): Regras de API e expressões de filtro para controlo de acessos do PocketBase. Use ao definir permissões, escrever expressões de filtro, confi
- [PocketBase Collections](https://doutorai.pt/componentes/skills__pocketbase-collections): Design de coleções e esquemas para o PocketBase. Use ao criar coleções, desenhar esquemas, adicionar campos, configurar relações ou escolher
- [PocketBase Deploy](https://doutorai.pt/componentes/skills__pocketbase-deploy): Deployment em produção para PocketBase. Use ao fazer o deploy do PocketBase para um servidor, configurar Docker, configurar systemd, reverse
- [PocketBase Hooks](https://doutorai.pt/componentes/skills__pocketbase-hooks): Hooks de JavaScript no lado do servidor para o PocketBase (pb_hooks). Use ao escrever rotas personalizadas, hooks de eventos, cron jobs, env
- [PocketBase Migrations](https://doutorai.pt/componentes/skills__pocketbase-migrations): Migrações de esquema e versionamento para o PocketBase. Use ao criar migrações, gerir versões de esquemas, sincronizar coleções entre ambien
- [PocketBase SDK](https://doutorai.pt/componentes/skills__pocketbase-sdk): Uso do SDK de JavaScript para aplicações cliente PocketBase. Use ao chamar o PocketBase a partir do frontend ou Node.js, autenticar utilizad

## Poupe horas todas as semanas com IA, sem complicações

O **Doutor AI** dá-lhe 1859 prompts de IA prontos a copiar, por indústria e em português simples - mais uma biblioteca técnica completa para quem quer ir mais longe. [Ver planos →](https://doutorai.pt/precos)

---
Conteúdo de Doutor AI (https://doutorai.pt). Ao citar, indique a fonte: https://doutorai.pt/componentes/skills__frontend-dev-guidelines