View Source 🧐
Hello makers,
When I started programming, there was no GitHub. There was no world wide web. There was virtually no example source code to look through and reverse engineer.
Then came the internet, and web browsers, and the ability to View Source. Suddenly, I could look behind the scenes at something I thought was cool, and see how it was made.
That worked for a while. Then front-end tooling for the web became so prevalent that viewing a site's source was meaningless. Most code has been minimized and obfuscated beyond recognition. But at the same time, we now have an entire ecosystem of open source code available to anyone on GitHub.
This week, I'm sharing some of my favorite source code repositories, where anyone can View Source.
DOOM
https://github.com/id-Software/DOOM
You may have noticed that anytime new hardware is available, someone ports the classic FPS game DOOM to it. See It Runs Doom! It even runs on a toaster. The source code is built in C, and it's a masterclass in-game mechanics and resource optimization from the mind of John Carmack. It's also a lot of messy code by today's standards, but it's a testament to the genius it took to actually pull this off in 1993.
Kickstarter
iOS: https://github.com/kickstarter/ios-oss
Android: https://github.com/kickstarter/android-oss
Kickstarter open-sourced their mobile app codebases, and it's built completely around reactive programming. When I first set out to learn reactive programming, these were invaluable references for how to structure an app. Today, all of my mobile apps are based on the core principles of these repositories.
TensorFlow
https://github.com/tensorflow/tensorflow
TensorFlow is a platform for machine learning, originally built by the Google Brain team. It's built in Python and C++, and is a painstakingly well-organized codebase. Have a look behind the scenes of what some of the best of the best can do with code.
Bootstrap
https://github.com/twbs/bootstrap
The most popular front-end web toolkit, Bootstrap set the bar for modular HTML/CSS components. When starting out on a new web project, the way I structure my CSS is highly influenced by the methodology in Bootstrap. Splitting Sass files into core, typography, layouts, and UI elements make for clean, easy to understand code.
three.js
https://github.com/mrdoob/three.js
Back in the Flash days, I once built a 3D engine from scratch. It didn't do much (no shaders, no physics, etc.). But it could plot elements in a three-dimensional space, and render interactive wireframes. Today, we have three.js, and plenty of libraries built on top of it like A-Frame. The codebase is well organized and easy to dive right in. It covers a lot of technology under the hood, like WebGL, Canvas 2D, and CSS3D. The math module alone is enough to satisfy your left brain appetite.
What did I miss?
Are there any code repositories you find interesting? Reply and let me know so I can View Source!
Keep making, and thanks for reading! 🙌
Hit reply to tell me what you're making. I'm looking for anyone interested in talking about their own side-projects and maker journey, so speak up if you'd like to appear in Serial Maker. I'd also love to know what you thought of this issue, and what you want to hear about in the future. Check out the past editions if you missed them, and don't forget to continue the conversation on Discord!
Until next week,
Craig 👋