First Look at a Programming Tutorial Concept

Online programming tutorials offer a terrible experience.

They are constrained by a linear format and lack of proper tooling. It is stunning to me that, with all the tools programmers build for themselves, and the multitude of programming education platforms out there, that no one has built a better process for writing, publishing, and consuming tutorials. Instead, nearly every guide out there is written in an editor meant for blogging, following a format that hasn't been updated since the first line of code was ever published.

I've had a concept for a new programming tutorial format for a long time, and finally took it upon myself to build a demo of the concept. It alleviates many of the existing problems with both the writing and the reading experience.

Instead of jumping back and forth between prose and code, you see them side by side.

Instead of getting lost trying to figure out what lines changed, the changes are immediately highlighted (in typical diff format).

Instead of copy/pasting lines of code into a WYSIWYG and trying to explain what changed, you write code, commit, and then write the tutorial step. The rest is magic.

This is, however, just a minimum viable concept. It's barely functional on the writing side, and inflexible (and likely buggy) on the reading side. My hope is not necessarily to turn this into a product or a platform myself, but to inspire someone else with more time and resources to do so.

Check out a demo of the new programming tutorial concept demo here.

(Be sure to scroll down through it.)

So please, steal this concept, make it big, improve the educational experience for future programmers, and maybe throw me a byline when you can.

Originally published on

Last updated on