byancamatos01 / spotify-alura

Spotify imersão alura

Spotify imersão alura

Descrição

• Bem-vindo ao Spotify Explorer, um projeto emocionante desenvolvido durante a imersão de Front-end da Alura!
  Nosso objetivo é criar uma aplicação web interativa que ofereça aos usuários uma experiência aprimorada ao explorar a vasta biblioteca musical do Spotify.

aula 1

Nesta aula, vamos começar o nosso projeto da recriação da página inicial do Spotify por meio do HTML e do CSS, aprenda atalhos, recursos e as diferenças entre os códigos.

• Entrar no VSCode;
• Revisar as diferenças entre HTML, CSS e JavaScript;
• Fazer a sidebar navigation;
• Aprender dicas de atalho no VSCode para escrever HTML;
• Introduzir as propriedades de estilo do CSS no projeto, com truques no Devtools.

aula 2

Nesta aula, vamos abordar o código do menu lateral e aprofundar-nos em CSS, explorando posicionamento, layouts e a técnica do Flexbox

• Criar todo menu lateral da página;
• Aprender os fundamentos do CSS Flexbox;
• Saber mais sobre posicionamentos no CSS.

aula 3

Nesta aula, nos concentraremos na estrutura do código, além de irmos mais a fundo no CSS, mexendo com as variáveis; entendendo conceitos de responsividade e, também, criando o menu superior.

• Estruturar melhor o projeto;
• Refatorar o código;
• Fazer o layout flexbox;
• Aprender conceitos de responsividade;
• Criar o menu superior.

aula 4

Nesta aula, iremos utilizar o CSS Grid no projeto, para os cards da página inicial, aprendendo as medias queries, além de introduzir o JavaScript com o conceito DOM e o método promises.

• Criar os cards da página inicial;
• Aprender a usar o CSS Grid Layout;
• Utilizar media queries para responsividade;
• Instalar do Node.js;
• Introduzir o JavaScript no projeto;
• Utilizar o conceito DOM;
• Conhecer o método Promises do JavaScript.

aula 5

Nesta última aula, iremos utilizar frameworks de JavaScript React no projeto para, assim, criarmos o componente Header!

• Dar introdução a um projeto React;
• Utilizar o framework React para criar o componente ;
• Aprender as diferenças entre Angular e React.