AutoInstrucional

Estrutura de pastas

O FlickPicks separa o código em três pastas dentro de src/app: pages, components e services. Nesta aula vamos entender o papel de cada uma — é exatamente a mesma divisão que este template usa.

Terminal

src/app/
  pages/
    home.ts
    browse.ts
    titledetail.ts
    login.ts
    accountshell.ts
  components/
    header.ts
    footer.ts
    movieCard.ts
    movieRow.ts
    selectdropdown.ts
  services/
    auth.service.ts
    lists.service.ts
    quiz.service.ts
    theme.service.ts
    tmdb.interceptor.ts
  app.routes.ts
  app.config.ts

pages/ guarda as telas roteadas — cada arquivo aqui corresponde a uma URL do app (mais sobre isso na Aula de Roteamento).

components/ guarda peças reutilizáveis que aparecem em mais de um lugar — o cabeçalho, o card de filme, o dropdown customizado.

services/ guarda a lógica que não é visual: autenticação, listas de filmes, tema.

Dúvidas comuns

Convenção de nomes

Repare que nenhum arquivo termina em .component.ts — é a convenção mais recente do Angular CLI, a mesma que usamos neste template.