Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Como estruturar meus projetos angular?

Como organizar o local onde ficarão meus componentes no Angular?

No curso há uma pasta de componentes em que estão os componentes que fazem parte da base da aplicação, componentes como *cabecalho, rodape, cartao e mensagem.

Mas fora dessa pasta há outros componentes dentro da pasta animais. Minha dúvida é: Tem um jeito recomendado de estruturar, de colocar esses componentes dentro do projeto?

Por que todos não ficam dentro da pasta componentes, já que todos são componentes?

Obrigado a quem leu e está pensando na resposta <3.

2 respostas
solução!

Boa tarde Gelson,

Não faço parte da equipe de suporte da Alura, porém gostaria de ajudá-lo com uma sugestão:

O que é recomendado a se fazer é não centralizar todo e qualquer tipo de componente em uma única pasta chamada: "componentes", mas sim pensar na questão de modularização:

por exemplo: vamos supor que você está desenvolvendo um projeto para uma empresa de delivery . Sendo assim, com toda certeza você irá precisar de criar modelos que representam: cardapio, pedido, cliente, etc. Dessa forma, como cada modelo embora possam interagir uns com os outros (cliente > pedido > cardapio), é fortemente recomendado que você isole e agrupe cada modelo em uma pasta que irá representar aquele assunto em específico:

Segue um exemplo do que poderia ser feito:

pasta client (cliente):

  • client.component.ts
  • client.component.html
  • client.module.ts
  • client.routing.module.ts

pasta order (pedido):

  • order.component.ts
  • order.component.html
  • order.module.ts
  • order.routing.module.ts

pasta menu (cardapio):

  • menu.component.ts
  • menu.component.html
  • menu.module.ts
  • menu.routing.module.ts

Outra abordagem também, seria você criar subpastas dentro das pastas principais

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

Acima foi apenas um exemplo considerando um projeto para delivery, mas você poderia portar a mesma ideia para o projeto do curso

Exemplo de recomendações na documentação oficial do angular: https://angular.io/guide/styleguide#folders-by-feature-structure Leia sobre a separação de módulos: feature / shared / etc

Pesquisando na internet, há outras formas / abordagens também, porém sempre seguindo o conceito de modularização e separação de responsabilidades dos recursos da aplicação.

Nossa! Muito obrigado!