Angular Schematics Demo

Projeto Angular com Custom Schematics para gerar features completas com estrutura padronizada.

🎯 Objetivo

Simplificar a criação de novas features Angular com uma estrutura consistente incluindo:
- Página standalone
- Sistema de roteamento
- Serviço
- Store (com signals)
- Modelos de dados

📦 Schematics Disponíveis

$3

Cria uma feature completa com toda a estrutura necessária.

#### Uso

``bash
ng generate ./dist/schematics:feature
`

#### Exemplos

`bash

Feature simples

ng generate ./dist/schematics:feature dashboard

Feature com kebab-case

ng generate ./dist/schematics:feature user-profile

Feature composta

ng generate ./dist/schematics:feature products-management
`

#### Opções

- --path (padrão: src/app/features) - Caminho base para features
- --skipRouting (padrão: false) - Não atualizar app.routes.ts

#### Estrutura Gerada

`
src/app/features/dashboard/
├── pages/
│ ├── dashboard.page.ts # Componente page standalone
│ ├── dashboard.page.html # Template
│ └── dashboard.page.scss # Estilos
├── components/ # Componentes específicos da feature
├── data/
│ ├── dashboard.service.ts # Serviço
│ └── dashboard.store.ts # Store com signals
├── models/
│ └── dashboard.model.ts # Interfaces de dados
└── dashboard.routes.ts # Rotas da feature
`

🚀 Como Usar

$3

`bash
npm install
`

$3

`bash
npm run schematics:build
`

Isso vai:
- Compilar TypeScript da schematic
- Copiar templates
- Limpar arquivos desnecessários

$3

`bash
ng generate ./dist/schematics:feature minha-feature
`

📁 Estrutura do Projeto

`
angular-schematics-demo/
├── schematics/ # Código fonte das schematics
│ ├── feature/ # Schematic de feature
│ │ ├── index.ts # Lógica da schematic
│ │ ├── schema.json # Schema de validação
│ │ └── files/ # Templates dos arquivos
│ ├── tsconfig.json # Config TypeScript
│ └── collection.json # Configuração das schematics
├── dist/schematics/ # Schematics compiladas
├── scripts/ # Scripts de build
│ ├── build.js # Build logic
│ ├── clean.js # Limpeza de compilação
│ └── copy-files.js # Cópia de templates
├── src/
│ └── app/
│ ├── features/ # Features geradas
│ └── app.routes.ts # Rotas da aplicação
└── package.json
`

🛠 Scripts Disponíveis

`bash

Compilar schematics

npm run schematics:build

Desenvolvimento

npm start # Iniciar dev server
npm run build # Build da aplicação
npm test # Executar testes
`

📝 Customização

Para modificar a estrutura gerada:

1. Editar templates em schematics/feature/files/
2. Atualizar schema em schematics/feature/schema.json para adicionar novas opções
3. Modificar lógica em schematics/feature/index.ts
4. Recompilar: npm run schematics:build

🔧 Publicar em npm (Opcional)

Para publicar sua schematic em npm:

1. Atualizar package.json com seu nome e descrição
2. Compilar: npm run schematics:build
3. Publicar: npm publish
4. Usar em outro projeto: ng add seu-pacote

📚 Recursos

- Angular Schematics Documentation
- Angular DevKit
- Angular CLI

📄 Licença

MIT


`bash
ng e2e
``

Angular CLI does not come with an end-to-end testing framework by default. You can choose one that suits your needs.

Additional Resources

For more information on using the Angular CLI, including detailed command references, visit the Angular CLI Overview and Command Reference page.