Inspiration
The inspiration came from the challenge of navigating long YouTube videos to revisit important parts. Whether it's an educational lecture, a detailed tutorial, or an entertaining video, finding specific moments can be time-consuming. This extension simplifies the process by allowing users to save, manage, and access timestamps easily.
What it does
The YouTube Timestamp Bookmark is a Chrome extension that:
Saves timestamps of the currently active YouTube video with a single click. Displays a list of all saved bookmarks, including video titles and formatted timestamps. Allows users to delete individual bookmarks. Provides quick access to saved timestamps, linking directly to the desired moment in the video.
How we built it
Frontend: Built with HTML for the structure and JavaScript to handle user interactions within the popup interface. Backend: Uses Chrome's storage API for saving and retrieving bookmarks. Manifest: Configured with Manifest V3, which defines the extension's permissions and metadata. Core Logic: JavaScript functions to extract video details, format timestamps, and manage bookmarks effectively.
Challenges we ran into
Timestamp Extraction: Ensuring the accurate capture of timestamps from varying YouTube URL formats. Dynamic Bookmark Updates: Managing real-time updates to the bookmark list without requiring a popup refresh. Chrome Storage: Learning and implementing Chrome's local storage API for persistent data handling.
Accomplishments that we're proud of
Successfully developed a user-friendly interface that simplifies bookmark management. Built a reliable system to save and retrieve YouTube timestamps seamlessly. Enhanced productivity for users, particularly students and professionals, by eliminating repetitive video navigation.
What we learned
Gained proficiency in Chrome Extension APIs, particularly activeTab, scripting, and storage. Improved understanding of JavaScript's DOM manipulation and event handling. Learned to structure a modular and maintainable project for browser extensions.
What's next for YT Timestamp Bookmark
Search Functionality: Adding the ability to search through saved bookmarks for quicker access. Cloud Sync: Enabling synchronization of bookmarks across devices via cloud storage. Categorization: Grouping bookmarks by video or playlists for better organization. Dark Mode: Introducing a dark theme to enhance the user experience. Browser Compatibility: Expanding support to other browsers like Firefox and Edge.
Built With
- css3
- html5
- javascript
- manifestv3
- storageapi
Log in or sign up for Devpost to join the conversation.