Tech Guide Front End

Front-end

Nivel 1

HTML - Fundamentos: HTML é uma linguagem de marcação que define a estrutura do seu conteúdo. HTML consiste em uma série de elementos que você usa para mostrar algo de uma determinada maneira ou agir de uma certo modo. As tags podem criar um hiperlink de uma palavra ou imagem para outro lugar, podem colocar palavras em itálico, podem aumentar ou diminuir a fonte e assim por diante. Aprender quais tags são necessárias para um HTML básico Criar um parágrafo de texto Exibir uma imagem Conhecer a diferença entre 'h1', 'h2', 'h3', etc Criar um texto com hyperlink Criar um formulário com campos relevantes Criar uma lista de itens ordenada ou não ordenada Criar uma lista de itens dentro de uma lista suspensa (dropdown list) Conectar com um arquivo de CSS Criar uma tabela Adicionar IDs e classes

CSS - Fundamentos: Cascading Style Sheets (CSS) é uma linguagem usada para descrever a apresentação de um documento escrito em uma linguagem de marcação como HTML ou XML. CSS pode ser usado para estilos de texto de documentos muito básicos — por exemplo, para alterar a cor e o tamanho de títulos e links. Ele pode ser usado para criar um layout — por exemplo, transformar uma única coluna de texto em um layout com uma área de conteúdo principal e uma barra lateral para informações relacionadas. Pode até ser usado para efeitos como animações. Aprender a estrutura visual de uma página, com 'margin' e 'padding' Estabelecer o tamanho com 'width' e 'height' Aprender sobre a posição de um elemento ('static', 'relative' ou 'absolute) Aprender sobre o 'display' de exibição de um elemento ('block', 'inline', 'inline-block') Aprender a posicionar imagens em relação ao texto Aprender sobre alinhamento Aprender sobre estilo de fontes Aprender as diferenças e vantagens de usar as diferentes unidades de medida em CSS (%, relativas, etc) Conectar com os elementos (IDs, classes) de um arquivo HTML Alterar características de um elemento quando o mouse passar por cima dele ('hover') Aprender box-sizing Aprender Flexbox Aprender Grid

JavaScript - Fundamentos: JavaScript é a linguagem de programação mais popular do mundo e é uma das principais tecnologias da World Wide Web, juntamente com HTML e CSS. Ela possui tipagem dinâmica, orientação a objetos baseada em protótipos e funções de primeira classe. Ela é multi-paradigma e suporta estilos de programação orientados a eventos, funcionais e imperativos. Conhecer os tipos primitivos Declarar variáveis, considerando a diferença entre 'var', 'let' e 'const' Usar estruturas condicionais ('if', 'else') Conhecer os operadores de atribuição e comparação ('=', '==', '===') Usar estruturas de repetição e laços ('while', 'for') Usar funções, passando parâmetros e argumentos Manipular arrays e listas Aprender o conceito de Orientação a Objetos Fazer um CRUD Obter dados de uma API Fazer chamadas assíncronas usando 'Async/Await', 'Promise', etc

DOM - Fundamentos: O Document Object Model (DOM) é uma interface de programação para documentos web. Ele representa a página para que os programas possam alterar a estrutura, o estilo e o conteúdo do documento. O DOM representa o documento como nós e objetos; dessa forma, linguagens de programação podem interagir com a página. Entender como funciona a árvore do DOM Acessar e manipular elementos do HTML e CSS Acessar os pais e filhos de um elemento Inserir um novo elemento na árvore Remover um elemento da árvore Esperar por um evento em certo elemento da página usando 'addEventListener()' Acessibilidade em Javascript: Acessibilidade Digital é a eliminação de barreiras na Web. O conceito pressupõe que os sites e portais sejam projetados de modo que todas as pessoas possam perceber, entender, navegar e interagir de maneira efetiva com as páginas. Escrever código com acessibilidade em mente

Estratégias de SEO: SEO significa otimização para motores de busca e que diz respeito as estratégias usadas para ranquear um site dentro de mecanismos de busca como o Yahoo, o Bing e, claro, o mais famoso de todos, o Google. Escolher palavras-chave Entender como o Google classifica páginas Conhecer os fatores de rankeamento Fazer Link Building

Design Responsivo: Ajustar suas páginas para o tamanho da tela do usuário Media queries Conhecer o conceito de Mobile first