🚀 Version 2.0 (English, Français)
Museek is a project allowing you to search for your favorite music lyrics! The project is entirely made with JavaScript and powered by the Genius API and Node.js.
Check the website here
In order to make this project, I used the following technologies:
- HTML
- CSS
- JavaScript
- Axios
- Genius API from Rapidapi
- NPM
- Node.js
- Express
- Cors
- Dotenv
- Render
The front-end and back-end are deployed separately. The front-end is hosted via Netlify whereas the back-end is deployed on Render.
The root folder files are the front-end files. In index.js, you are able to see the full front-end code handling the search bar, the API requests and how to display the data. I made sure to add some comments in my code so that it is readable and understandable.
All the styling was done in pure CSS in the index.css file. I also made the design responsive with a media query. The styling was made in mobile first and the media query handled a desktop viewport.
In the server folder, the server.js file is where all the data is handled. Using an Express server was very easy even though I was not used to it. The front-end sends a request to the server with two parameters (the API URL and the user query or the song ID). The server receives and handles the request before sending another request do the Genius API thanks to the parameters passed via the front-end request. Even though I could technically handle most requests in the front-end file, I had to create the server so as to bypass CORS rejections.