Para obter o máximo desses cursos, você deve ter um conhecimento básico de HTML e CSS. É suficiente ser capaz de reconhecer o código HTML e CSS, e ser capaz de fazer pequenos acréscimos e alterações conforme as instruções dos exercícios. Entenda que ensinar esses conceitos está além do escopo deste curso. Se necessário, você pode encontrar um reforço sobre HTML aqui e sobre CSS aqui.
Para completar os exemplos de código incluídos nestes cursos, estaremos usando Glitch. Glitch é um editor de código online que permite criar e visualizar sites sem a necessidade de instalar nada no seu computador. Também permite que você crie um servidor, tudo dentro da interface do Glitch.
A caixa vermelha acima indica o editor online onde você digitará HTML e CSS. A caixa verde indica o botão que o levará para a versão online da página que você está criando. A caixa amarela é o botão que permite criar uma cópia deste projeto e editá-lo. A caixa azul indica os arquivos que você tem disponíveis. Na pasta de assets, você pode encontrar suas imagens.
Ao longo desses cursos, você precisará de várias imagens para completar os exercícios. Todas as imagens de que você precisa para concluir esses cursos estão contidas em nossos projetos Glitch. Para visualizar as imagens em seu projeto, clique na entrada de ativos na lista de arquivos no lado esquerdo do editor de Glitch. Para obter o link de qualquer imagem, selecione a imagem na lista de ativos no lado direito. Clique no botão “copiar” ao lado do URL no pop-up que aparece. Você pode usar esse link em qualquer lugar em que uma imagem seja necessária.
Neste curso, começaremos com uma página HTML básica. Criamos um projeto vazio no Glitch contendo algumas imagens, o código do servidor que você precisará mais tarde e um arquivo index.html com um título e uma única imagem.
Abra esse projeto para começar. Clique no botão “Remix to edit” no lado superior direito para criar um novo projeto que você pode editar. Você pode continuar a usar este editor para este e futuros cursos. Cada curso futuro também lhe dará a oportunidade de começar com uma versão de referência da solução até aquele ponto.
Você não precisa usar o Glitch para concluir esses treinamentos. No entanto, parte do código necessário para completar os exercícios está contido apenas nos exemplos de Glitch. Se desejar usar outro editor, ainda pode ser necessário usar os exemplos de Glitch para encontrar este código.