Programa Desenvolve Boticário 2023

Semana 1 - Básico de HTML e CSS

• Aprenda o que é o HTML e o CSS
• Entenda a estrutura básica de um arquivo HTML
• Utilize o navegador para inspecionar elementos
• Aprenda a definir estilos para elementos usando o CSS
• Conheça reset.css e o posicionamento pelo CSS
• Entenda a diferença entre inline e block
• Lide com bordas e pseudo-classes CSS

Semana 2 - Formulários e tabelas, avançando com CSS

• Crie formulários complexos
• Trabalhe com campos para celulares
• Apresente informações em tabelas
• Use estilos para formulários, campos e tabelas
• Entenda a hierarquia no CSS
• Trabalhe com transformações e transições
• Importe conteúdo externo na sua página HTML, como fontes, vídeos e mapas
• Conheça pseudo-classes e pseudo-elementos
• Use seletores de CSS avançados
• Saiba como lidar com opacidade e sombra
• Entenda sobre o Viewport e design responsivo

Semana 3 - Flexbox, semântica do HTML e responsividade

• Aprenda a famosa especificação flexible box para posicionar seus elementos na página
• Entenda as diversas propriedades do flexbox e como usá-las
• Entenda como as propriedades do flexbox substituem float, inline e inline-block
• Elabore um site responsivo com flexbox
• Melhore a manutenção de códigos com variáveis CSS.
• Escreva códigos semânticos que ajudam na acessibilidade e SEO.
• Aprenda a lidar com adaptação de diferentes layouts.
• Aprimore seu conhecimento de responsividade.

Semana 4 - Figma

Construindo o layout do seu site mobile

• Como fazer um Sitemap
• Conceitos básicos de criação de um site mobile
• Conceitos e diferenças entre UX e UI
• Para saber mais: UX no duplo diamante
• Aprenda a construir layouts dentro da ferramenta do Figma
• Heurísticas de Nielsen
• Aprenda a prototipar sites com alta fidelidade

Conhecendo componentes da interface

• Aprenda a criar componentes de elementos
• Entenda como criar variações de componentes
• Saiba como entregar produtos digitais para pessoas que trabalham com desenvolvimento
• Entenda a importância dos componentes para padronização de projetos
• Aprenda a criar interfaces padronizadas de forma ágil e automatizada

Semana 5 - Figma

Projete sites para diversas telas

• Como projetar interfaces responsivas
• Criar um grid para desktop e aplicamos no nosso layout
• Ferramenta de inspecionar elementos
• Conhecimento sobre entregas para times de desenvolvimento

Design System: projetando elementos

• O que são Design Systems?
• Modelos diferentes de Design Systems e de equipes
• Nomeação de Design Tokens
• Escolhas visuais de produtos digitais
• Fundamentos de um Design System

Semana 6 - HTTP

Entendendo a web por baixo dos panos

• Entenda os detalhes do protocolo HTTP
• Saiba quando usar GET e POST
• Estude sobre segurança na web e o HTTPS
• A web stateful e a web stateless
• Conheça as melhorias do HTTP/2

Semana 8 - Javascript

Pratique lógica de programação

• Programação com JavaScript no seu Navegador
• Variáveis e seu uso
• Repita tarefas com laços, loops, fors e whiles

Semana 9

JavaScript e HTML: pratique lógica com desenhos, animações e um jogo

• Continue a praticar lógica com JavaScript
• Use e abuse de funções para facilitar seu trabalho
• Conheça o Canvas para gerar desenhos e animações
• Revise conceitos importantes na programação

Arquitetura de computadores: por trás de como seu programa funciona

• Entenda como o computador lê e executa o seu programa
• Aprenda como funcionam os principais componentes do seu computador
• Saiba como o computador executa vários programas ao mesmo tempo
• Entenda as limitações do seu computador para criar soluções mais efetivas
• Veja como os dados do seu programa são armazenados na memória

Semana 10

JavaScript: tipos, variáveis e funções

