Programador Full Stack JavaScript em 8 semanas!
Quer aprender a programar e conseguir as melhores vagas no mercado? Nesse super treinamento você vai aprender de forma totalmente prática através de aulas, exercícios e projetos a Programação Web Javascript focada no mercado de trabalho. Você só precisa saber o básico para acessar sites, vídeos, documentos… Você concluirá o curso ao desenvolver um projeto final: um projeto inspirado no Evernote. Dessa maneira você já vai para o mercado de trabalho com um excelente projeto em seu portfólio!
Programador Full Stack JavaScript
Plano De Aulas Para Conclusão Em 8 Semanas!
Semana 1 – Introdução a Web + Dominando o HTML
Dia 1: Introducao a Web
- Seja bem vindo(a) ao módulo Introdução a Web
- O que é a Web e como ela funciona
- Desenvolvedor Frontend, Backend e Full Stack
Dominando o HTML
- Objetivos
- Conhecendo-o-HTML
- Links para a documentação do HTML
- Estrutura de uma página Web
- Tags básicas do HTML
- Listas no HTML
- Exercício Criando uma lista
Dia 2: Dominando o HTML5
- Resolução Criando uma lista
- Organizando nosso código com Divs e Span
- Atributos HTML
- guia-de-galaxias
Dia 3: Dominando o HTML5
- Resolução guia de galaxias
- Criando Tabelas
- Exercício Criando sua primeira Tabela
- Resolução criando sua primeira tabela
- Conhecendo os Forms
Dia 4: Dominando o HTML5
- Criando um form para pesquisar no Google
- Validação de forms
- Aprofundando nos Inputs
- Criando seu primeiro Form
- Resolução Criando seu primeiro Form
Dia 5: Dominando o HTML5
- Novidades do Html 5
- Leituras recomendadas
- Elementos semânticos do HTML 5
- Exercício: Criando um site completo
- Resolução: Criando um site completo
Semana 2 – Dominando o CSS + Bulma
Dia 1: Dominando o CSS
- Objetivos deste módulo
- Básico do CSS
- Primeiro CSS
- Cores no CSS
- Background e Borders
- Seletores
- Inspetor do Chrome
Dia 2: Dominando o CSS
- Seletores mais avançados
- Especificidade
- Herança
- Exercício: Recriando um site com CSS #1
- Resolução: Recriando um site com CSS #1
- Texto e Fontes,
Dia 3: Dominando o CSS
- Usando o Google Fonts
- Box Model
- Exercício: Recriando um site com CSS #2
- Resolução: Recriando um site com CSS #2
Bulma
- Objetivos deste módulo
- O que é o Bulma?
Dia 4: Bulma
- Adicionando o Bulma ao seu projeto
- Conhecendo os components
- Barra de navegação e footer
- Aplicando Responsividade
Dia 5: Bulma
- Exercício: Criando um Portfólio com Bulma
- Resolução: Criando um Portfólio com Bulma (Parte 1)
- Resolução: Criando um Portfólio com Bulma (Parte 2)
- Resolução: Criando um Portfólio com Bulma (Parte 3)
Semana 3 – Javascript e Lógica de Programação
Dia 1: Javascript – Primeiros Passos
- Seja bem vindo ao modulo Javascript + Lógica de programação
- O que é javascript
- Tipos Primitivos
- Operações Básicas
- Exercicio 01 – Operações Básicas
- Recursos Nativos do Browser
- Declarando Variáveis
- Exercício 02 – Pegando dados do Usuário
- Exercício 02 – Resolução
- Comentários
- Javascript fora do Console
- Exercício 03 – Utilizando JS Externo
- Exercício 03 – Resolução
Dia 2: Javascript – Condicionais
- Comparações de Dados
- Operações Lógicas (Parte 01)
- Operações Lógicas (Parte 02)
- Condicionais
- Exercício 04 – Utilizando condicionais
- Exercício 04 – Resolução
- MiniApp com Boolean, Operadores e Condicionais
- Conhecendo o Switch
- Exercício 05 – Fixando uso do Switch
- Exercício 05 – Resolução
Dia 3: Javascript – Loops
- Estruturas de Repetição
- Exercício 06 – Utilizando o While
- Exercício 06 – Resolução
- Loops com For
- Exercício 07 – Utilizando o For
- Exercício 07 – Resolução
- Do While
- Usando o break
- Exercício básico de loops 3
- Solução exercício de loops 3
Dia 4: Javascript – Funções
- Introdução as funções
- Parâmetros das Funções
- Parâmetros com Valor Padrão
- Armadilhas dos Parâmetros
- Retorno da função
- Exercício 09- Exercitando Funções
- Exercício 09 – Resolução
- Scope
- Funções Anônimas
- Arrow functions
- High Order Functions
- Exercício 10 – Aprofundando nas Funções
- Exercício 10 – Solução
Dia 5: Javascript – Arrays
- Introdução aos arrays
- Funções Básicas de arrays
- Arrays Bidimensionais
- Exercício 11 – Quizz sobre arrays
- Splice e Slice
- Iteração em Arrays
- Exercício 12 – Praticando Arrays
- Exercício 12 – Resolução
Dia 6: Javascript – Objetos
- Introdução a Objetos (Parte 01)
- Introdução a Objetos (Parte 02)
- Exercício 13 – Quizz sobre objetos
- Comparando objetos e arrays
- Aninhando Objetos e Arrays
- Adicionando funções aos objetos
- Exercício 14 – Praticando Objetos
- Exercício 14 – Resolução
Semana 4 – Javascript e Lógica de programação + Gift
Dia 1: Javascript – Classes e POO
- Classes e POO (Parte 01)
- Classes e POO (Parte 02)
- Construtores e Instâncias
- Métodos
- Exercício 15 – Praticando Classes
- Exercício 15 – Resolução
- Associando classes
- Herança
- Sobrescrita de Métodos
- Método super
- Exercício 16 – Quizz sobre Herança
Dia 2: Javascript – Classes e POO
- Métodos Get e Set
- Métodos estáticos
- Variáveis estáticas
- Exercício 17 – Revisão de Classes
- Exercício 17 – Resolução
- O que são Exceções
- Cláusula throw
- Bloco try…catch…finally
Javascript – Manipulando o DOM
- Módulos Math e Date
- Eventos no HTML
- Introdução ao DOM
Dia 3: Javascript – Manipulando o DOM
- Selecionando Elementos no DOM
- Manipulando o DOM
- Enviando o DOM para a função
- Exercício 18 – Manipulando o DOM
- Exercício 18 – Resolução
- Seletores para Formulários
- Evento para o formulário
- Manipulando estilos
- Manipulando atributos
- Exercício 19 – Praticando o DOM
- Exercício 19 – Resolução
Dia 4: Javascript – Eventos
- Eventos a partir do Javascript
- Manipulando eventos
- “This” e as Arrow functions
- Exercício básico de eventos
Git e Github
- Objetivos deste módulo
- O que é o Git
- O que é o Github
- Instalando o Git
- Configurando o Git
- Criando um novo repositório
- Ciclo de vida dos arquivos
Dia 5: Git e Github
- Realizando o primeiro commit
- Exercício: Seu primeiro commit
- Resolução: Seu primeiro commit
- Visualizando os logs
- Visualizando as diferenças
- Desfazendo alterações
- Exercício: Observando as diferenças e desfazendo alterações
- Resolução: Observando as diferenças e desfazendo alterações
- O que são Branchs
- Como utilizar branchs
- O que é merge e como utilizar
Dia 6: Git e Github
- Exercício: Usando o merge
- Resolução: Usando o merge
- Conhecendo um repositório no GITHUB
- Clonando um projeto do Github
- Criando um novo repositório no GITHUB
- Baixando as atualizações de um projeto
- Ignorando Arquivos
- Exercício: Crie seu primeiro repositório online
- Resolução: Crie seu primeiro repositório online
- Conectando ao Github com uma chave ssh,
Semana 5 – Javascript Moderno (ES6+)
Dia 1: Javascript Moderno – Evolução e compatibilidade
- Versões do ECMAScript
- Interpolação de String
- Desestruturação de Objetos e Arrays
- Operador Spread
- Rest Param
- O que é NodeJS e como Instalar
- Formato JSON
- Npm e Yarn (instalando o npm)
- Npm init e instalação de pacotes
- Transpilação com Babel
- babel.config.js e .babelrc
- NPX e NPM Scripts,
Dia 2: Javascript Moderno – Evolução e compatibilidade
- Desvendando o Webpack – Parte 01
- Desvendando o Webpack – Parte 02
- Desvendando o Webpack – Parte 03
Javascript Moderno – Modules
- Introdução aos Módulos
- Exportando um modulo
- Usando um modulo
- Exercício 01 – Módulos CommonJS
- Exercício 01 – Resolução
- Export default
- Import default
Dia 3: Javascript Moderno – Modules
- Export nomeados
- Import nomeados
- Exercício 02 – Módulos do ES6
- Exercício 02 – Resolução
- Renomeando Exports e Imports
- Renomeando um Import,
Javascript Moderno – ‘Assincronicidade’ e Promises
- SetInterval e SetTimeout
- Síncrono e Assíncrono
- O que são Promises
- Utilizando o Then
- Utilizando o Catch
- Exercício 03 – Utilizando Promises
- Exercício 03 – Resolução,
Dia 4: Javascript Moderno – ‘Assincronicidade’ e Promises
- Promises encadeada
- Executando várias Promise
- Exercício 04 – Avançando Promise
- Exercício 04 – Resolução
Javascript Moderno – Async Await
- Preparando o ambiente
- O que são Async Functions
- Capturando errros das Async Functions
- O que é Await
- Executando várias Promises com Await
- Exercício 05 – Utilizando Async Functions
- Exercício 05 – Resolução
Dia 5: Javascript Moderno – Requests
- O que é uma API?
- Requisições Get
- Exibindo os Registros no Browser
- Exercicio 06 – Utilizando o Fetch
- Execício 06 – Resolução
Semana 6 – Dominando o React
Dia 1: React
- Introdução ao Módulo
- O que é React
- O que são Components e porque eles são importantes
- O que é Jsx
- Hello World
- Como o react atualiza as views
- Create React App – gerando nosso primeiro projeto – SCREENCAST
Dia 2: React
- Criando seu primeiro component
- Exercício – Criando um component Lorem Ipsum
- Resolução – Criando um component Lorem Ipsum
- Agrupando components
- Dividindo e reutilizando components
- Conhecendo as Props
- Exercício – Criando um component com Props
- Resolução – Criando um component com Props
Dia 3: React
- O que são eventos
- Passando um evento como parâmetro para outro component
- Renderização condicional
- Impedindo component de renderizar até que uma condição seja atingida
- Renderizando multiplos components
- Renderizando multiplos elementos no JSX
- O que são estados
- Criando uma classe com estado
- O que é o lifecycle
- Incluindo lifecycle na nossa classe
- Exercicio – Usando State e Lifecycle
- Resolução – Usando State e Lifecycle
Dia 4: React
- O que são Hooks
- Refatorando nosso state com hooks
- Refatorando nosso lifecycle com hooks
- Exercício: Refatorando com Hooks
- Exercício: Refatorando com Hooks
- Controlled e Uncontrolled Components
- Criando um form controlado
- Controlando múltiplos inputs
- Exercício: Criando um novo Form controlado
- Resolução: Criando um novo Form controlado
Dia 5: React
- O que é um SPA e o que são rotas
- Incluindo as rotas no nosso projeto
- Criando uma nova tela
- Pegando parâmetros da URL
- Navegando entre as telas
- Redirect e página 404
- Conclusão e próximos conteúdos
Semana 7 – Dominando o NodeJs (ExpressJs)
Dia 1: Introdução ao Backend
- Introdução ao módulo
- Entendendo o Backend
- Executando códigos JS no Terminal
- Entrada e Saída de Dados
- Manipulando arquivos
- Verbos e status HTTP
- Montando um servidor HTTP com NodeJS
- Arquitetura MVC
Dia 3: Express
- O que é o Express (Parte 1)
- O que é o Express (Parte 2)
- Primeira rota com Express
- Respostas JSON
- Instalando o Postman
- Chain of Responsibility
- Middlewares
- Concentrando rotas
- Rota POST
- Parâmetros nas rotas
- Rotas PUT e DELETE
Dia 4: Views com EJS
- EJS e configuração com o Express – parte 1
- EJS e configuração com o Express – parte 2
- Navegando no App
- Incluindo uma partial
- Enviando dados para um template EJS
- Dados através das rotas
- Enviando dados de um formulário com POST – parte 1
- Enviando dados de um formulário com POST – parte 2
- Pacote MethodOverride
- Atualização de dados com PUT
- Removendo dados com o DELETE
Dia 5: Finalizando a lista de tarefas
- Cadastro de uma nova tarefa – parte 1
- Cadastro de uma nova tarefa – parte 2
- Excluir uma tarefa
- Fazendo request JSON – parte 1
- Fazendo request JSON – parte 2
- Conclusão do Módulo
Semana 8 – Projeto Final: APP Inspirado no Evernote
Dia 1: Planejamento
- Introdução ao módulo
- Planejamento mínimo de um APP
- Criando Mockups
- Projetando a estrutura de dados
- Projetando os Endpoints
API NodeJS
- Iniciando o Projeto
- Preparando a base da API
- Criando a estrutura de dados
- O que são autorização, autenticação e JWT
- Autenticação: Transformando o password em Hash
Dia 2: API NodeJS
- Autenticação: Registrando o usuário
- Autenticação: Permitindo o login do usuário
- Autenticação: Verificando o usuário da requisição
- Criando uma nota
- Baixando uma nota
- Baixando a lista de notas
- Atualizando uma nota
Dia 3: API NodeJS
- Deletando uma nota
- Buscando notas
- Liberando o CORS
- Visão geral da API
Cliente React
- Gerando o Projeto
- Instalando as Libs principais do projeto
- Estrutura da projeto, Bulma e Estilo global do projeto
- Criando o Header
- Criando a tela Home
- Incluindo as Rotas
Dia 4: Cliente React
- Navegação básica
- Tela de registro
- Component do formulário de registro
- Conectando com a API
- Testando a conexão e criando um usuário de testes
- Tela de Login
- Criando o component de formulário do Login
- Conectando com a API
- Criando rotas protegidas
Dia 5: Cliente React
- Header logado e logOut
- Header logado no mobile
- Estrutura da página de notes
- Sidebar (notas)
- Listando as notas – Parte 1
- Listando as notas – Parte 2
- Criando uma nova nota
- Excluindo uma nota
- Incluindo o editor Rich Text
Dia 6: Deploy
- O que é deploy, VPS e PaaS
- Preparando o Heroku e o MongoDb
- Deploy da API
- Deploy do Cliente
- Desafio Final: Atualizando a API
- Resolução Parte 1: Atualizando e excluindo o usuário (Atualizando a API)
- Resolução Parte 2: Preparando a tela de edição do usuário
- Resolução Parte 3: Atualizando as informações do usuário
- Resolução Parte 4: Atualizando o password
- Resolução Parte 5: Excluindo a conta
- Resolução Parte 6: Incluindo o nome do usuário no Header
Conteúdo Extra
1 – Guia de Carreira de Programador
- Entendendo a Carreira de Programador(a)
- Como buscar e encontrar Jobs
- Como trabalhar como freelancer
- Como continuar evoluindo
2 – Tópicos Avançados de Programação
- O que é Redux
- Criando um Projeto com Redux
- Usando o Redux com o Saga
3 – Entrevistas Com Programadores
- Alberto Rocha: Desenvolvedor Remoto para o Canadá
- Leonardo Rocha: Desenvolvedor Remoto Backend (AIS Digital)
- Mais entrevistas em breve!
DEPOIMENTO DE QUEM JÁ
MERGULHOU NESTA EXPERIÊNCIA
QUEM PODE SE INSCREVER NESSE CURSO ?
- Quem deseja começar uma profissão nova;
- Quem não sabe NADA de programação web;
- Quem já tem uma noção de Lógica de Programação;
- Quem já consegue se virar com os códigos, mas quer dar aquele UPGRADE no conhecimento;
- Quem domina o JavaScript, mas deseja REFORÇAR a base e conhecer NOVOS MÉTODOS.
QUAIS SÃO OS PRÉ-REQUISITOS TÉCNICOS ?
- Ter acesso a um computador;
- Ter acesso à internet;
- Saber o básico para acessar sites, vídeos, documentos, etc.
Plano de Estudo:
Para que em até 8 semanas você consiga buscar seu primeiro Job como Full Stack JavaScript Júnior.
Conteúdos Extras:
Entrevistas, carreira, mercado de trabalho, portfólio, home-office.
Networking:
Acesso ilimitado ao grupo de alunos 24 horas por dia.
Portfólio:
Ativo e com um projeto real desenvolvido para que você obtenha experiência antes mesmo de aplicar para uma vaga.
Acesso Vitalício:
Você pode assistir as aulas quando quiser para sempre!