Fundamentals

Conceitos fundamentais

A estrutura de pastas

A forma como você organiza seu código não importará muito no funcionamento da aplicação, desde que você referencie os arquivos corretamente. Por outro lado, a forma como você organiza seu código influencia muito na leitura e entendimento da aplicação para o desenvolvedor, e por isso influencia muito na manutenibilidade da mesma.

Dessa forma nós sugerimos organizar seu código da seguinte forma:

[root]/
  components/
  controllers/
  utils/
  index.html
  index.js

A pasta "[root]"

Essa é sua pasta raiz onde ficarão os arquivos de sua aplicação Front-End (ex: assets, ou public). Considerando que seu projeto envolva uma parte Back-End e outra Front-End, você terá uma pasta específica para o Front-End, em outros casos pode ser a própria pasta rais do projeto.

A pasta "components"

Aqui FICARÃO nossos componentes de interface.

A pasta "controllers"

Aqui ficarão nossos controladores de páginas.

PS: Fica esquisito em português né? Mas são nossas controllers.

A pasta "utils"

Aqui ficarão nossos utilitários.

O arquivo "index.html"

É o HTML de sua página.

Aqui não tratamos de desenvolver aplicações SPA (como Angular, AngularJS, Ember ou Vue.js). Portanto, consideramos que cada página de sua aplicação utilizará a estrutura proposta.

O arquivo "index.js"

O arquivo JavaScript de inicialização de sua aplicação. Mais à frente você verá que isso não é obrigatório, mas é sempre bom ter um ponto de inicialização, e se você precisar, esse será o recomendado.

TODO: Terminar