doers

*É melhor algo feito, do que algo perfeito ! *

Essa é uma fraze de uma pessoa bem "doer", mas é verdade, é preferível que faça algo pequeno mas faça, do que tentar dar um grande salto e depois parar.

Pensando nas dificuldades que se encontra na hora de codar, eu fiz aqui um passo a passo para ser seguido pra que seu projeto ganhe vida, e essa é só uma forma que você pode adotar para faze-lo do inicio ao fim sem travar.

Analize do projeto.

Quando fizer a analize tente entender e anote suas dúvidas. Se preciso as anote para que na hora de codar não fique quebrando cabeça com o que você pode ou não fazer.

Tirar as dúvidas com o designer, caso tenha um.

Se necessário quebre o projeto em componentes,
Coisas que possam ser reaproveitadas pois são repetidas, talvez você economize boas linhas de código fazendo essas partes em uma folha de css global por exemplo.

Desenhe estrutura basica que o projeto vai ter como planejamento.
Pensar em blocos é mais fácil

Perceba como um objeto pode ter várias partes, assim já tendo a vizualização planejada do que você deve fazer para codar fica bem mais fácil.

Criar a estrutura base

Criar a estrutura de pastas

Observe que tudo que não for o index ou readme, fica na pasta src com suas respectivas pastas onde serão usadas no projeto.
A estrutura de pastas é muito importante para que você não se perca no meio.

Criar o HTML

Nessa parte já se começa a codificar

Não tem problema em criar ele e depois mudar, talvez alguma div não se comportou como você planejou, talvez houve algo que você deixou passar , você não precisa ter um planejamento perfeito antes de começar, mas não deixe de planejar o que será feito.

Criar o CSS

Criar arquivo de reset.css para zerar margens e paddings e outras coisas globais.
Um pra animações, outro para estrutura dos elementos, um para objetos comuns.
Dependerá do seu projeto e do seu tamanho , mas tenha folhas de codigo css separadas para cada tarefa, ao invez de fazer uma folha gigantesca.

criar o arquivo de style.css, é mais intuitivo criar de cima para baixo de acordo com a ordem dos elementos que você irá fazer.

criar o JS

Primeiro pensar na lógica do código para depois ir para ele
Se você estiver seguindo alguem e tiver errado, tente entender a lógica, não tente arrumar e escutar a pessoa.

Finalizando MVP

uma espécie de versão beta, pra dar vida ao projeto e depois ir fazendo melhorias.
Refatorando e etc.
Assim seu projeto ganha vida rapidamente e você já conseguirá ânimo para ir para o próximo ou melhora-lo.