Skip to content

aliseyedi01/Music-App-React

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

84 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Project Music App

Music app practice for learning React

Color Reference

Color Hex
DarkMode_bg_Main #212121 #212121
LightMode_bg_Main #e9e7e7 #e9e7e7
DarkMode_txt_Main #dca54c #dca54c
LightMode_txt_Main #632c3b #632c3b

Fonts

  • Lemon
  • Lobster
  • Ubuntu
  • Montserrat

Demo

Music APP React

Screenshots

Desktop

image

image

Mobile

Mobile Mobile
image image

Features

  • Listen to songs on the app
  • Light/dark mode toggle
  • Responsive Design
  • Fullscreen mode
  • Music Player
  • Search Top Charts
  • Selection Music by genre
  • Access the song's lyrics
  • Access the artist's page
  • User-friendly interface and visually pleasing design.
  • Access to a vast music library through RapidAPI.
  • Streamlined state management with Redux Toolkit.

Technologies used

  • Create React App
  • TailwindCss
  • Redux Toolkit
  • Rapid API
  • GitHub-Page
  • React-Router
  • Custom Hooks
  • React tooltip
  • React Icon
  • lazy loading
  • Image loading

Environment Variables

To run this project, you will need to add the following environment variables to your .env file

API_KEY

REACT_APP_API_KEY_TWO

Run Locally

  1. Clone the project
  https://github.com/aliseyedi01/Music-App-React.git
  1. Go to the project directory
  cd Music-App-React
  1. Install dependencies
  npm install
  1. Start the server
  npm run start