Stop limiting your open source library’s potential
This morning I stumbled across Griffith – a React-based web video player. That’s cool and all, but you know what’d be even cooler? A web video player that we all can use.
There’s a recurring theme in open source where
TECHNOLOGY_X gets popular and then a bunch of libraries and tools get created specifically for (or ported to)
TECHNOLOGY_X, but they can’t be used with
- You want a search box but you find an Angular search box
- You want a geocoding library but you find a jQuery geocoding library
- You want a datepicker but you find an Ember datepicker
It doesn’t have to be that way!
With a little forethought you can build a generically-useful library and then provide small wrapper libraries that adapt the generic library to specific framework use cases. This is called the adapter pattern and I swear it’s not as bad as we make it out to be in this tweet.
Nicolás Bevacqua has been applying this principle to much success for years. He’s a great example to follow if you need some help figuring out the details!
Case in point: he created Dragula – a generic drag-n-drop library you can use directly with vanilla JS. He then followed it up with adapters (which he calls bridges – same difference):
- The official Angular bridge
- The official Angular 2 bridge
- The official React bridge
What’s even cooler about this approach is that Nicolás has paved the way for others to come along and build an Ember adapter for Dragula, an Aurelia adapter for Dragula, etc.
TECHNOLOGY_X++ comes along next year? You can guess what it’d take to build it an adapter for Dragula….
When you hard-attach your library to a specific technology or framework, you limit its potential impact. By thinking ahead and putting in a little more effort, your library could benefit orders of magnitudes more people. Maybe even future-you, once you’ve moved on to
Sign in or Join to comment or subscribe
Jerod co-hosts The Changelog, crashes JS Party, and takes out the trash (his old code) once in awhile.
Another good example of this concept in practice is Shepherd (an app tour library)
They have wrappers for Angular, Ember, React, and Vue.