The idea came to me when I read some articles by Federico Viticci about his workflows and techniques for automation. A huge part of those techniques relied on bookmarklets. I decided to look for a nice website that collected those little tools and when I couldn’t find one I liked, I decided to come up with my own.
I first released a demo on CodePen, but later I decided to turn it into a full-fledged website. People like it, there’s a steady stream of visitors to the site and since the initial release, the open source community added several new bookmarklets.
Things I’ve learned
- Open Source
- Build Processes
The most interesting part about this project is working with the community. As a single person, I can’t even begin to cover a decent amount of bookmarklets, so I depend on other people adding their own contributions. So far, those collaborative efforts have been very enjoyable and they’ve helped the site grow quite a bit.
Other than that, this was one of my first projects to rely on a build system, specifically gulp. While this involved lots of head-scratching at first, it didn’t take very long until I started seeing the benefits of my setup. And now, I would never create this site without a build system again.
Technologies I’ve used
I experimented with different approaches to templating. This includes Underscore and Handlebars templates, but I ended up using Mustache templates, because they fit best with what I wanted to achieve.
All bookmarklets are saved within their own JSON data files. This makes it easier to maintain, but it also means there needs to be some sort of concatenation. That’s where Node.js cam into the play. Using plain Node inside my gulp setup allowed me to easily concatenate the files, feed all the data into my templates and generate the full site very efficiently.