Skip to content

mateusadada/imersao-front-end-alura

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

24 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

First immersion Front-End - Alura

Recreating Spotify's homepage

Stars Badge Forks Badge Pull Requests Badge Issues Badge Views count Badge
GitHub contributors License Badge

📜 Table of contents

🚀 Starting

This repository hosts the final project of the Front-End Immersion promoted by Alura. The project consists of creating a website inspired by the visual of Spotify's homepage, a music streaming platform. Using HTML, CSS, and JavaScript, the project aims to develop skills in creating complex layouts with CSS Grid, implementing responsiveness with media queries, and manipulating the DOM to add interactivity to the page.

The main objective is to enhance knowledge in web development, applying concepts learned in the immersion classes. The website features functionalities such as artist search and playlist display, using a fake API created with the help of json-server.

📚 Features

Used during the evolution of the website:

  • Implementation of a layout inspired by the visual of Spotify, with a sidebar navigation and a main content section.
  • Implementation of media queries to make the website responsive on different screen sizes.
  • Use of icons from the Font Awesome library to add stylized icons to the elements of the website.
  • Organization of the code into separate files, such as HTML, CSS, and JavaScript, to facilitate code maintenance and readability.
  • Display of information about searched artists, such as name and image, using JavaScript and DOM manipulation.

🛠️ Built with

  • HTML5 - Used to structure the page content, defining the elements and their hierarchical organization.
  • CSS3 - Employed to style and visually enhance HTML elements, such as colors, fonts, sizes, positioning, and animations.
  • JavaScript - Utilized to add interactivity to the page, allowing manipulation of the DOM, creation of events, and execution of functions.
  • json-server - Tool to create a fake API and simulate data consumption.

✒️ Author

  • Mateus Adada - Developer and documentation - mateusadada

You can also see the list of all collaborators who participated in this project.

📄 License

This project is under the license MIT. See the LICENSE.md file for more details.


Developed with ❤️ in Brazil 🇧🇷