WEB FRONT END & REACT

NÍVEL


Básico/Intermediário

DURAÇÃO


2 meses

PRÉ-REQUISITO


Nenhum

POR QUE APRENDER WEB FRONT END & REACT?

Ensinaremos as ferramentas para criação da estrutura de uma página web com HTML 5, seu layout gráfico responsivo com CSS 3, lógica da programação com JavaScript e a biblioteca React e suas principais funções e componentes para a criação de interfaces.

Spotify

O aluno irá recriar a página inicial do Spotify para trabalhar os conceitos iniciais do curso.

Responsividade em suas mãos

O professor escolherá, em comum acordo com os alunos, algum site como modelo para recriar e manter a responsividade como elemento indispensável de produção (Mobile First).

Meu Portfolio

Usando todos os conhecimentos adquiridos, o aluno deverá criar um site próprio para por exemplo divulgar seu currículo, portifólio, etc.

SAIBA MAIS

SAIBA MAIS

1/3

2/3

3/3

Obrigado!

CONTEÚDO
PROGRAMÁTICO

Quer receber a
ementa
completa?
Download

HTML 5

Linguagem que utiliza tags aninhadas para definir a estruturação básica de uma página Web.

CSS 3

As "Cascading Style Sheets" (CSS) tem como função definir a formatação da página, como ela deve aparecer para o usuário final.

Identificadores e Classes

Ferramentas indispensáveis quando se está formatando uma página completa, permitem uma formatação de páginas muito mais simples.

Imagens e Vídeos

Adicionar elementos gráficos à sua página é fundamental para deixá-la mais chamativa e atraente.

Posicionamento de Elementos

Como posicionar os elementos da página nos locais desejados utilizando as propriedades "margin", "padding" e "position".

Flexbox e Media Query

Utilizadas para tornar sites responsivos. Cada vez mais as pessoas estão acessando sites via smartphone e isto só aumenta a demanda por sites que respondam bem independente da orientação da tela.

JavaScript

Linguagem de programação que permite definir algumas funções dentro das páginas que são desencadeadas através de eventos, permitindo assim tornar seu site interativo e prendendo mais a atenção do usuário, melhorando a visibilidade de sua marca.

Ajax

Ajax Permite que a página se comunique com bancos de dados em "background" e altere valores na página sem a necessidade de recarregá-la por completo, melhorando a experiência do usuário.

ReactDOM

A ponte entre o framework react e as tecnologias web.

JSX

Linguagem que alterna HTML e javascript para criação de componentes dinâmicos e reativos.

Renderização de elementos

React na sua página web ou em apenas uma parte de seu HTML.

Componentes a partir de Funções

Componentes React como funções que renderizam HTML na página.

Componentes a partir de Classes

Para componentes mais complexos, aproveite os benef ícios da orientação a objetos.

Propriedades e Estado

Comunicação entre componentes diferentes e manutenção e atualização de informações dentro de componentes.

Ciclo de Vida do Componente

Funcionalidades que executam no momento em que o componente é montado, desmontado ou renderizado.

Eventos

Manipulação do estado dos componentes a partir de cliques, digitação no teclado, e demais eventos disponíveis no HTML.

Renderização Condicional

Manipulação da renderização de um componente de acordo com o estado. Mostrando ou não informações de acordo com sua necessidade.

Renderização de Múltiplos Elementos por MAP

Renderização de listas de componentes com facilidade usando a função map().

A importância do Key ao renderizar listas

Importância da propriedade key na renderização de listas e a inteligência do React em atualizar apenas o necessário dentro do HTML.

Formulários (entrada de dados)

Todos os inputs, radio buttons, e checkboxes do HTML estão disponíveis como formas de entrada de dados no React.

Compartilhamento de estados e eventos entre Componentes

Passagem de informações entre componentes e uso de funcionalidades de um componente pai de dentro de um compomente filho.

Fragments

React precisa de um nó raiz em cada componente, mas podemos escapar da limitação usando fragment.

PropTypes

Tipagem forte e estática em propriedades.

Hooks (useState, useEffect, useContext)

Hooks são o que há de mais moderno no React, possibilitando que componentes do tipo função sejam tão poderosos quanto os do tipo classe e manipulem estados de formas avançadas.

Quer receber a
ementa
completa?
Download

