Formação Front-end
Do zero a uma carreira de sucesso no mercado web, com HTML, CSS, JavaScript e React JS
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 está no mercado de 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 MVC e SPA.
A Formação Front-end da Alura foi pensada para você começar do zero e se tornar um profissional de ponta, chegando até o React framework. É 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?
-
Guia de aprendizado
Conteúdos pensados para facilitar seu estudo
-
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
Comece essa formação agora mesmo e capacite-se para seu próximo projeto!
Conheça os planosCom quem você irá aprender
-
Alberto Souza
-
Douglas Quintanilha Barbosa Ferreira
-
Flavio Henrique de Souza Almeida
-
Natan Souza
-
Pedro Marins
-
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 parte 1: A primeira página da Web
Curso | 08h | Básico -
Curso HTML5 e CSS3 parte 2: Posicionamento, listas e navegação
Curso | 08h | Básico -
Curso HTML5 e CSS3 parte 3: Trabalhando com formulários e tabelas
Curso | 08h | Básico -
Curso HTML5 e CSS3 parte 4: Avançando no CSS
Curso | 08h | Básico -
Site 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
-
Site 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
-
Front-end
Além dessa, a categoria Front-end conta com cursos de HTML, CSS, JavaScript, React, Angular, jQuery,e mais...