Vibestream

An immersive web application that synchronizes music playback with animated 3D scenes.
Explore the app »

Report Bug · Request Feature

Table of Contents

1. About The Project
2. Features
3. Tech Stack
4. Usage
5. Project Structure
6. Contributing
7. License
8. Contact

About The Project

Vibestream is an immersive web application that synchronizes music playback with animated 3D scenes, offering users a unique and engaging experience. The app integrates with the Spotify API to provide seamless music streaming, paired with dynamic visualizations rendered in real-time.

(back to top)

Features

• Music Synchronization: Syncs music playback with animated 3D scenes for an immersive experience.
• Spotify Integration: Connects with the Spotify API to search for and play individual tracks.
• User Authentication: Users can register and log in with an email and password, and connect their Spotify account for enhanced functionality.
• Responsive Design: Optimized for performance across devices with a responsive layout.
• Real-Time Visualization: Dynamic 3D scenes rendered using Babylon.js that react to the music.

(back to top)

Tech Stack

This project is built with:

• Frontend:

• Backend:

• Database:

• Authentication:

• 3D Rendering:

• Music API:

• Version Control:

(back to top)

Usage

Vibestream is live and can be accessed at vibe-stream.net.

• Register and Log In: Users can create an account using their email and password.
• Connect to Spotify: After logging in, users can connect their Spotify account to search for and play individual tracks.
• Experience the Vibes: Play tracks and enjoy synchronized 3D animations that react to your music.

(back to top)

Project Structure

Vibestream/
│
├── client/                  # React frontend
│   ├── src/
│   ├── public/
│   └── package.json
│
├── server/                  # Node.js backend
│   ├── config/
│   ├── controllers/
│   ├── models/
│   ├── routes/
│   └── server.js
│
├── .env.example             # Example environment variables file
├── .gitignore
├── package.json
├── README.md
└── LICENSE

(back to top)

Contributing

Contributions are what make the open-source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement".

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

(back to top)

License

Distributed under the MIT License. See LICENSE for more information.

(back to top)

Contact

Alexis San Javier - ucfknight2017@gmail.com

Project Link: https://vibe-stream.net

• Website: alexissj.net
• LinkedIn: linkedin.com/in/alexissj
• GitHub: github.com/code-guy21

(back to top)