240 horas
é o tempo estimado para você concluir esta formação e estar bem preparado para o mercado
Assista o vídeo
veja nossa apresentação da Formação e uma Alura Live sobre a Carreira em Front-end
O front-end domina o mundo
A Web é a plataforma de programação mais importante do mundo. Suas tecnologias principais, o HTML, o CSS e o JavaScript, são as linguagens mais usadas. E quem domina essas tecnologias, suas boas práticas e seus recursos mais avançados, hoje é um disputado Engenheiro Front-end.
Praticamente todo produto digital precisa de um Front-end Web, por isso é um mercado imenso no Brasil e no mundo. Mas se engana quem acha que aprender um pouco de HTML e CSS, e arranhar um jQuery, são suficientes. O bom profissional de Front-end tem que lidar com desafios enormes. Precisa saber as boas práticas de código, como lidar com múltiplos navegadores e saber escrever sites resilientes. Precisa estar antenado nas novidades do JavaScript e do CSS, desenvolver pensando em mobile e responsivo assim como conhecer frameworks e SPA.
É muita coisa! Mas é um conhecimento rico e essencial para quem quer se destacar nessa área que é tão valorizada.
A Formação Engenheiro Front-end da Alura foi pensada para você começar do zero e se tornar um profissional de ponta. É um guia de estudos com um passo a passo pensado com carinho pela equipe da Alura.
Pré-requisitos
Lógica de programação com JavaScript e noções de Git para submissão dos projetos. Aqui na Alura, curso de lógica I e curso de lógica II, além do curso de git.
Por que estudar esta formação?
Acompanhamento real
Receba feedback dos seus instrutores em um projeto real
Do básico ao avançado
Formação completa para o mercado
Você dentro do mercado
Do zero ao sonhado emprego em sua área de interesse
Faça como empresas e startups e capacite sua equipe para entregar os projetos do dia a dia.
Conheça os planosCom quem você irá aprender
-
Alberto Souza
-
Douglas Quintanilha Barbosa Ferreira
-
Flavio Henrique de Souza Almeida
-
Luiz Fernando Oliveira Corte Real
-
Natan de Souza Fonseca
-
Sérgio Lopes
-
Yuri Padilha
Passo a passo
1 HTML & CSS
A base de todo desenvolvimento Web é um bom HTML. Mais que aprender tagzinhas, é saber a importância de um código semântico e bem estruturado. Em cima disso, aplicamos o layout CSS que também é muito mais que apenas colocar uma cores e firulas por aí. É muito fácil escrever códigos HTML e CSS ruins. E é muito fácil não dar a atenção devida a esses fundamentos da Web. Mas não é o que recomendamos. Bons estudos!
-
Curso HTML5 e CSS3 I: Suas primeiras páginas da Web
Curso | 32h | Básico -
Curso HTML5 e CSS3 II: Turbinando as suas páginas
Curso | 40h | Intermediário -
Vídeo Alura Live: como ser um bom dev front-end
-
Podcast CSS: Cansei de Ser Simples – Hipsters.tech #09
-
Post Seu código CSS pode ser mais limpo, flexível e reaproveitável
-
Post Guia de Unidades no CSS - Blog da Alura
-
Post Começando a organizar seu CSS
-
Vídeo Bootstrap e frameworks CSS (opcional)
-
2 JavaScript, Ajax e jQuery
Sites modernos são muito mais que páginas estáticas com layouts bonitos, são interativos, dinâmicos. É aí que entra o JavaScript, a linguagem de programação mais importante da atualidade. Agora você vai aprender os fundamentos e boas práticas dessa linguagem, além de conhecer a biblioteca mais famosa do mundo: o jQuery.
-
Curso JavaScript: Programando na linguagem da web
Curso | 20h | Básico -
Vídeo Alura Live: JavaScript
-
Post Preenchendo formulário HTML automaticamente com AJAX
-
Curso jQuery: Domine a biblioteca mais popular do mercado
Curso | 12h | Intermediário -
Curso jQuery: Avance na biblioteca mais popular do mercado parte 2
Curso | 12h | Intermediário -
Podcast O Reino encantado do JavaScript – Hipsters #38
-
Post Organize seu código JavaScript
-
Post Aplicando o progressive enhancement
-
3 Front-end UI Avançado
A Web raiz de antigamente parava em algumas poucas propriedades do CSS. Mas não mais. O mundo evoluiu, novas exigências surgiram, e a Web cresceu junto. Agora você vai mergulhar em técnicas e tecnologias mais recentes e profundas, que vão te trazer um outro olhar ao desenvolvimento front-end.
Desde pré-processamento de CSS com SASS até o uso de ferramentas de debug, passando por layouts avançados com flexbox. E, o mais importante, como lidar com o mundo multidispositivo que temos hoje com a criação de sites responsivos e mobile-first.
-
Vídeo Alura Live: Pré-processadores
-
Curso Sass e Compass: Descomplicando o CSS
Curso | 08h | Básico -
Post 10 mixins em Sass que você deveria usar em seus projetos
-
Curso Flexbox: Posicione elementos na tela
Curso | 09h | Intermediário -
Curso Web Design Responsivo: Páginas que se adaptam do mobile ao desk
Curso | 10h | Básico -
Post Porque usar ‘em’ no seu CSS hoje em dia?
-
Post Como lidar com os limites de resolução em sites responsivos?
-
Post Criando Layouts com CSS Grid Layout (opcional)
-
Post Criando componentes CSS com o padrão BEM (opcional)
-
4 JavaScript moderno
A linguagem JavaScript já tem mais de 20 anos, mas recentemente deu uma grande evoluída. A especificação do EcmaScript 6 (e depois as seguintes) trouxe muitas novidades bacanas que vamos ver agora. Veremos o estado atual do JS no browser e também seu futuro.
5 SPA com React e Redux
Muitos sistemas modernos usam a arquitetura de Single Page Applications no front-end. Usamos frameworks robustos para organizar, encapsular e modularizar melhor nosso código. E obtemos uma interface mais rica e agradável para o usuário.
Há muitas opções de frameworks SPA no mercado. O React e o Angular são os mais famosos - mas temos Vue, Ember, Meteor e vários outros. Como não podemos estudar todos, aqui na Formação Engenheiro Front-end, vamos estudar o React e seu ecossistema. Ele é hoje o principal framework em mercado e oportunidades, e traz muitos conceitos relevantes mesmo se depois você for estudar e usar algum outro framework.
-
Podcast Single Page Applications – Hipsters #16
-
Curso React parte 1: componentes reutilizáveis para sua webapp
Curso | 10h | Intermediário -
Podcast React: o framework onipresente – Hipsters #66
-
Curso React parte 2: Container components e o ciclo de vida do react
Curso | 10h | Intermediário -
Curso React parte 3: A arquitetura flux, implementação do Redux e server side rendering
Curso | 08h | Avançado -
Vídeo Alura Live: React e mercado
-
6 Projeto Formação Engenheiro Front-end
Chegou a hora de mostrar pro mundo que você é um Engenheiro Front-end completo! O Projeto de Conclusão é um desafio prático que você vai desenvolver usando todas as habilidades aprendidas durante a Formação.
Nós vamos avaliar seu projeto e, ao final, você terá um Certificado de Conclusão da Formação.