How I Built a YouTube Playlist Tool While Learning JavaScript

I am a software engineer by profession, and I mostly work with Python only. I am very comfortable using Django for backend APIs and database designs. However, I always felt a little nervous about frontend development, especially JavaScript. It felt quite confusing compared to the structured world of Python that I am used to.

The Reason I Started

To fix this gap in my skills, I decided to learn JavaScript properly. I heard many people recommending Akshay Saini and his "Namaste Javascript" playlist on YouTube, so I thought to give it a try.

On a Sunday morning, I started watching the videos. The content was very good and easy to understand, and I wanted to finish the whole playlist. To plan my schedule, I wanted to know the total duration of the playlist. But, YouTube doesn't provide a way to get the total duration of a playlist (Youtube music playlist has this feature though).

The Problem with Existing Tools

I searched on Google for "YouTube Playlist length." I found a few websites that showed the total time and speed calculations. However, I realized these tools were missing some practical features I really needed:

  • Remaining Time: After watching 10 videos, I wanted to know how much time is left for the remaining ones. Also, the last few videos in the playlist are usually the general ones, so I wanted to skip them. Existing tools only showed the total time but I wanted to know the time for specific range of videos.
  • Sorting: I wanted to sort videos to watch the shortest ones first or the most popular ones. There was no option for this.

Building My Own Solution

Since I am a developer, I decided to build a tool that solves these problems. I paused my learning and opened my code editor. I used Django because I know it well and can build backend logic fast.

I made a list of features that I included in this tool:

  • Total Duration: The basic length of the playlist.
  • Average Duration: The average length video in the playlist.
  • Speed Options: Time calculation for 1.25x, 1.5x, and 2x speeds.
  • Remaining Duration: You can select the videos you have watched, and it tells you the time left.
  • Advanced Sorting: Options to sort by Longest First, Shortest First, Most Liked, and Most Viewed, Oldest First and Newest First.
  • Direct Links: You can open the video directly from the table.
  • Stats: You can also see the stats of the videos like likes count, views count and comments count.

Once I defined the features, I started building the tool. I used Django for the backend and wrote css & html with the help of AI. For the data, I have used offcial YouTube API. If you want to know how to setup and create YouTube API key, check this video

Note on API Limits: YouTube provides a free daily quota of 10,000 "units". A unit is a measure of resource usage (e.g., retrieving a playlist costs 1 unit, getting information about 50 videos costs 1 unit, etc), so this generous limit is more than enough for hobby projects. Here is the link to the official documentation page.

Conclusion

It took some effort, but I managed to build the tool exactly how I wanted it. Here is the link to the tool YTP Length. After finishing the project, I used it to go back and complete the JavaScript playlist. It was a good practical experience, and now this tool helps me track my learning progress better.

Note: If you want to know my learning strategy, then check out this blog post: How I Use YouTube Playlists to Learn Fast: My 3-Step Secret Steps.
Previous Next