Front-End nivel: Junior
14 cursos
Front-End
1. HTML & CSS {
1.1 - HTML5 e CSS3 parte 1: A primeira página da Web.
1.1.1 - Marcação do primeiro texto.
1.1.2 - Separando o conteúdo e informações.
1.1.3 - Trabalhando com CSS.
1.1.4 - Estilizando imagens.
1.1.5 - Listas e divisões de conteúdo.
1.1.6 - Finalizando a página.
1.2 - HTML5 e CSS3 parte 2: Posicionamento, listas e navegação.
1.2.1 - Criando uma nova página.
1.2.2 - Navegação entre páginas.
1.2.3 - Posicionamento dos elementos.
1.2.4 - A tag section.
1.2.5 - Lidando com bordas.
1.2.6 - Pseudo-calsses CSS.
1.2.7 - Finalizando a página de produtos.
1.3 - HTML5 e CSS3 parte 3: Trabalhando com formulários e tabelas.
1.3.1 - Criando uma nova nova página.
1.3.2 - Começando um formulário.
1.3.3 - Tipos de campos diferentes.
1.3.4 - Melhorando a semântica.
1.3.5 - CSS avançado.
1.3.6 - Estrutura de tabelas.
1.4 - HTML5 e CSS3 parte 4: Avançando no CSS.
1.4.1 - Adaptando a página inicial.
1.4.2 - Conteúdo externo.
1.4.3 - Melhorando o CSS
1.4.4 - Selecionando qualquer coisa.
1.4.5 - Opacidade e sombra.
1.4.6 - Design responsivo.
1.5 - Acessibilidade web parte 1: tornando seu front-end inclusivo.
1.5.1 - HTML e os leitores de tela.
1.5.2 - Atributos lang e alt.
1.5.3 - CSS interfere no leitor de tela?Lista e display: none.
1.5.4 - Um pouco sobre roles e arias.
1.5.5 - Formulário acessível.
}
2. JavaScript a linguagem da Web {
2.1 - JavaScript: primeiros passos com a linguagem.
2.1.1 - Introdução a linguagem.
2.1.2 - Tipos de variáveis.
2.1.3 - Trabalhando com muitos elementos.
2.1.4 - Condicionais e fluxo de execução.
2.1.5 - Iterando sobre coleções.
2.2 - JavaScript: Programando a Orientação a Objetos.
2.2.1 - Repetição de código.
2.2.2 - Adicionando comportamentos.
2.2.3 - Modularizando código.
2.2.4 - Acessando Atributos privados.
2.2.5 - Construtores e estáticos.
2.3 - JavaScript: Interfaces e Herança em Orientação a Objetos.
2.3.1 - Conhecendo o problema do cliente.
2.3.2 - Herança.
2.3.3 - Classes abstratas.
2.3.4 - Sistema interno.
2.3.5 - Interfaces e Duck Type.
}
3. Front end UI {
3.1 - Arquitetura CSS: Descomplicando os problemas.
3.1.1 - Layout base e Estilização de cabeçalho.
3.1.2 - Estilização de Banner e Sobre.
3.1.3 - Estilização das Receitas.
3.1.4 - Estilização do Quem Somos.
3.1.5 - Estilização do rodapé e Responsividade do site.
3.2 - Fundamentos de SEO: Primeiros passos para ranquear seu site na Busca Orgânica.
3.2.1 - Entendendo o Google.
3.2.2 - Diagnóstico de SEO.
3.2.3 - Análise competitiva.
3.2.4 - SEO On Page.
3.2.5 - SEO Off Page.
3.2.6 - Relatórios básicos de resultados.
3.3 - Flexbox: Posicione elementos na tela.
3.3.1 - Introdução ao flexbox e fazendo cabeçalho.
3.3.2 - Fazendo o footer e controlando melhor os elementos.
3.3.3 - Grid principal e limitações do flexbox
3.3.4 - Arrumando os elementos com flex para mobile.
3.3.5 - Mais sobre flexbox & desafios.
3.4 - Layouts Responsivos: Trabalhando com layouts mobile.
3.4.1 - Ferramentas, unidades e imagens.
3.4.2 - Layout mobile e variáveis CSS.
3.4.3 - Particularidades de telas.
3.4.4 - Trabalhando a semântica HTML.
3.4.5 - Evoluindo do mobile ao desktop.
4.5 - CSS Grid: Simplificando layouts.
4.5.1 - Definindo o layout base.
4.5.2 - Criando o layout da seção de destaques.
4.5.3 - Estilizando a seção de populares.
4.5.4 - Estilizando o cabeçalho, menu e rodapé.
4.5.5 - Deixando o site responsivo.
}
4. Sites interativos, integrando o JavaScript ao Navegador{
4.1 - JavaScript para Web: Crie páginas dinâmicas.
4.1.1 - Conhecendo o JavaScript.
4.1.2 - Funções.
4.1.3 - Listas.
4.1.4 - Iretando em listas.
4.1.5 - Eventos e lógicas.
4.2 - Expressões regulares: Capturando textos de forma mágica.
4.2.1 - Começando com Regex.
4.2.2 - Classes de caracteres.
4.2.3 - Encontrando a posição certa com âncoras.
4.2.4 - Trabalhando com grupos.
4.2.5 - Ganancioso ou preguiçoso.
4.2.6 - Usando regex nas diversas linguagens.
4.3 - JavaScript na Web: Validação de Formulários e HTML5.
4.3.1 - Validação com HTML.
4.3.2 - Validações customizadas.
4.3.3 - Mensagens customizadas.
4.3.4 - Validando CPF.
4.3.5 - Conectando com a API ViaCEP
4.3.6 - Aplicação de máscara.
}Projeto de Conclusão
1. Front-end {
1.1 - Introdução e construção do cabeçalho.
1.2 - Painel sobre.
1.3 - Painel palestrantes.
1.4 - Formulário de inscrição.
1.5 - Dotando a página de comportamento.
}