Curso de HTML, CSS e JavaScript: Praticando com as tecnologias da Web

1.259

Alunos neste curso

Faça esse curso e...

  • Conheça o poder do editor de texto Atom desenvolvido pelo GItHub
  • Aprenda a escrever um HTML mais rápido Emmet
  • Veja como escrever um CSS e HTML mais simples e de fácil manutenção
  • Aprenda a utilizar o básico do Inspecionar Elemento do Firefox
  • Trabalhe com JavaScript puro de forma organizada e produtiva
  • Faça validação de formulários com JavaScript puro
  • Crie elementos na página com JavaScript puro

Conteúdo Detalhado

  1. Começando o projeto e implementando o HTML e CSS do cabeçalho

    • Apresentação do projeto e editor de texto Atom
    • Sendo mais produtivo com Emmet
    • Começando o CSS do cabeçalho e reset.css
    • Colocando um pouco mais de estilo no cabeçalho
    • Finalizando o HTML e CSS do cabeçalho
  2. Começando HTML e CSS dos Cartões

    • Implementando o HTML dos cartões
    • Colocando estilos nos cartões
    • Entendo o comportamento do display inline-block
    • Definindo a cor do cartão com o modificador
    • Criando HTML das bolinhas que definem a cor dos cartões
    • Colocando os estilos nas bolinhas
    • Começando a alinhas as bolinhas
    • Deslocando as bolinhas um pouco pra fora do cartão
  3. Ae! Vamos por a mão no JavaScript

    • Pegando um elemento HTML com JavaScript
    • Adicionando o evento de clique em um elemento HTML
    • Adicionando o evento de clique em todas as bolinhas
    • Trabalhando com atributos personalizados
    • Alterando a cor do cartão conforme usuário clica na bolinha
    • Adicionando feeadback pra última bolinha clicada
    • Menos loop utilizando o borbulhar
  4. Como editar e excluir os cartões com JavaScript

    • Escrevendo o HTML e CSS da opção de remover o cartão
    • Implementando o JavaScript pra remover o cartão
    • Definindo um estilo pro botão de editar
    • Deixando o cartão editável com JavaScript
    • Saindo do estado de edição do cartão
    • Mostrando bolinhas, só quando o mouse estiver sobre o cartão
  5. Implementado HTML, CSS e JavaScritpt pra criar novos cartões

    • Gerando HTML do formulário pra criar um novo cartão
    • Deixando o formulário mais bonito com CSS
    • Implementando a validação do formulário com JavaScript
    • Criando elemento com JavaScript
    • Adicionado estilo e na mensagem de erro
    • Retirando a mensagem de erro quando o usuário digitar no textarea
    • Clonando um cartão e alterando o conteúdo com o texto que usuário escreveu no textarea
    • Opções de mudar a cor, editar e remover o cartão não está funcionando pros cartões criados com JavaScript

Veja o primeiro vídeo

Público alvo

Desenvolvedores que já conhecem javascript e querem se aprofundar no uso da linguagem no dia a dia através de um projeto real.

Nível de Dificuldade

Intermediário

Já é aluno?

Começar o Curso

Sabe quando você pode começar? Agora!

  • 839 cursos

    Cursos de programação, design, UX, agilidade, transformação digital, mobile, front-end, infraestrutura e mais.

  • Certificado de participação

    Certificado de que assistiu o curso e finalizou as atividades

  • Todas as formações

    Guias de estudo completo para você iniciar em uma nova área de tecnologia

  • Projeto avaliado pelos instrutores

    Projeto práticos para entrega e avaliação dos professores da Alura com certificado de aprovação diferenciado

  • Acesso à Alura Start

    Cursos de introdução a tecnologia através de games, apps e ciência

  • Acesso à Alura Língua

    Reforço online de inglês e espanhol para aprimorar seu conhecimento

Premium

  • 839 cursos

    Cursos de programação, design, UX, agilidade, transformação digital, mobile, front-end, infraestrutura e mais.

  • Certificado de participação

    Certificado de que assistiu o curso e finalizou as atividades

  • Todas as formações

    Guias de estudo completo para você iniciar em uma nova área de tecnologia

  • Projeto avaliado pelos instrutores

    Projeto práticos para entrega e avaliação dos professores da Alura com certificado de aprovação diferenciado

  • Acesso à Alura Start

    Cursos de introdução a tecnologia através de games, apps e ciência

  • Acesso à Alura Língua

    Reforço online de inglês e espanhol para aprimorar seu conhecimento

12X
R$75
à vista R$900
Matricule-se

Premium Plus

  • 839 cursos

    Cursos de programação, design, UX, agilidade, transformação digital, mobile, front-end, infraestrutura e mais.

  • Certificado de participação

    Certificado de que assistiu o curso e finalizou as atividades

  • Todas as formações

    Guias de estudo completo para você iniciar em uma nova área de tecnologia

  • Projeto avaliado pelos instrutores

    Projeto práticos para entrega e avaliação dos professores da Alura com certificado de aprovação diferenciado

  • Acesso à Alura Start

    Cursos de introdução a tecnologia através de games, apps e ciência

  • Acesso à Alura Língua

    Reforço online de inglês e espanhol para aprimorar seu conhecimento

12X
R$100
à vista R$1.200
Matricule-se

Max

  • 839 cursos

    Cursos de programação, design, UX, agilidade, transformação digital, mobile, front-end, infraestrutura e mais.

  • Certificado de participação

    Certificado de que assistiu o curso e finalizou as atividades

  • Todas as formações

    Guias de estudo completo para você iniciar em uma nova área de tecnologia

  • Projeto avaliado pelos instrutores

    Projeto práticos para entrega e avaliação dos professores da Alura com certificado de aprovação diferenciado

  • Acesso à Alura Start

    Cursos de introdução a tecnologia através de games, apps e ciência

  • Acesso à Alura Língua

    Reforço online de inglês e espanhol para aprimorar seu conhecimento

12X
R$120
à vista R$1.440
Matricule-se
Acesso por 1 ano
Estude 24h/dia onde e quando quiser
Novos cursos toda semana