Today I finished a side project I started 4 years ago and all I have to show for it is this shitty accordion
Four years ago, shortly after I started working as a front-end developer, I created a Github repository that would become home to the project that would consume the majority of my spare time for the following few years. Today, I have finally “finished” that side project, a feat that defies all odds, and, really, I’m writing this blog post mostly to serve as a personal notice to myself that I can finally let go and move on.
I’ve done some crude calculations, and over the years leading up-to this point I have written (to the nearest order of magnitude):
- 1,000 Github commits
- 10,000 lines of code
- 100,000 words of documentation
- 1,000,000 characters
…and that’s for this project alone. This is by far the most amount of effort I have ever put into anything, and it has all been worth every last commit of it. And what do I have to show for it? I mean, literally, what can I actually show you right now that encompasses all of my hard work, without talking your ear off for 30 minutes trying to explain it? How about this shitty accordion:
I mean, it really looks terrible. But it works (as an MVP). It renders, it styles, and most importantly, it interacts. The tools that handle these separate aspects are all custom built; that means a custom JavaScript style authoring system, a custom JavaScript DOM interaction library, and a custom DOM rendering library (with React as a dependency). And to top it all off, a framework to bundle them all together (this framework is the main project I refer to in this article). Thanks to this framework, the above accordion took me 60 seconds to whip up (maybe just over). According to my calculations, I only need to build slightly more than two million UI components to see a return on my time investment. This works out to about 105 UI components per day for the rest of my life. Easy.
So, the fact that I can actually create a working UI component with such ease and share it with anyone, I actually consider a huge success, it honestly feels great. I don’t care how long it took me to get here or that it looks like crap. But another reason I wanted to write about my experience creating a side-project is because I wanted to share the benefits that having a side project has afforded me. I’ll say right now if you don’t have a side project and are an aspiring web developer, start a side project. Create a Github repository and call it “side-project” if you can’t think of anything for now. I owe the majority of my ability to progress in my career to my side project; it taught me Sass, jQuery, React, Node.js, good practices, Git, unit-testing, you name it, I can do it because of my side project and my desire to create something that works. I never set out to learn something specific; I always sought to solve a problem and apply the solution to my side project. This way, I have found my natural place in the vast wide-world that is web-development.
Anyone who has a side project will know the uneasy feeling of getting to the very last part only to realise that some new tool, idea or technology can render your project even better by solving some existing problems you have; all that’s required is a simple re-write of your project from scratch.
The first iteration of my side-project, for example, was a Sass library for styling UI components (this came through an initial need to have friendly BEM-like APIs for styling components). By the third iteration JavaScript had come into play (so I could share configuration between Sass and JavaScript), and the current fourth and final iteration now includes React (so I can create and render components with a friendly API), and a tool for styling components with JavaScript instead of Sass. So essentially what started off as a Sass library is now a full-blown framework for creating UI components. I’m finally at a point where I’ve “finished” and am not finding myself with the urge to rewrite it from scratch using a new technology. And as an added bonus, I now know a bunch of stuff that other people will pay me to do.
At some point, I had to split-out my side project; it didn’t make sense to keep everything under one project when there were clear separations of concern. Ultimately, the project now consists of four packages (which can of course all be used independently), one of which consists of two packages (yes, my side project got so big it had to be split into multiple packages, one of which got so big it too had to be split into multiple packages…), which is why I’m so relieved to have finished. It really did constantly seem like it would never end (remember the multi-headed Hydra from Hercules? For each head chopped off, three more would grow in place, or some shit like that, yeah, that’s what building a side project feels like). Even at this point, despite the numerous tests in various environments, I just know that I’ve overlooked something important that will hinder the project’s use on someone else’s system; I’ve left a proverbial Kevin McCallister home alone, if you will.
Normally, I would make a cool, fancy website to showoff the tool that I’ve created, with parallax and scroll-jacking, but frankly after four years, you know, I just can’t be fucked. That would take at least another month. I made a cool logo (which you can see on the project’s Github (and by “made”, I mean “bought”)), that’s enough for now. I plan to use the framework I have built to create a UI component library (of React presentational components). If you want to keep up-to-date with my successes and failures along the way consider following me on Twitter and Github. If you have any interesting front-end/UI side projects I’d love to check them out, I’m always keen to discover awesome new tools!
Thanks for reading.
