YouTube Album

An online album for YouTube videos. Save links, view thumbnails, and play back your content with ease.
Explore the docs »

View Demo · Report Bug · Request Feature

Table of Contents

1. About The Project
   • Screenshots
   • Built With
   • Packages
2. Getting Started
   • Installation
3. Usage
4. Internationalization
5. Roadmap
6. Contributing
7. License
8. Acknowledgments

About The Project

Formerly known as 'Yault' is an online album of YouTube videos where you can save links and view all the videos you've stored. You can see the video thumbnails and information, play them back, and remove them from your collection as desired. The interface is user-friendly and easy to navigate, making it simple to organize and access your favorite YouTube content.

This project provides a convenient way to keep track of your favorite videos and organize them for easy viewing. Whether you're a casual YouTube user or a content creator looking for a way to manage your uploads, this album is a great tool for keeping your videos organized and easily accessible.

Screenshots

Images

(back to top)

Built With

• 
• 
• 

Packages

• @heroicons/vue
• @intlify/unplugin-vue-i18n
• axios
• daysiui
• firebase
• notie
• vue
• vue-i18n
• vue-router

(back to top)

Getting Started

Installation

1. Get a necessary API Keys

   • Firebase
   • YouTube
     

2. Clone the repo

   git clone https://github.com/KrozT/youtube-album.git

3. Install packages

   yarn install

4. Add YouTube API Key to your environment variables

   # Youtube API Key
   VITE_YOUTUBE_API_KEY='YOUR YOUTUBE API KEY'

5. Define the application name on the environment variables (Optional)

   # Application Name
   VITE_APP_NAME='YOUR APP NAME'

6. Add Firebase configuration to your environment variables (Recommended)

   # Firebase Config
   VITE_FIREBASE_API_KEY='YOUR FIREBASE API KEY'
   VITE_FIREBASE_AUTH_DOMAIN='YOUR FIREBASE AUTH DOMAIN'
   VITE_FIREBASE_PROJECT_ID='YOUR FIREBASE PROJECT ID'
   VITE_FIREBASE_STORAGE_BUCKET='YOUR FIREBASE STORAGE BUCKET'
   VITE_FIREBASE_MESSAGING_SENDER_ID='YOUR FIREBASE MESSAGING SENDER ID'
   VITE_FIREBASE_APP_ID='YOUR FIREBASE APP ID'
   VITE_FIREBASE_MEASUREMENT_ID='YOUR FIREBASE MEASUREMENT ID'

   Firebase configuration is stored on environment variables for easy and fast deployment withouth having to change the code. If you don't want to use environment variables, you can change the configuration on the src/composables/database.ts file.

7. Build project

   yarn run build

(back to top)

Usage

Once you have the project built and running on your preferred hosting service or locally, just go to the address where you have it hosted or your localhost and you will be able to use it.

(back to top)

Internationalization

You can add new languages to the project by following these steps:

1. Create a new file in the src/locales folder with the name of the language you want to add following the IS0 631-1 standard (e.g. fr-FR.json).
2. Copy the contents of the src/locales/en-US.json file and paste it into the file you just created.
3. Change the values of the keys to the language you want to add.

(back to top)

Roadmap

• YouTube Integration
  • Videos
  • Thumbnails
  • Information
  • Playback
  • Removal
• Firebase Integration
  • Database
  • Analytics
• User Authentication
  • Google
  • Email
• User Interface
  • Responsive
  • Mobile-friendly
  • Automatic language detection (based on browser language)
  • Dark mode
• Internationalization
  • English (United States)
  • Spanish (Chile)

See the open issues for a full list of proposed features (and known issues).

(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". Don't forget to give the project a star! Thanks again!

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)

Acknowledgments

• Othneil Drew

(back to top)