HTML5, CSS3 e Javascript na prática

HTML5, CSS3 e Javascript na prática

Sobre o Curso

Esse curso é voltado para o público iniciante! Se você está iniciando os estudos ou possui interesse em aprender sobre desenvolvimento Frontend, vem comigo aprender a tecnologia base pro desenvolvimento...

Requisitos

Lógica de Programação

Introdução

smart_displayApresentação do curso

HTML5

smart_displayO que é HTML?
smart_displayO que são Tags?
smart_displayHead e Body
smart_displayMeta Tags
smart_displayTítulo e subtítulos
smart_displayTextos e mais textos...
smart_displayComentários
smart_displayDivisão no código
smart_displayListas
smart_displayLink
smart_displayImagens
smart_displayFormulário
smart_displayInput
smart_displayTabela
smart_displayÁudio e Vídeo
smart_displayLink e Script
smart_displayOnde chamar meu arquivo Javascript?
smart_displaySemântica no HTML

CSS3

smart_displayO que é CSS?
smart_displaySintaxe
smart_displayFormas de aplicar o CSS
smart_displayEspecificidade
smart_displayBox Model
smart_displayFonts
smart_displayWidth & Height
smart_displayUnidades #01
smart_displayUnidades #02
smart_displayBorder & border-radius
smart_displayBackground
smart_displayMargin & Padding
smart_displayDisplay
smart_displayPosition
smart_displayFloat & Overflow
smart_displayBox-shadow & Opacity
smart_displayGradient
smart_displayPseudo-Classes #01
smart_displayPseudo-Classes #02
smart_displayComentários
smart_displayVariáveis
smart_displayReset (Dica)

FlexBox

smart_displayConceitos do FlexBox
smart_displayAlign-items & justify-content
smart_displayFlex-wrap & flex-direction
smart_displayFlex-flow & align-content
smart_displayTrabalhando com os Flex Items

Portfólio - Projeto #01

smart_displayIniciando o projeto
smart_displayImportando fonts externas e ícones
smart_displayCriando estrutura do Header
smart_displayCriando estrutura do conteúdo principal
smart_displayCriando estrutura do Footer
smart_displayComeçando as estilizações
smart_displayEstilizando Header
smart_displayEstilizando Footer
smart_displayEstilizando conteúdo principal #01
smart_displayEstilizando conteúdo principal #02
smart_displayEstilizando conteúdo principal #03

Javascript: A base

smart_displayO que é Javascript?
smart_displayRecado importante
smart_displayComo executar JS
smart_displayCodeRunner
smart_displayVariáveis
smart_displayEscopo no JS
smart_displayConcatenação
smart_displayOperadores aritméticos
smart_displayOperadores lógicos
smart_displayOperadores de comparação
smart_displayIgual e estritamente igual
smart_displayIf
smart_displayWhile
smart_displayFor
smart_displayComentários
smart_displayFunções

Javascript: Manipulando a DOM

smart_displayO que é a DOM?
smart_displayO objeto Console
smart_displayAlert(), prompt() & confirm()
smart_displaygetElementById() & getElementsByClassName()
smart_displaygetElementByName() & getElementsByTagName()
smart_displayquerySelector() & querySelectorAll()
smart_displayInnerHTML
smart_displayClassList
smart_displayStyle
smart_displaycreateElement
smart_displayAppendChild() & RemoveChild()
smart_displaygetAttribute(), setAttribute() & removeAttribute()
smart_displayChildNod & parentNode
smart_displayOnclick
smart_displayOnmouseover & Onmouseout
smart_displayOnload
smart_displayOnsubmit
smart_displayAddEventListener

DevConverter - Projeto #02

smart_displayApresentação do projeto
smart_displayCriando estrutura de pastas
smart_displayImportando a font
smart_displayCriando o HTML do projeto
smart_displayCriando reset do CSS
smart_displayEstilizando Header e Footer
smart_displayEstilizando o conteúdo principal
smart_displayAdicionando Javascript
smart_displayCriando função para Converter moedas
smart_displayAnimando resposta

GuessNumber - Projeto #03

smart_displayEstrutura do projeto
smart_displayEstrutura do HTML
smart_displayIniciando estilizações
smart_displayEstilizando form
smart_displayEstilizando box de resultados
smart_displayEstilos dinâmicos
smart_displayIniciando o Javascript do projeto
smart_displayLógica principal da aplicação
smart_displayCriando funcionalidades e melhorias
smart_displayMelhorando função updateAttempts()

StarDevs - Projeto #04

smart_displayApresentando o projeto
smart_displayEstrutura do projeto
smart_displayEstrutura do HTML
smart_displayEstilizando Header e Cards
smart_displayEstilizando botão e texto
smart_displayIniciando JS e conhecendo a API
smart_displayFazendo requisição para a API
smart_displayCriando função principal
smart_displayFunção para carregar frases

GoTasks - Projeto #05

smart_displayApresentação do projeto
smart_displayEstrutura do projeto
smart_displayCriando tabela
smart_displayCriando modal
smart_displayIniciando estilizações
smart_displayEstilizando tabela
smart_displayEstilizando modal
smart_displayIniciando JS
smart_displaySalvando tarefa no LocalStorage
smart_displayPegando tarefas do LocalStorage e formatando data
smart_displayAlterando estrutura do Js
smart_displayAdicionando tarefas na tabela
smart_displayRemovendo tarefas e criando função de Reload
smart_displayCriando Alert de erro

NFT Card (Desafio Frontend Mentor) - Projeto #06

smart_displayConhecendo o projeto e a plataforma
smart_displayCriando HTML do projeto
smart_displayEstilizando projeto

R$ 30,00

R$ 35,00-14%

Comprar este curso

Este curso inclui:

  • Video aulas: 137
  • Carga horária: 20h37
  • Certificado validado
  • Recursos adicionais

Instrutor(a):

Luis Antonio Souza Silva

4 cursos417 alunosApaixonado por desenvolvimento de softwares, estudo programação desde os 15 anos, sempre com ênfase em Desenvolvimento Frontend. Sou técnico em informática e tecnólogo em Sistemas para Internet.


- YT: https://www.youtube.com/c/DevCHICO
- IG: https://www.instagram.com/dev.