Repositórios

Pra te ajudar a acompanhar o conteúdo, deixamos organizados os commits aqui. Cada um deles mostra exatamente como o código ficou no final daquela aula, então você consegue acompanhar o passo a passo sem complicação.

<aside> <img src="/icons/git_purple.svg" alt="/icons/git_purple.svg" width="40px" />

Commit da aula 01

</aside>

<aside> <img src="/icons/git_purple.svg" alt="/icons/git_purple.svg" width="40px" />

Commit da aula 02

</aside>

<aside> <img src="/icons/git_purple.svg" alt="/icons/git_purple.svg" width="40px" />

Commit da aula 03

</aside>

Os commits também servem como um guia pra conferir se tá tudo certinho ou pra resolver qualquer dúvida que surgir durante o desenvolvimento.


Layout da aplicação

Aqui você encontra o link do Figma com o design da aplicação desenvolvida nessa NLW. Ele vai ser o seu guia visual durante o desenvolvimento, e você pode consultar os detalhes de layout, espaçamentos, cores e outros elementos visuais:


Códigos auxiliares

<aside> ⚠️

Atenção com o editor

</aside>

Se você estiver usando qualquer outro editor de texto para desenvolver o seu código, você vai precisar fazer uma pequena alteração na função updateImageLinks

const updateImageLinks = () => {
  document.querySelectorAll('img').forEach((img) => {
    const src = img.getAttribute("src"); 
    if (src && !src.startsWith("http")) {  
      img.src = `https://raw.githubusercontent.com/maykbrito/my-public-files/main/nlw-19/${src}`;
    }
  });
};