Bem-vindo ao repositório onde compartilho meu aprendizado e projetos práticos sobre diversas tecnologias. Este repositório contém anotações e exemplos de código das semanas de estudo, com foco em estudo de programação.
- HTML
- CSS
- Lógica de programação
- JavaScript
O objetivo deste repositório é registrar o progresso do meu aprendizado, compartilhando os conceitos, práticas e projetos desenvolvidos ao longo das semanas. Além disso, cada semana inclui exemplos de código aplicados e desafios enfrentados.
- Conceitos principais: Orientações iniciais, conhecendo o VS Code, estruturando páginas.
- Desafios: Uso do VS Code, criação de pastas e arquivos.
- Aprendizados:
- Como baixar e usar as ferramentas que será usada durante o estudo das semanas.
- Familizarizando com a interface do VS Code e criando o primeiro projeto.
- Conceitos principais: Estruturação de páginas com HTML, introdução ao CSS, uso de seletores e propriedades básicas.
- Desafios: Criação de páginas simples com foco na estruturação e estilização básica.
- Aprendizados:
- Como estruturar uma página HTML utilizando as tags principais como
<html>,<head>,<body>,<header>,<footer>, etc. - Aplicação de estilos básicos com CSS, como cores, fontes, margens e padding.
- Uso de seletores CSS para estilizar diferentes elementos, incluindo seletores de classe e ID.
- Introdução ao modelo de caixa do CSS (box model), entendendo como os elementos são dimensionados e dispostos na página.
- Como estruturar uma página HTML utilizando as tags principais como
- Conceitos principais: Exploração de conceitos avançados de HTML e CSS, com foco em layouts responsivos, técnicas de design e otimização de desempenho.
- Desafios: Criação de layouts mais complexos e interativos, utilizando técnicas avançadas de estilização e responsividade.
- Aprendizados:
- Como usar o modelo de layout flexível (Flexbox) para criar designs dinâmicos e adaptáveis.
- Implementação de layouts responsivos utilizando media queries e técnicas de design adaptativo.
- Criação de layouts complexos com CSS Grid, permitindo a construção de designs mais sofisticados e controlados.
- Técnicas de otimização de desempenho, como o uso eficiente de imagens e fontes, além da melhoria da experiência do usuário com animações e transições.
- Mais CSS na prática - Bordas, sombras, pseudo-classes e animações
- Flexbox na prática
- Grid na prática
- Variáveis na prática
- Transform na prática
- Desafio da SEMANA: Site de uma agência de Publicidade
- Conceitos principais: Layouts avançados com Grid e Flexbox, efeitos parallax, media queries, formulários HTML5, tags
<video>e<audio>. - Desafios: Criação de layouts avançados e integração de multimídia com HTML5.
- Aprendizados:
- Como usar
grid-template-areaspara criar layouts complexos e responsivos. - Como aplicar efeitos parallax para criar sites mais interativos.
- Como usar a tag
<audio>e<video>para integrar multimídia aos sites. - Como criar formulários avançados e validar entradas do usuário.
- Como usar
- Conceitos principais: Introdução à lógica de programação, diferenças entre programa, software e algoritmo, tipos primitivos de dados, operações aritméticas, condicionais, laços de repetição, funções, operadores lógicos, vetores e estrutura de algoritmos.
- Desafios: Implementação de algoritmos básicos, cálculos matemáticos em Portugol, e criação de exercícios práticos. Implementação de algoritmos práticos com condicionais, loops, funções parametrizadas e manipulação de vetores.
- Aprendizados:
- Como diferenciar programa, software e algoritmo.
- Como estruturar e implementar algoritmos simples.
- Como utilizar variáveis e tratar erros de tipo e sintaxe.
- Como aplicar operações aritméticas em programação.
- Introdução ao conceito de Input/Output (I/O) e interatividade com o usuário.
- Como utilizar condicionais (se e senao) e operadores lógicos para controle de fluxo.
- Como evitar loops infinitos e implementar laços de repetição como ENQUANTO e PARA.
- Como aplicar operadores de incremento, decremento e módulo em algoritmos.
- Como construir funções parametrizadas e organizar o código com escopo e retorno.
- Como manipular vetores para armazenar e acessar múltiplos valores.
- Hello, World! na prática
- I/O na prática
- Operações aritméticas na prática
- Cálculo de IMC
- Consumo de combustível
- Cálculo de gorjeta
- Cálculo de juros simples
- Cálculo de IMC v2.0
- Autenticador de usuários
- Par ou ímpar?
- Tabuada
- Tabuada v2.0
- Pular linha automaticamente
- Elevar ao quadrado
- Média dos alunos
- Média dos alunos v2.0
- Conceitos principais:
- HTML: Linguagem de marcação usada para estruturar páginas web. 🖋️
- JavaScript: Linguagem de programação usada para tornar as páginas web dinâmicas, com suporte a lógica, loops, variáveis, operadores e funções. 🖥️
- Variáveis: Declaração e uso de variáveis com
var,leteconst. 🔑 - Tipos de Dados:
number,string,boolean. 🔢💬 - Operadores de Comparação e Lógicos:
>,<,==,===,&&,||. ⚖️ - Estruturas Condicionais:
if,else,else if, operador ternário eswitch. 🔄 - Laços de Repetição:
while,for. 🔁 - Funções: Criação e execução de funções, incluindo funções anônimas e arrow functions. 🛠️
- Arrays: Definição, acesso e manipulação de arrays com métodos como
push(),pop(),shift(). 📦 - Manipulação do DOM: Seleção e modificação de elementos HTML via JavaScript. 🎨
- Eventos: Atribuição de eventos a elementos HTML, como o clique de um botão. 🖱️
- Desafios:
- Entender a diferença entre
letevar: Saber quando usar cada um para evitar erros relacionados ao escopo. 🤔 - Manipulação do DOM: Selecionar e alterar elementos HTML usando JavaScript de forma eficiente. 🖼️
- Trabalhar com arrays: Criar, acessar e modificar arrays, além de aprender a usar métodos como
push(),pop(), eshift(). 📚 - Eventos em JavaScript: Atribuir e gerenciar eventos como cliques e interações com o usuário. 🔔
- Entender a diferença entre
- Aprendizados:
- Uso de variáveis: Aprendi a declarar variáveis corretamente, utilizando
leteconstpara garantir um código mais seguro e eficiente. 🔑 - Manipulação do DOM: Compreendi como selecionar elementos HTML e modificar seu conteúdo ou estilo com JavaScript, utilizando
innerHTMLeclassList. 🎨 - Estruturas condicionais e laços de repetição: Aprofundei meus conhecimentos em estruturas de controle, como
if,else,whileefor, para criar lógica de fluxo eficiente. 🔄 - Eventos: Aprendi a atribuir eventos a elementos HTML e gerenciar interações do usuário com o código JavaScript. 🖱️
- Uso de variáveis: Aprendi a declarar variáveis corretamente, utilizando
- Conceitos principais:
- Manipulação Avançada do DOM: Adição e remoção dinâmica de elementos HTML. 🎨
- Eventos: Gerenciamento de eventos de mouse (hover, click, etc.) e teclado (keydown, keyup). 🖱️⌨️
- Iteração Avançada com Arrays: Métodos como
map(),filter(),slice()esplice(). 📊
- Desafios:
- Eventos de Mouse e Teclado: Implementar funcionalidades que dependem de interações do usuário, como cliques de teclado ou animações ao passar o mouse. 🖱️⌨️
- Manipulação Avançada do DOM: Criar e remover elementos dinamicamente para criar interfaces dinâmicas. 🎭
- Iteração com Arrays: Resolver problemas usando métodos como
map(),filter(),splice()eslice(). 📈
- Aprendizados:
- Eventos de Mouse e Teclado: Entendi como capturar e gerenciar eventos, criando interações mais dinâmicas e responsivas. 🖱️⌨️
- Manipulação de Objetos e Arrays: Explorei métodos avançados para transformar e acessar dados de forma mais eficiente. 🛠️📊
- DOM Dinâmico: Consegui adicionar e remover elementos HTML dinamicamente, aprimorando a interatividade das páginas. 🎨
- [Lista To-Do](EM BREVE)
- Criação de uma lista de tarefas em JavaScript, manipulando arrays e DOM.
- Conceitos principais:
- Objetos em JavaScript: Criação e manipulação de objetos, uso de propriedades e métodos. 🧱
- JSON (JavaScript Object Notation): Estrutura de dados leve para troca de informações entre cliente e servidor. 📜
- Manipulação Avançada do DOM: Criação dinâmica de elementos HTML, remoção e atualização de conteúdo. 🎨
- Eventos Avançados: Delegação de eventos, prevenção de comportamento padrão e propagação de eventos. 🔔
- Promises e Async/Await: Controle de operações assíncronas, uso de
then,catchefinally. ⏳ - APIs Fetch: Consumo de APIs RESTful com o método
fetchpara requisições HTTP. 🌐 - Manipulação de Estilos via JavaScript: Alteração de classes, estilos inline e animações dinâmicas. 🎭
- Desafios:
- Trabalhar com objetos e JSON: Criar e manipular objetos complexos e converter dados entre objetos e JSON. 🔄
- Criação dinâmica de elementos: Usar JavaScript para adicionar, remover e modificar elementos diretamente no DOM. 🛠️
- Controle de eventos avançados: Implementar delegação e gerenciar propagação de eventos em elementos HTML. 🔗
- Requisições HTTP com Fetch: Realizar chamadas a APIs externas, manipular respostas e tratar erros. 🌐
- Promises e Async/Await: Entender como lidar com fluxos assíncronos e evitar callbacks aninhados. ⏱️
- Aprendizados:
- Manipulação de objetos e JSON: Entendi como criar objetos complexos, acessar propriedades e converter entre JSON e objetos JavaScript. 🧩
- DOM Dinâmico: Aprendi a criar e manipular elementos HTML de forma dinâmica, possibilitando interfaces mais interativas. 🎨
- Eventos Avançados: Aprofundei conhecimentos em delegação de eventos e prevenção de comportamentos indesejados. 🖱️
- Fetch e Async/Await: Compreendi como realizar requisições HTTP, manipular dados retornados e tratar erros de forma eficiente. 🌐
- Semana 0: Iniciei com orientações, ferramentas usadas nos estudos assim como organização de pastas e arquivos.
- Semana 1: Compreendi os fundamentos de HTML e CSS, aprendendo a estruturar e estilizar páginas web de forma simples e eficaz.
- Semana 2: Aprofundei meus conhecimentos em técnicas avançadas de CSS, como Flexbox e Grid, para criar layouts responsivos e dinâmicos.
- Semana 3: Aprendi a integrar multimídia com HTML5, usando as tags
<video>e<audio>, além de aplicar efeitos interativos como o parallax. - Semana 4: Entendi os conceitos de lógica de programação, como algoritmos, tipos de dados e operações aritméticas, além de praticar com exercícios de programação em Portugol. Compreendi lógica de programação com condicionais, loops, funções parametrizadas e manipulação de vetores
- Semana 5: Aprendi os conceitos iniciais de JavaScript, como variáveis, tipos de dados, operadores, estruturas condicionais e laços de repetição. Aprofundei meus conhecimentos em manipulação de DOM e eventos, além de trabalhar com funções e arrays para criar interatividade nas páginas web.
- Semana 6: Explorei conceitos intermediários de JavaScript, como métodos de arrays, incluindo forEach, para manipular dados de forma eficiente. Aprendi também sobre eventos de mouse, utilizando interações como mousedown, mouseup, mouseenter, mouseleave, mousemove e contextmenu, além de aplicar o método preventDefault para personalizar comportamentos padrão.Também aprendi eventos de teclado como onkeydown e onkeyup
- Semana 7: Aprofundei meus conhecimentos em JavaScript avançado, incluindo manipulação dinâmica do DOM, criação e manipulação de objetos e JSON, controle de eventos avançados, e consumo de APIs RESTful com Fetch e Async/Await.
Você pode entrar em contato comigo através dos seguintes links:
- LinkedIn - Conecte-se comigo no LinkedIn.
- Site Pessoal - Acesse meu portfólio e outros projetos.
- Email - Envie um e-mail diretamente.
Nota: Este repositório está em constante evolução, e novos projetos e aprendizados serão adicionados regularmente.