🎷 A lofi player using Next.js
This project was developed with the following technologies:
Project Dependencies:
Dev Dependencies:
Clone the project and access the project folder
$ git clone https://github.com/aristofany-herderson/lofi-youtube-sound
$ cd lofi-youtube-sound
To run it, follow the steps below:
# Install dependecies
$ pnpm install
# Run the project
$ pnpm dev
Open http://localhost:3000 with your browser to see the result.
Resume: 🎷 A lofi player for you when you're coding. Including, player controller, sound effects, window adjustments and more!
Because I like listen lofi when coding and together we test new advanced features of the next.js 14
Player Data: From youtube.com, all the iframes picked up from there.
Design: Inspired by the project Youtube Background Sound
- Play Controllers (play/pause, change lofi video, volume changer)
- Extra relaxing audio effects (campfire, ocean, birds, and more)
- Full Screen changer
- useContext - to create a control over the application by determining global roles and states
- useToggle - to control boolean states
- useRef - to represent screen elements in memory
- useList - to store lists and enable delete, edit, add, etc
- useLocalStorage - to store values in local storage, maintaining state even with page reload
Aristofany Herderson