Descrição
O curso “Destrava Frontend 🔓” é voltado para jovens e adultos que almejam uma vaga de Desenvolvedor Web Frontend no mercado de trabalho da programação. Ao longo do treinamento você aprenderá a programar em 12 diferentes linguagens e frameworks, ficando apto a criar sites Profissionais do zero.
Ao longo do Curso você Aprenderá a Programar com as mais variadas Linguagens, Bibliotecas e Frameworks do Mercado de Trabalho:
🔸 HTML: Linguagem de marcação; 🔸CSS: Linguagem de estilização; 🔸JavaScript: Linguagem de programação; 🔸Bootstrap: Framework CSS para estilização rápida; 🔸React: Biblioteca JS para criação de interfaces de usuário; 🔸Three JS: Biblioteca JS para criação e manipulação de objetos 3D animados. 🔸VUE: Framework JS para criação de Apps de página única; 🔸Next JS: Suporte backend ao React; 🔸TypeScript: Estende o JS de com uma tipagem mais estática; 🔸jQuery: Biblioteca JS que facilita a interação com o HTML; 🔸Angular: Framework JS; 🔸Flexbox: Modelo de layout do css;
Todos os módulos possuem Material Didático Exclusivo 📚
O curso possui Suporte Presencial no Campus da Codi Academy e virtual através do grupos exclusivo no Whatsapp ⚙
Além da parte Teórica, você aprenderá a desenvolver práticas para ver como cada linguagem, biblioteca e framework interagem entre si. Confira algumas imagens de práticas desenvolvidas ao longo do curso:
Matricule-se agora e Destrave o Desenvolvedor Frontend que há dentro de você! 🔓🚀
Course Content
- Download dos Materiais
- Aula 1: Introdução ao HTML
- Aula 2: Hello World
- Aula 3: Títulos
- Aula 4: Parágrafos
- Aula 5: Formatação de Texto
- Aula 6: Links
- Aula 7: Imagens
- Aula 8: Listas
- Aula 9: Formulários (parte 1)
- Aula 10: Formulários (parte 2)
- Aula 11: Tabelas
- Aula 12: Áudio
- Aula 13: Vídeo
- Aula 14: Tags importantes
- Aulão de Revisão
- HTML | Prova
- P1: Criando a Landing Page da Netflix
- P2.1: Criando um Site Completo (parte 1)
- P2.2: Criando um Site Completo (parte 2)
- P2.3: Criando um Site Completo (parte 3)
- P3.1: Criando o Youtube (parte 1 HTML)
- P3.2: Criando o Youtube (parte 1 CSS)
- P3.3: Criando o Youtube (parte 2 HTML)
- P3.4: Criando o Youtube (parte 2 CSS)
- P3.5: Criando o Youtube (parte 3 HTML)
- P3.6: Criando o Youtube (parte 3 CSS)
- P4: Aulão Criando o Google
- P5.1: Criando o Twitter (parte 1)
- P5.2: Criando o Twitter (parte 2)
- P6.1: Criando o Linkedin (introdução)
- P6.2: Criando o Linkedin (Header)
- P6.3: Criando o Linkedin (Sidebar)
- P6.4: Criando o Linkedin (Input)
- P6.5: Criando o Linkedin (Posts)
- P6.6: Criando o Linkedin (Widgets)
- Método Pomodoro
- Aula 1: Variáveis
- Aula 2: Operadores Aritméticos
- Aula 3: Operadores Condicionais
- Aula 4: IF e Else
- Aula 5: Lógica Booleana
- Aula 6: Funções
- Aula 7: Objetos
- Aula 8: Métodos
- Aula 9: While
- Aula 10: Continue e Break
- Aula 11: For
- Aula 12: Arrays
- Aula 13: Operações com Arrays
- Aula 14: Matrizes
- Aulão de Revisão
- Aula 15: Conceitos Avançados (parte 1)
- Aula 16: Conceitos Avançados (parte 2)
- JavaScript | Prova
- P1.1 Snake: Introdução
- P1.2 Snake: Função jogo()
- P1.3 Snake: Programando a Cobra
- P1.4 Snake: Comida
- P2.1 Flappy Bird: Introdução
- P2.2 Flappy Bird: Cenário
- P2.3 Flappy Bird: Cenário
- P2.4 Flappy Bird: Mecânica
- P3.1 Codi Memory: Introdução
- P3.2 Codi Memory: Criando a Tela de Jogo
- P3.3 Codi Memory: Revelando Cards
- P3.4 Codi Memory: Conferindo Pares
- P4.1 Dino: Introdução
- P4.2 Dino: Pulo
- P4.3 Dino: Obstáculos
- P5.1 Notefy: Introdução
- P5.2 Notefy: Lógica
- P5.3 Notefy: Memória
- P6: Recriando a Netflix
- P7: Recriando o TikTok
- Aula 1: Introdução
- Aula 2: Hello World
- Aula 3: Grid
- Aula 4: Componentes: Botões
- Aula 5: Componentes: Menu Suspenso
- Aula 6: Componentes: Carrossel
- Aula 7: Portfólio: Introdução
- Aula 8: Portfólio: Cabeçalho
- Aula 9: Portfólio: About
- Aula 10: Portfólio: Serviços
- Aula 11: Portfólio: Ajusta da Navbar
- Aula 12: Portfólio: Seção projetos
- Aula 13: Portfólio: Contato
- Aula 14: Portfólio: Rodapé e Ajustes
- Bootstrap | Prova
- Aula 0: Intensivão
- Aula 1: Introdução
- Aula 2: Hello World
- Aula 3: JSX
- Aula 4: Planejamentos de Componentes
- Aula 5: Criando Componentes
- Aula 6: Estilizando Componentes
- Aula 7: Hooks (parte 1)
- Aula 8: Hooks (parte 2)
- Aula 9: Props
- Aula 10: Criando Itens
- Aula 11: Mostrando e Estilizando Itens
- Aula 12: Criando a CartPage
- Aula 13: Atualizando Itens do Carrinho
- Aula 14: Estilizando o Carrinho
- P1: Quiz com React
- P2: Revisão do React + Vite
- P3: Lidando com eventos no React
- P4: Divulgação de vagas de emprego – Projeto React
- P5: Tela de Login – Projeto React
- P6: Landing Page para carros – Projeto React
- P7: Consumindo uma API do Backend, no React
- React.Js | Prova
- Aula 1: Introdução
- Aula 2: Instâncias
- Aula 3: Condicionais
- Aula 4: Loops
- Aula 5: Manipulação de Eventos
- Aula 6: Métodos
- Aula 7: Slider
- Aula 8: Componentes: Introdução
- Aula 9: Componentes: Modelo XT
- Aula 10: Componentes: Raiz única
- Aula 11: Props
- Aula 12: Avançando em Props
- Aula 13: Avançando em Props (parte 2)
- Aula 14: Componentes Globais e Locais
- Vue.js | Prova
- Aula 1: Hello World
- Aula 2 Navegando entre Páginas
- Aula 3: Passando Dados entre Páginas
- Aula 4: Recuperando Dados
- Aula 5: Mascarando URLS com Express
- Aula 6: Estilizando com CSS
- Aula 7: Estilizando com Bootstrap
- TP1.1: Apresentação da prática
- TP1.2: Como criar um layout compartilhado em Next.JS
- TP1.3: Como criar uma barra de navegação personalizada em Next JS
- TP1.4: Como criar uma rota de API em NextJS
- TP1.5: Como exibir caracteres na página inicial
- TP1.6: O que é o App Router em Next.js?
- TP1.7: Como criar uma página de maneira dinâmica
- TP1.8: Como criar rotas de UI dinâmicas em Next.js
- TP1.9: Como construir a seção de questionário
- TP.10: Criando uma rota API dinâmica para perguntas e respostas do quiz
- TP.11: Conclusão
- Next.js | Prova
- Aula 1: Introdução
- Aula 2: Variáveis
- Aula 3: Funções
- Aula 4: Prática 1: Sistema de E-commerce
- Aula 5: Desestruturação
- Aula 6: Generics
- Aula 7: Introdução as Classes
- Aula 8: Pratica II: Sistema de e-commerce
- Aula 9: Encapsulamento de Dados
- Aula 10: Classes (Get e Set)
- Aula 11: Classes (Somente Leitura e Estático)
- Aula 12: Questões de Recrutamento
- Typescript | Prova
- Aula 1: Introdução
- Aula 2: Preparando o documento
- Aula 3: HTML e texto
- Aula 4: Selecionando pelo ID
- Aula 5: Selecionando pela Classe
- Aula 6: Selecionando Inputs
- Aula 7: Busca
- Aula 8: Primeiro, Último, Próximo e Anterior
- Aula 9: Parentes
- Aula 10: Evento Click
- Aula 11: Delegação de eventos
- Aula 12: Evento Change
- Aula 13: Keydown e Keyup
- Aula 14: Previnindo Default
- Aula 15: Limpeza rápida
- Aula 16: Criando itens dinamicamente
- Aula 17: Removendo elementos
- Aula 18: Visibilidade da seção
- Aula 19: Fade e slide
- Aula 20: Animação
- Aula 21: AJAX
- Aula 22: Carregando JSON
- Aula 23: Post Calls
- Aula 24: Formulário CheckBox
- Aula 25: Postando o fomulário
- Prova | jQuery
Instructors
🎓 Graduando em Engenharia Computacional pela UFJF (Universidade Federal de Juiz de Fora) 📝 Professor de Física da Rede Apogeu 📗 Tutor de Planilhas Eletrônicas (UFJF) 📒 Tutor de Introdução ao Linux (UFJF) 📘 Tutor de Banco de Dados (UFJF) 🎮 Desenvolvedor de Games 🕹 Professor e Gestor da Academia Gamer