Making of an interactive course on codedamn

Hi everyone! Codedamn just released a new course on this platform. But why does it matter? Because this is one-of-a-kind course – it is an interactive coding course! Let’s dig a little deeper into what this means and how is this different from a YouTube playlist or udemy like course.

Introduction to the course

If you visit the course page, you might confuse it with a typical online video course from the look. But that couldn’t be farther from truth.

Course landing page

Let’s take a look, inside the course. To do that, scroll down to curriculum and click on Preview on any single item.

And this is the first time you see a course item, probably a video. But hang on, and try to switch to a hands-on exercise item:

Hands-on exercise inside a codedamn course

Beautiful! How is that even possible? Let’s discuss how this course is made.

New platform, built from scratch

Codedamn is a platform built from scratch, from code. We believe innovation in a given layer cannot happen by re-using things from the same layer. For example, you cannot create a website-builder by using website-builder. Complex and optimized softwares would require you to build things from scratch to some extent. Codedamn’s task runner software is completely custom and is built from ground up.

To create this course, there were two requirements:

Creating video content for the course
Creating hands-on-coding exercises

Video content is straightforward to create. You shoot, edit, render and upload for processing. For processing videos, codedamn has a robust pipeline built on top of AWS SQS, S3 and EC2 autoscaling groups inside a private VPC peered with MongoDB Atlas M10 cluster we use on production. Videos can be uploaded through creator panel.

For hands-on coding, we use creator panel located at creator.codedamn.com (pss.. do you want to sell your course on codedamn? Apply to be a content creator here).

The creator panel allows to build labs, upload videos, and organize content. It is under heavy development right now, but this is how a course organization screen looks like:

Creator panel course organization

This is the curriculum preview of the Advanced Practical JavaScript course you saw.

How I created this course?

Roughly, in the span of 10 days, this is the order I followed:

Came up with a very rough outline of course already broken down by sections. This helps to steer course in correct direction.
Shot all videos of a section every day. Sometimes I’d shoot the last few videos later, but I realized I had the best momentum when I was creating content in one go.
The next day, thought about hands-on-practice challenges that can be integrated within the course. Came up with a template and set up a few challenges. Thanks to codedamn creator panel and out of the box test templates, it is a breeze to setup these challenges.
Editing videos and rendering them takes some time too. After rendering, transcoding them for web format is done by the codedamn pipeline as described above.
Once everything is ready, the course is jumbled a little, to find a correct order fit.
Introduction videos are shot (the first two videos), and added to the course.
Course is finally launched on social media ?

How much time does it take to create a course like this?

I have personally observed the following numbers:

A video of ‘x’ minute duration is, on an average, made in Math.min(1.5x, x + 10) minutes. The rest of the part is either me being silent, or redoing some part of video.
Setting up every single challenge in a hands-on-practice lab is about 1-3 minutes of work. Every lab consists of around 3-5 challenges
Setting up the lab description, title takes about 3-5 minutes.
Setting up the solution repo and the default files repo takes anywhere from 1-4 minutes too.

So it roughly takes about 2-2.5x of the duration of the course to create a course like this. Creating a great 4 hour course? Be ready to invest 8-10 hours of work including:

Video shooting
Editing
Setting up challenges and labs
Rendering
Social media launch

I hope you enjoyed this journey of creating this course with me. Check out the Advanced Practical JavaScript course and let me know if you like it or not. Also, if you’re a creator and want to join codedamn to sell your courses, feel free to apply here.