Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Subscribe
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
Web Frontend Completo: HTML, CSS, JS, TS, React e Next 2026
Rating: 4.8 out of 5(924 ratings)
3,580 students

Web Frontend Completo: HTML, CSS, JS, TS, React e Next 2026

Domine Frontend - 10 projetos - HTML, CSS, Javacript, TypeScript, React, Tailwind e Next
Created byJamilton Damasceno, Jorge Sant Ana
Last updated 2/2026
Portuguese

What you'll learn

  • Integrar as principais tecnologias Web através de projetos reais. Tudo na prática!
  • HTML5: cabeçalhos, listas, imagens, links, tabelas, formulários, hear, nav, footer, article, section aside.
  • CSS3 Intermediário: seletores, div & span, cores, modelo caixa, elementos flutuantes, posicionamento, formatando links.
  • CSS3 avançado: herança, especifidade, barra navegação vertical e horizontal, abas, layouts líquidos, largura fixa, parallax, fontes customizadas.
  • CSS FlexBox: alinhamentos, justify content, align content, direções, flex direction, wrap, align self, grow, basis e order
  • CSS Grid Layout: colunas, linhas, espaçamentos, mesclar, áreas e alinhamentos
  • Javascript: variáveis, array, condicionais, operadores de comparação, operadores lógicos, funções, eventos, DOM, loops, BOM.
  • ES6: var e let, orientação a objetos, literais, prototype, funções de array.
  • TypeScript: tipos básicos, narrowing, Interface, utility types, classes, generics, decorators
  • React e Next: componentes, jsx, props, rotas, app, pages, children, eventos, tailwind, estado
  • Figma: ferramentas, frames & grids, imagens & textos, alinhamentos, componentes prontos, restrições & layouts, exportando componentes, navegação, protótipos

Course content

35 sections • 411 lectures • 75h 35m total length

  • Boas vindas9:35

    Nesta emocionante jornada de aprendizado de Web Frontend com JavaScript e React, daremos o primeiro passo rumo ao seu futuro no desenvolvimento web. Descubra como essa seção prepara o terreno para o seu sucesso.

  • Como obter o melhor do curso9:32

    Explore as riquezas que este curso oferece, desde uma visão geral até as expectativas e recursos disponíveis para garantir uma experiência de aprendizado incrível.

Requirements

  • Você não precisa saber nada sobre desenvolvimento web ou qualquer uma das tecnologias propostas neste curso para se inscrever e iniciar seus estudos. Você só precisa do desejo de aprender.
  • Todas as ferramentas utilizadas neste treinamento são de uso profissional e livre, ou seja, são gratuitas, logo, você não precisará de nenhum investimento financeiro em softwares para iniciar sua nova profissão como desenvolver Front-end.
  • Se você tem habilidades básicas para utilizar um computador e acessar a internet e estiver em busca de uma nova profissão, este curso é para você.

Description

Aprenda Front-end do zero, mesmo que você não tenha nenhuma conhecimento prévio, no curso você irá criar 10 projetos reais, para usar os projetos como seu portfólio e já começar no mercado com projetos prontos!

O curso conta com mais de 411 aulas, ao todo são mais de 75 horas de videoaulas em que são abordadas as principais tecnologias web focado no Front-end.

Para iniciar o treinamento não é necessário nenhum conhecimento prévio na área, você partirá do zero e ao final do treinamento alcançará um nível profissional. Além disso você conta com um suporte campeão para tirar suas dúvidas.


Crie projetos reais, veja abaixo alguns deles:


  1. Classificação de Animes -> Usando HTML crie uma estrutura para classificar os melhores animes.

  2. Site Oficial do Discord -> Use HTML para criar o famoso site Discord

  3. Detalhes produto Loja Virtual -> Usando HTML e CSS criaremos uma área muito comum em lojas virtuais, exibição das informações de produtos

  4. Site Anna Bella -> Site completo com HTML e CSS, aplicando formatações e navegação entre páginas

  5. Site Oficial do Medium -> Usando HTML e CSS recriaremos a página inicial do famoso Medium, vendo conceitos práticos de desenvolvimento

  6. Barra de navegação vertical -> Crie do zero um dos recursos mais usados na criação de site, uma barra de navegação vertical, usando HTML e CSS

  7. Página inicial do Zoom -> Recriaremos a página inicial do Zoom usando GridLayout para organizar os conteúdos e Flexbox para organizar os itens internos, trabalhando conceitos de responsividade e Media Queries

  8. Álcool ou Gasolina -> Usando Javascript você vai criar um projeto que o usuário coloca o preço do Álcool e da Gasolina e a aplicação diz qual combustível é melhor utilizar

  9. Frases motivacionais -> Uma aplicação Javascript que exibe frases motivacionais diariamente

  10. Projeto site Adidas -> Crie uma versão do site da Adidas utilizando o Figma, uma das melhores ferramentas para design e prototipagem.

  11. AirBnb -> Crie uma versão do famoso site usando React, Next e Tailwind, com separação de componentes e navegação ao selecionar uma acomodação


Editores de código fonte

- Utilize VSCode e Sublime Text durante o curso e aprenda a utilizar dois fortes editores


Junte-se a mais de 360 mil alunos que já fizeram e aprovaram os nossos treinamentos!

Who this course is for:

  • Qualquer pessoa com vontade de aprender a criar sites e sistemas web profissionais.
  • Estudantes e profissionais que desejam aprender ou se aprofundar nas tecnologias HTML, CSS, Javacript, TypeScript, React, Tailwind e Next.
  • Estudantes interessados em aprender na prática.

Report abuse