https://github.com/byancamatos01/spotify-alura

Spotify imersão alura
https://github.com/byancamatos01/spotify-alura

alura api html5 imersao-alura imersao-alura-frontend javascript json

Last synced: 3 days ago
JSON representation

Spotify imersão alura

• Host: GitHub
• URL: https://github.com/byancamatos01/spotify-alura
• Owner: ByancaMatos01
• Created: 2024-01-26T21:16:03.000Z (11 months ago)
• Default Branch: main
• Last Pushed: 2024-01-26T21:54:35.000Z (11 months ago)
• Last Synced: 2024-10-31T18:07:05.092Z (about 2 months ago)
• Topics: alura, api, html5, imersao-alura, imersao-alura-frontend, javascript, json
• Language: CSS
• Homepage: https://byancamatos01.github.io/spotify-alura/
• Size: 932 KB
• Stars: 2
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# 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.