Great artists steal: How to dramatically improve as a Web Developer by stealing from Open Source
Jan 28, 2013
Table of contents:
As the old saying goes, “Good artists copy, great artists steal”. The Internet is a beautiful place for learning new skills and improving your technique. Every website allows you to “View the source” and all modern browsers come equipped with development tools that make breaking down a website really easy.
GitHub has grown extremely fast over the last couple of years as a way to bring the social into programming. This is fuelled the rise in Open Source projects and but has also given people the opportunity to share smaller projects that traditionally wouldn’t of been shared. You see a lot of developers actually sharing their Git repositories of almost all of their work including their personal websites or blogs. I think this openness is a huge positive for the Web Development community.
There are also more tutorial based or online learning websites that look to share knowledge of techniques. Online video has matured and interactive coding environments make learning really fun and engaging.
In short, it has never been a better time to learn to be a Web Developer.
One of my theories of learning Web Development is tomorrow’s work should make today’s work look terrible. I think if you are not constantly ashamed of how bad yesterday’s work is, you aren’t learning fast enough. Part of this is taking on big ambitious projects that force you to learn new skills and techniques at scale. By putting myself into this situation, I find the pressure to learn quicker is much greater.
The problem with this is, you don’t know what you don’t know. In other words, you could end up in a situation where your work is just not good enough. Building a project at a certain scale involves a different outlook to building a project at a much smaller scale. Things break when building big projects but the only way to learn the required patterns for building big projects is to actually get stuck in and work on them.
This is where stealing from Open Source comes in. Open Source projects by definition have reached the scale of the big project. Usually an Open Source project will have had many different developers working on it, all of which are at different skill levels and have different backgrounds and experience. Open Source projects are also often required to cover a number of use cases. So for example, a framework such as Rails can be used to build a simple blog all the way up to a complex social network.
By stealing the patterns and techniques from Open Source projects, you gain the knowledge and the experience from the people who created it. Programming patterns are recognised as the accepted right way of doing certain things. By stealing the implementation of these patterns from Open Source projects, you can learn the lessons required to build big projects, without the painful realisation that your theory was wrong.
Now, obviously I’m not advocating that you just steal from Open Source projects and pass it off as your own work. One of the common goals of Open Source is that you build off the work from others and then share it back for everyone’s benefit. Basing a project of yours off an existing Open Source project is fine, but blatantly stealing is crossing the line.
Bootstrap
Bootstrap is a front-end framework for building websites and applications. It has become extremely popular over the past couple of years and is used by individuals all the way up to large organisations.
Bootstrap is a versatile well written framework that allows you to very easily create, or modify a website’s front-end. The framework is perfect for large or small websites, and each component can be mixed and matched to achieve the desired outcome.
If you have ever tried to build a large front-end framework for a website, you will appreciate how difficult it can be to write clean and concise code that is able to scale across an entire project. It can be a pain to write CSS, only for it to be rendered useless if the design of a page changes. Writing CSS rules to encompass a huge website is difficult, and there aren’t many people in the world with the experience to do so.
If you are approaching writing a front-end framework for a large website or application for the first time, you will likely encounter many moments where you have to completely scrap large parts of your work because a change renders it useless. This can be annoying because you end up trying to just overwrite rules and so everything becomes a mess. Usually it’s better to just start again, but this can be time consuming.
Bootstrap is a perfect example of how to build a large scale front-end framework. Bootstrap includes many of the individual components that are common across modern websites and applications. It is also written in a way that makes it incredibly flexible to use.
By browsing through the code on GitHub you can see exactly what goes into creating such a flexible and extensible framework like Bootstrap. It’s not so much the actual CSS properties that go into creating a framework like Bootstrap, more so the rules and structure that make it so good.
Now you have the perfect example project to base your work off. You can simply grab a copy of the Bootstrap code and create yourself a working example site where you can steal their techniques to make your project so much better. Reading tutorials, watching videos or reading books is one thing, actually making something is completely different. If you are struggling with how to make a certain component so you don’t have to rewrite it should the usage of the component change, take a look what goes into creating a similar component in Bootstrap and base your work off that.
Learning from Open Source
The opportunity to learn from Open Source is not just limited to front-end development. No matter what level you are, or what experience you have with a certain language or technique, there will always be someone better than you on the Internet. A lot of these types of people actively work on Open Source projects within their niche.
When you start looking at different languages and different frameworks, you start to see a lot of similarities. It’s not a great surprise that many of these techniques or patterns have been stolen from different languages. By stealing good technique from a different source, you will greatly improve your project.
By standardising these patterns and techniques, you are able to push the project further along because a recognised better way of solving the problem will be used. There really isn’t much value in trying to come up with your own approach to solve an already solved problem.
Conclusion
By studying large scale and successful Open Source projects, you can greatly improve your technique as a Web Developer. Learning syntax is only part of learning how to programme. Arguably, when a syntax look up is only a Google search away, it is far more important to understand the structure and techniques to build websites and web applications at scale.
If you are looking to dramatically speed up your learning process, take on a large project and put yourself in the deep end. If you aren’t struggling on a daily basis, you are probably not working hard enough.
Take an Open Source project that inspires you and try to create something similar for yourself.
