40 HORAS

CERTIFICADO DE CONCLUSÃO

AULAS PRÁTICAS

HÁ 12 ANOS NO MERCADO

Com o Curso de Front End I - HTML5, CSS3 e JavaScript você será capaz de:

  • Criar layouts incríveis e interativos de forma simples, utilizando HTML5, CSS3 e JavaScript.

André Oliveira

Venha fazer o curso de Front End I - HTML5, CSS3 e JavaScript com André Oliveira. Graduado em Análise e Desenvolvimento de Sistemas e Pós Graduado em Programação Orientada a Objeto em Java. Trabalha como Prof. Universitário na Uncisal, nos Cursos de ADS e Sistemas para Internet. Desenvolvedor Web e Mobile, apaixonado por códigos e linguagens de programação como JavaScipt, Phyton, Ruby e Java...

Assuntos interessantes que você irá aprender:

  • Sintaxe/Semâtica
  • Identação de Código
  • HTML 5
  • CSS 3
  • Chrome DevTools
  • Box Model
  • Box Sizing
  • Responsividade
  • Bootstrap
  • JavaScript
  • Ajax
  • GitHub Pages.

Conteúdo Completo:

Começando com HTML 5

  • O que é HTML?;
  • Estrutura básica do documento;
  • DOCTYPE e codificação;
  • Primeiras tags: títulos, quebras de linhas e parágrafos;
  • Comentários;
  • Ênfase, importância e marcação;
  • Imagens;
  • Âncoras (links);
  • Elementos estruturais.

Começando com CSS 3

  • O que é CSS;
  • Estilos incorporados e Regras CSS;
  • Estilos em arquivos externos;
  • Seletores de tipo, classe e ID;
  • Agrupando seletores;
  • Seletores descendentes;
  • Seletores de filhos diretos;
  • Cores;
  • Formatação de textos;
  • Inspecionando com Chrome DevTools;
  • Entendendo a propriedade display;
  • Adicionando bordas;
  • Espaçamento interno (padding);
  • Margens de elementos;
  • Box model e a propriedade box-sizing.

Iniciando o projeto do curso

  • Preparando o projeto;
  • Criando o cabeçalho da página;
  • Listas ordenadas e não-ordenadas;
  • Adicionando os planos;
  • Flutuando elementos;
  • Usando pseudo-elementos;
  • Configurando os planos lado a lado com float;
  • Criando um botão;
  • As pseudo-classes :focus e :hover;
  • Reset CSS e Normalize.css.

Web design responsivo

  • O que é Responsive Web Design?;
  • Unidade de medida: pixel;
  • Unidade de medida: percentual;
  • Meta tag viewport;
  • Layout fixo e fluído;
  • Layout responsivo e media queries;
  • Como funciona um sistema de Grid CSS;
  • Sistema de grid do Bootstrap;
  • Ajustando o projeto para usar Grid CSS.

Especificidade, BEM e boas praticas

  • Especificidade do CSS;
  • Caos no CSS: porque uma metodologia é importante?;
  • A Metodologia BEM: seu código escalável;
  • Como usar BEM na prática - parte 1;
  • Como usar BEM na prática - parte 2;
  • Ajustando o projeto do curso com BEM;
  • Mais organização: CSS com Guidelines.

Encerrando o projeto e mais CSS

  • Unidades de medida: em e rem;
  • Ajustando unidades de medida no projeto;
  • Adicionando chamada principal;
  • Adicionando depoimento;
  • Adicionando rodapé;
  • Posicionamento estático e fixo;
  • Posicionamento relativo;
  • Posicionamento absoluto;
  • Adicionando rótulo no plano;
  • Ajustando margem do plano;
  • Adicionando aspas no depoimento;
  • Adicionando o bloco de navegação;
  • Adicionando o menu para telas pequenas;
  • Ajustando o menu para telas médias e grandes;
  • JavaScript Hook: chaveando o menu;
  • Criando um formulário: assinatura de plano;
  • Concluindo o formulário de assinatura de plano;
  • Entendendo as tabelas do HTML;
  • Aplicando estilos em tabelas com CSS;
  • Hospedando a aplicação no gitHub Pages.

Fundamentos do JavaScript

  • Estruturas de controle : IF, ELSE, WHILE, FOR etc..;
  • Funções;
  • Objetos;
  • Eventos;
  • Interação JavaScript + HTML;
  • O que é DOM;
  • O que é Ajax;
  • Como usar Ajax nas minha aplicações.

Próximas Turmas:

  • Como concluimos uma turma recentemente, precisamos ter mais interessados para formarmos a próxima turma.
    Precisamos de um mínimo de 06 participantes por turma, você gostaria de indicar mais alguém?

Convide seus amigos e ganhe desconto na sua matrícula!

Marque seu amigo e peça para ele informar que você o indicou. Quanto mais amigos mais desconto pra você. Para obter o desconto é necessário que seu amigo se matricule em qualquer um de nossos cursos.
Escolha sua rede social e marque já seu amigo.

Solicite um orçamento!