Getting started with your first interactive course on codedamn

  • codedamn official's profile image
    codedamn official
Getting started with your first interactive course on codedamn

This is the chapter 2 of the blog series of building an interactive course on codedamn. The pre-reqs of this blog post is that you should already have a codedamn creator account. Let’s begin.

Chapter 1: Introduction to codedamn creator panel
Chapter 2 (currently reading): Getting started with your first interactive course
Chapter 3: Building an interactive lab course item

The Dashboard

When you login, the first screen you see would be a dashboard like interface. Don’t be surprised if things are a little different as we’re updating the UI/UX all the time. The fundamental concepts would remain the same.

To create a new course, click on the + icon in the bottom right corner of the screen and hit “Create Course”

Course Metadata

In this screen, you’d have to fill out the metadata of your course. Most of the things you see here can be changed later (and aren’t even required right away), but the Course slug is permanent. Course slug is the part of the URL where your course is accessible.

Slug is globally unique. For example, a valid course slug is javascript-dsa-questions and if set, your course would be accessible at mehulmpt.codedamn.dev/javascript-dsa-course (mehulmpt being my username).

Once you press “Save Changes” button at the bottom, your course is now created and you would be able to see it by clicking on Interactive Courses from the sidebar. Let’s keep going.

Individual Course Items

As soon as you create your course metadata, you’ll be redirected to second screen saying “Curriculum”

This is your curriculum designer where you would want to spend most of your time. Every course is broken down into sections and every section can contain one or more course item.

Your first step is to add a Section by clicking “Add Section” button. This section can contain 4 different course items for now:

Video
Quiz
Markdown-enabled article
Hands-on practice lab

In this blog post, we will focus on the first three course items. We will learn how to create an interactive course lab in the next blog.

Creating a video course item

When you click on + Video in the curriculum designer, you only add a video placeholder in your course. You still need to link an uploaded video to your course item. You would see something like this:

Let’s understand what this means:

Your video title is “Untitled Video” – you can change it by clicking the pencil button.
The green $ button says that this video is only available if a person is enrolled in the course (you can disable monetization for a few videos to make them public for all – best for the first few videos of the course)
The glowing light on pencil button means there is no video associated with this course item yet. Clicking on this would enable an interface to link a video.

On clicking Edit pencil icon, you’ll see a dialog box. The important part here is “Missing video” on the left.

You can upload new videos in bulk from Upload button on the top right. Once you upload a bunch of videos, you might need to wait for a few hours for them to show in video library.

Video Library is the place where all of your uploaded videos are stored for your account. You can link a video to a course item by selecting that from video library. Clicking on Add Video From Library button under Missing Video should open a video library:

Note: Even processing status might take 20-30 minutes to show up. Therefore it is best to upload all videos together a night before you want to use them.

As soon as they’re ready, clicking on Use video button would link it to the course item.

Creating a Quiz course item

A quiz can be of two types:

Single answer correct
Multiple answer correct

Clicking on + Quiz would add a new quiz course item where you can customize the title and answers.

Creating an Article course Item

Article would allow you to present anything you want in a structured blog-like format. We power our articles with markdown and it is possible to use most of the markdown syntax available.

If you’d like to include a functionality here, please reach out to us.

Creating an Interactive lab on codedamn

Adding an interactive lab is probably the most interesting part of using codedamn for building a course. This part is important and has a small learning curve, therefore we will discuss this in the next chapter of this blog series.

Chapter 1: Introduction to codedamn creator panel
Chapter 2 (currently reading): Getting started with your first interactive course
Chapter 3: Building an interactive lab course item