Import Course Specification

This specification defines the structure of a course, including its steps and components, to ensure consistency and flexibility when building course content for the Telegram course constructor.

Course Fields

A course is defined by the following fields:

• title (string): The title of the course, displayed to users.

• description (string): A detailed description of the course. It can include information about the course purpose, content, and usage instructions.

• is_publish (boolean): A flag indicating whether the course is published and available to users.

• steps (array): A list of steps that make up the course. Each step represents a lesson, task, or activity.

---

Step Fields

Each step represents an individual unit of content or interaction in the course. Steps contain the following fields:

• name (string): The title of the step, displayed to users.

• text (string): A brief summary or description of the step’s content.

• type (string): The type of content or activity for the step (e.g., image, video, quiz).

• step_number (integer): A unique number identifying the step within the course.

• is_publish (boolean): A flag indicating whether the step is published and accessible to users.

• content_components (array): A list of components that make up the content of the step. Each component has a specific type and input data.

---

Component Fields

Components are building blocks for steps, defining specific types of content or interaction. Each component includes:

• type (string): The type of the component (e.g., text, mermaid, code_executor, image).

• sort_index (integer): The order in which the component appears within the step.

• input_data (object): Data specific to the component type, detailed below.

---

Supported Component Types

Text Component

Used for displaying formatted text.

• type: text

• input_data:

  • html (string): The HTML content to render, which may include headings, paragraphs, lists, and other HTML tags.

Mermaid Component

Used for visualizing diagrams and charts with Mermaid.js.

• type: mermaid

• input_data:

  • source (string): The Mermaid.js source code for the diagram.

Code Executor Component

Used for interactive code snippets that can be executed.

• type: code_executor

• input_data:

  • template (string): The preloaded code snippet.

  • isReadOnly (boolean): Indicates whether the code is editable.

  • title (string): A title or description for the code snippet.

  • sourceLang (string): The programming language (e.g., golang, javascript).

  • aceLang (string): The Ace editor language mode (e.g., ace/mode/golang).

  • langName (string): The display name of the programming language.

Image Component

Used to display images with optional captions.

• type: image

• input_data:

  • url (string): The URL of the image.

  • alt (string): The alternative text for the image.

  • caption (string): A description or caption for the image (optional).

---

Single-Choose Question Component

Used for creating single-choice questions with explanations for each option.

• type: single_choose

• input_data:

  • question (string): The question to be displayed.

  • options (array): A list of answer options, each with:

    • text (string): The text of the option.

    • isCorrect (boolean): Indicates if the option is correct.

    • explanation (string): Explanation for the option.

  • _settings (object): Additional settings for the component:

    • isIgnoreErrorAnswer (boolean): Determines if incorrect answers are ignored.

    • completedMessages (object): Messages displayed upon success or failure:

      • success (string): Message for a correct answer.

      • wrong (string): Message for an incorrect answer.

---

Multiple-Choose Question Component

Used for creating multiple-choice questions.

• type: multiple_choose

• input_data:

  • question (string): The question to be displayed.

  • options (array): A list of answer options, each with:

    • text (string): The text of the option.

    • isCorrect (boolean): Indicates if the option is correct.

    • explanation (string, optional): Explanation for the option.

  • _settings (object): Additional settings for the component:

    • checkboxOptions (object): Settings for threshold and error handling:

      • isIgnoreErrorAnswer (boolean): Determines if incorrect answers are ignored.

      • lowerThreshold (integer): Minimum number of correct answers required.

      • threshold (boolean): Indicates if the threshold setting is active.

    • completedMessages (object): Messages displayed upon success or failure:

      • success (string): Message for correct answers.

      • wrong (string): Message for incorrect answers.

---

Component Code

• type: code

• sort_index: An integer that specifies the order of the component within the step.

• input_data: An object containing the following fields:

  • code (string): The actual code to display.

  • language (string): The programming language of the code (e.g., go, python, javascript) for syntax highlighting.

  • _settings (object): Optional settings for the code display:

    • theme (string): The syntax highlighting theme for the code (e.g., atom, monokai, github).

---

Example Course JSON

