Skip to content

Music platform app with uploading, listening, and commenting features on your favorite tunes 🎧

License

Notifications You must be signed in to change notification settings

BernStrom/vibez

Repository files navigation

Intros   |    Motivation   |    Tech Stack   |    Features   |    Contributors   |    License   |    Disclaimer

🎧 VIBEZ

Vibez Homepage

All Contributors

👋 Intros!

👉  Live Preview

Vibez is a music platform website with base features that are commonly seen in modern-day sharing platforms, such as users are able to either register for a new account or login to an existing one with uploading music files and comment features made available to only successfully-authenticated registered users.

FYI: If you would like to try out the application but do not wish to manually sign up for an account, you can use the provided test account below.

💪 Motivation

With experience mainly working with the React library, I was curious about how the other JavaScript frameworks work in comparison to React. With the increasingly number of vouches from developers and a rapidly-rising direct contender to React and Angular, these ultimately lead me to the decision of trying out the Vue framework.

With the core motivation of simply experimenting and getting an overall familiarity with the framework, I decided to settled for a more simplistic design and focus on more the inner workings of the framework. With that, the focus was shifted towards working on the functionality of a number of features in an application with common use-case found in real-life applications like login forms, page routing, file-uploading, and more.

⚙️ Core Tech Stack

  • :basecamp:  Vue
  • 🆚  Vuex
  • 🔗  Vue Router
  • 🔑  Vee-Validate
  • 🌬️  Tailwind CSS
  • 🔥  Firebase Cloud Firestore & Storage
  • 🃏  Jest

📲 Main Features

  • Music player to play any uploaded music with timestamp selection, available to both guest and registered users.
  • Login & Register authentication through email & password with form field validation.
  • File uploading and editing through a 'Manage' section made available to verified logged-in users.
  • Commenting on any user uploaded music, made available to only verified logged-in users.
  • Built as a Progressive Web Application (PWA) that enhances overall user experience on both desktop and mobile devices.

Note: The site also contains a language localization feature (English - French). However, this feature is not fully implemented across the entire application as this was only meant to be experimental. To view this feature, simply click on the language button at the top right corner of the homepage and the main heading on the page will be converted. Localization was implemented with the Vue.js internationalization plugin, Vue I18n.

✨ Contributors

Thanks goes to these wonderful people (emoji key):


Ned

🎨 💻

This project follows the all-contributors specification. Contributions of any kind welcome!

📝 License License: MIT

This project is licensed under the terms of the MIT license. For more information, please refer to the license documentation.

⚠️ Disclaimer

As Vibez is not an actual music platform meant to be used commercially, this is not a full-fledged application and some other common features, such as user profile details editing are not available. This is intentional by design, as this project was built to gain a better understanding and overall familiarity with the Vue framework and its comparison to the React framework.

The contents of these pages are provided as an information guide only. While every effort is made in preparing the material for publication, no responsibility is accepted by or on behalf of the owner(s) for any errors, omissions or misleading statements on these pages or any site to which these pages connect. Although every effort is made to ensure the reliability of listed sites this cannot be taken as an endorsement of these sites.