• O que são funções, pequenos trechos de código que podem ser executados uma ou mais vezes.
• As vantagens de se usar uma função, pois com elas conseguimos deixar o código mais curto e mais legível, facilitando a manutenção.
• Como retornar informações da função, utilizando o return, lembrando que o console.log() apenas mostra a informação no terminal e não para outras partes do código.
• A utilidade dos argumentos, já que com eles podemos passar variáveis para as funções poderem usar os valores.
• Que com o hoisting o JavaScript analisa todo o código procurando por variáveis declaradas com var e funções para trazer tais declarações para o início do código.
• Expressões de função, uma maneira diferente de montar funções usando variáveis do tipo const e chamando-as pelo nome. Lembrando que é necessário que o programa passe pela variável antes de podermos chamá-la, já que não há suporte à hoisting.
• Arrow function, uma função declarada de maneira mais compacta usando uma const. A arrow function também não tem suporte à hoisting.

JavaScript: Arrays

• Aprenda o que são arrays e porque são importantes
• Veja como alterar arrays com os métodos do JS
• Entenda o que são laços de repetição e como usá-los
• Modifique arrays utilizando métodos do JS moderno (ES6 em diante)

Semana 11

JavaScript: Introdução a Programação Orientada a Objetos

• Aprenda o que são objetos e por que são importantes
• Veja como acessar dados em um objeto, alterar e adicionar com métodos do JS
• Entenda o que são propriedades e métodos de um objeto
• Crie objetos a partir de funções construtoras
• Entenda o conceito de protótipos em JavaScript

Semana 12

JavaScript: Crie páginas dinâmicas para WEB

• Identificar os papéis de cada tecnologia da Web para construção de páginas
• Associar o JavaScript com HTML através do DOM
• Implementar funções com JavaScript
• Investigar possibilidades de resolução de problemas de código
• Selecionar operadores lógicos adequados para diferentes situações
• Produzir soluções simples para páginas dinâmicas

JavaScript: Manipulando o DOM

• Entenda a interação do JavaScript com HTML e CSS.
• Utilize o JavaScript em uma página real
• Aprenda a tornar uma página dinâmica
• Manipule dados, eventos e elementos com JavaScript
• Entenda como o JavaScript trabalha
• Explore, crie e declare funções no JavaScript

Semana 13

Git e GitHub: repositório, commit e versões

• Entenda as diferenças entre Git e GitHub
• Aprenda os principais comandos usados no dia a dia nesta ferramenta
• Saiba como controlar as versões de seus projetos
• Descubra como criar estratégias de ramificações
• Saiba como navegar no tempo através do restore

JavaScript na Web: validação de Formulários e HTML5

• Valide formulários utilizando as ferramentas do próprio HTML5
• Crie suas próprias validações customizadas utilizando técnicas atuais com JavaScript
• Aprenda como preencher campos de endereço automaticamente com requisições à API da ViaCEP
• Aplique uma máscara monetária em campos de preço

Semana 14

JavaScript: consumindo e tratando dados de uma API

• Entenda como funciona o JavaScript assíncrono
• Consuma a API do ViaCEP com o fetch API
• Conheça as Promises e seus métodos
• Saiba como utilizar async await para criar funções assíncronas
• Trate possíveis erros de requisição retornados da API
• Aprenda a tornar uma página de formulário estática em dinâmica

JS na web: CRUD com JavaScript assíncrono

• Crie um CRUD utilizando o método fetch e os verbos HTTP
• Aprenda a consumir dados de uma API e exibir no seu front-end
• Entenda como utilizar o método fetch para consumir dados de uma API
• Manipule os verbos HTTP através do método fetch
• Aprenda como funcionam as promises no JavaScript

Semana 15

SQL com MySQL: manipule e consulte dados

• Saiba instalar e acessar o banco de dados MySQL
• Realize consultas com SELECT e filtre com WHERE
• Adicionando dados no banco com o INSERT
• Atualize e apague dados com UPDATE e DELETE
• Estruture suas tabelas com CREATE TABLE e ALTER TABLE

Consultas SQL: avançando no SQL com MySQL

• Pagine seus dados com LIMIT
• Filtre consultas com HAVING
• Entenda a diferença entre o LEFT e RIGHT JOIN
• Saiba usar Sub-Queries
• Use funções do MySQL
• Ordene os seus dados usando o ORDER BY
• Agrupe dados com GROUP BY