Chillhop Player

React music player with play / pause, skip forward / back and a drag handler to change the position of the song with a library of songs from chillhop.com. Live demo here.

Table of Contents

• General Info
• Technologies Used
• Lessons Learned
• Screenshots
• Setup
• Project Status
• Acknowledgements
• Contact

General Information

• This allowed me to consolidate core concepts and refresh working with hooks ( more time spent on class components ) before looking into state management ( Redux ).
• This was also my fist real experience with Scss, I have a lot of appreciation for CSS as it seems like this never ending language where there is always something knew to learn.
• Scss is a great addition as it’s very intuitive with nesting, variables and partials, I will definitely be using it in the future.

Technologies Used

• Javascript
• React - version 17.0.2
• Scss

Lessons Learned

• Passing, deconstructing and drilling props
• Modifying, passing and lifting state
• Working with hooks such as useRef for capturing input values and useState

Screenshots

Setup

npm install

npm start

Runs the app in the development mode.

Open http://localhost:3000 to view it in the browser.

Project Status

Project is: complete ( This project provided a stopgap for working with hooks before undertaking a new project )

Acknowledgements

• This project was based on this tutorial.

Contact

Created by drewpeattie@hotmail.com - feel free to contact me!