Rodrigo Rodrigues

Web Front-End

"A Let's Code têm profissionais muito atenciosos e empenhados em nos ajudar. A estrutura é ótima e o conteúdo tem muita qualidade."

Luis Ottoni

Web Front-End

"Sempre tive vontade de aprender a programar, mas me faltava motivação. E foi isso foi o que mais encontrei na Let’s Code: metodologia focada em projetos e professores preparados."

Juliana Azevedo

Web Front-End

"O curso está sendo ótimo e estou aprendi coisas que eu considerava um ‘monstro de sete cabeças’. O professor tem uma metodologia muito prática e objetiva. Recomendo a todos!"

Laila Guzzon Hussein

Web Front-End

"Indico de olhos fechados! O curso é sensacional e aprendi muito e mais do que esperava. Os professores são didáticos e os exercícios de aula facilitam bastante o aprendizado."

24/7

Canal de comunicação contínuo professor-aluno durante todo o curso

Metodologia hands on. Cases do mercado de trabalho em sala de aula.

Espaço moderno para os alunos utilizarem a tarde como coworking.

24/7

Canal de comunicação contínuo professor-aluno durante todo o curso

E-BOOK DE
WEB FRONT-END
GRATUITO
Faça o Download

Metodologia hands on. Cases do mercado de trabalho em sala de aula.

ALOCAÇÃO NO
MERCADO DE
TRABALHO?
Conheça o Pi

Espaço moderno para os alunos utilizarem a tarde como coworking.

FAQ

1.
Nunca programei antes, eu consigo acompanhar o curso?
Nós desenhamos esse curso para seu primeiro contato na linguagem e temos muita experiência com pessoas que nunca programaram antes. Importante ressaltar que programação é treino, portanto, dedique-se nesses dois meses e aproveite ao máximo o professor.
2.
Quais são as formas de pagamento?
Você pode pagar no cartão de crédito, débito ou transferência bancária. As condições de pagamento e descontos variam de acordo com a forma de pagamento. Entre em contato se precisar de maiores informações.
3.
Eu preciso trazer meu computador para a sala de aula?
Sim. Todos os nossos cursos exigem que você traga o seu próprio computador. Mas não se preocupe, a maior parte dos laptops dão conta do recado.
4.
Caso eu perca uma aula, é possível repor?
Sim, é possível. Existem duas maneiras para repor sua aula: (i) se houver disponibilidade de vaga em outra turma que esteja no mesmo conteúdo que o seu; (ii) reposição particular paga de R$150/aula.
5.
Tem estacionamento no local?
Sim. Em ambas unidades contamos com estacionamento no local para facilitar a entrada do aluno. A Unidade Pinheiros fica apenas 3 min do metrô Faria Lima e a Unidade Jardim Europa consta com manobrista gratuito.
6.
Vocês oferecem alguma bolsa ou desconto para o curso?
Nossos cursos não são ministrados no MEC e não oferecemos bolsa aos alunos. Trabalhamos com descontos de indicação de alunos e também combo de cursos.
7.
Qual é a carga horária deste curso?
O curso tem uma carga horária de 48 horas distribuídas ao longo de 2 meses.
8.
Como é formato de aula ao longo da semana?
As aulas acontecem 2x na semana (segundas e quartas ou terças e quintas) das 19h às 22h. O aluno pode escolher qual dia da semana melhor encaixa em sua agenda.
9.
Existe algum acompanhamento online?
Sim! Trabalhamos 24/7 com a plataforma Slack para atendermos as dúvidas dos alunos. Aproveite também nossa comunidade para fazer networking.
10.
Qual é o tamanho das salas de aula?
Trabalhamos com salas de aulas pequenas, máximo de 15 alunos/turma para garantir um ensino prático e customizado por sala.
Entre em contato

CURTA DURAÇÃO

Python Imersivo

MÉDIA DURAÇÃO

Python

Data Science & I.A.

Python For Finance

Web Front-End & React

Metodologias Ágeis

Banco de Dados

Django

Blockchain

Java

Linguagem C & C++

C#

LONGA DURAÇÃO

Data Science

Web Full Stack

TEENS SEMESTRAIS

Prep Coding

Games, Apps & Coding

Python Jr.

Full Stack Jr.

TEENS FÉRIAS

Games Coding Camp

Python Coding Camp