{
  "title": "Coding Interview Problems in Python",
  "description": "Prepare for coding interviews with challenging Python problems.\n\nThis course is created with the Telegram course builder - coob - https://t.me/coob_app_bot",
  "is_publish": true,
  "steps": [
    {
      "name": "Step 1: Problem 'Reverse a Linked List'",
      "text": "Given the head of a linked list, reverse the list and return the reversed list.",
      "type": "image",
      "step_number": 1,
      "is_publish": true,
      "content_components": [
        {
          "type": "text",
          "input_data": {
            "html": "<h1>Reverse a Linked List</h1>"
          },
          "sort_index": 1
        },
        {
          "type": "text",
          "input_data": {
            "html": "<p>Given the head of a linked list, reverse the list and return the reversed list.</p><hr><h4>Example:</h4><pre><code>Input:\nhead = [1, 2, 3, 4, 5]\nOutput:\n[5, 4, 3, 2, 1]</code></pre><hr>"
          },
          "sort_index": 2
        },
        {
          "type": "mermaid",
          "input_data": {
            "source": "flowchart TD\n    A([Start]) --> B([Check if head is null])\n    B -- Yes --> C([Return null])\n    B -- No --> D([Initialize prev = null and curr = head])\n    D --> E([Iterate through the list])\n    E --> F([Reverse curr.next to prev])\n    F --> G([Move prev to curr])\n    G --> E\n    E -- End of list --> H([Return prev])"
          },
          "sort_index": 3
        },
        {
          "type": "text",
          "input_data": {
            "html": "<h3>Python Solution:</h3>"
          },
          "sort_index": 4
        },
        {
          "type": "code_executor",
          "input_data": {
            "template": "class ListNode:\n    def __init__(self, val=0, next=None):\n        self.val = val\n        self.next = next\n\ndef reverse_linked_list(head):\n    prev = None\n    curr = head\n    while curr:\n        next_temp = curr.next\n        curr.next = prev\n        prev = curr\n        curr = next_temp\n    return prev\n\n# Example Usage\nhead = ListNode(1, ListNode(2, ListNode(3, ListNode(4, ListNode(5)))))\nreversed_head = reverse_linked_list(head)\nwhile reversed_head:\n    print(reversed_head.val, end=' -> ')\n    reversed_head = reversed_head.next",
            "isReadOnly": false,
            "title": "Reverse a Linked List",
            "sourceLang": "python",
            "aceLang": "ace/mode/python",
            "langName": "Python"
          },
          "sort_index": 5
        },
        {
          "type": "text",
          "input_data": {
            "html": "<h3>Use Cases:</h3>\n<ul>\n<li><strong>Data Structures:</strong> Understanding how to manipulate linked lists.</li>\n<li><strong>Interview Preparation:</strong> A common problem in coding interviews.</li>\n<li><strong>Algorithm Practice:</strong> Builds foundational knowledge of pointers.</li>\n</ul>"
          },
          "sort_index": 6
        },
        {
          "input_data": {
            "_settings": {
              "theme": "atom"
            },
            "code": "package main\n\nimport (\n\t\"fmt\"\n)\n\nfunc findMax(nums []int) int {\n\tmax := nums[0]\n\tfor _, num := range nums {\n\t\tif num \u003e max {\n\t\t\tmax = num\n\t\t}\n\t}\n\treturn max\n}\n\nfunc main() {\n\tnums := []int{10, 20, 5, 8, 30, 15}\n\tfmt.Println(\"Максимальное число в массиве:\", findMax(nums))\n}",
            "language": "go"
          },
          "sort_index": 2,
          "type": "code"
        },
        {
          "type": "single_choose",
          "input_data": {
            "question": "What is the complexity of binary search?",
            "options": [
              {
                "text": "O(log(n))",
                "isCorrect": true,
                "explanation": "Yes, this is correct! Binary search divides the array into halves, resulting in logarithmic complexity."
              },
              {
                "text": "O(n)",
                "isCorrect": false,
                "explanation": "No, binary search does not scan all elements, so it’s not linear."
              },
              {
                "text": "O(1)",
                "isCorrect": false,
                "explanation": "No, the algorithm depends on the input size."
              }
            ],
            "_settings": {
              "isIgnoreErrorAnswer": false,
              "completedMessages": {
                "success": "Great job! Binary search has a complexity of O(log(n)).",
                "wrong": "Oops! Try again. Think about how the algorithm works."
              }
            }
          },
          "sort_index": 2
        },
        {
          "type": "multiple_choose",
          "input_data": {
            "question": "Which statements about binary search are true?",
            "options": [
              {
                "text": "Binary search works on unsorted arrays.",
                "isCorrect": false,
                "explanation": "Incorrect. Binary search requires a sorted array."
              },
              {
                "text": "Binary search divides the array in half on each step.",
                "isCorrect": true,
                "explanation": "Correct! This is the main principle of binary search."
              },
              {
                "text": "Binary search has a logarithmic complexity.",
                "isCorrect": true,
                "explanation": "Correct! This is why binary search is efficient."
              }
            ],
            "_settings": {
              "checkboxOptions": {
                "isIgnoreErrorAnswer": false,
                "lowerThreshold": 2,
                "threshold": true
              },
              "completedMessages": {
                "success": "You did a great job!",
                "wrong": "Sorry, one or more answers are incorrect."
              }
            }
          },
          "sort_index": 3
        }
      ]
    }
  ]
}