Intros | Motivation | Tech Stack | Features | Contributors | License | Disclaimer
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.
- Email: vibez_user@gmail.com :e-mail:
- Password: vpM6A&HlZmRh :closed_lock_with_key:
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.
Vue
- 🆚 Vuex
- 🔗 Vue Router
- 🔑 Vee-Validate
- 🌬️ Tailwind CSS
- 🔥 Firebase Cloud Firestore & Storage
- 🃏 Jest
- 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.
Thanks goes to these wonderful people (emoji key):
Ned 🎨 💻 |
This project follows the all-contributors specification. Contributions of any kind welcome!
This project is licensed under the terms of the MIT license. For more information, please refer to the license documentation.
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.