Codeblocks can be used to add previewable exercises and examples to the chapters/pages of the course..

Codeblock example

You can use different options in the Codeblock form to add examples and exercises.

Add the following code snippet inside the code section of the form and then click Save changes. Choose language as html and codeblock type as lesson

<h1>This is the biggest heading tag</h1>
<p>
The heading tag above is an example of an HTML element used to define the most important heading of a section. It's typically displayed as a large, bold text. In this example, it signifies the significance of the content that follows, which could include introductory information, key points, or a summary of the section.
</p>

This will render an editor with the code inside the preview of the HTML code. You can check the rendered output in the preview section in the middle.

Examples

• Using HTML exercise

• Using SQL code blocks

• Advanced Codeblock config

Using HTML exercise

Using the field Codeblock type as "exercise" will render it as an exercise and for evaluation.

code:

<table>
  <tr>
    <td>Boxing</td>
    <td>Gloves</td>
  </tr>
  <tr>
    <td>Archery</td>
    <td>Arrow</td>
  </tr>
</table>


<solution>

</solution>
</codeblock>

solution:

<table>
  <tr>
    <th>Sport</th>
    <th>Equipment</th>
  </tr>
  <tr>
    <td>Boxing</td>
    <td>Gloves</td>
  </tr>
  <tr>
    <td>Archery</td>
    <td>Arrow</td>
  </tr>
</table>

The above code and solution will render an exercise:

Using SQL code blocks

To add examples or exercises with SQL, make sure to create/add the required table from the Assets options on which the query will be executed.

SELECT *

FROM students

WHERE course = 'Python'

Please ensure that added value of the attribute dbName "students1.db" is present in assets.

This will render the SQL editor along with the table preview. Users can run the query to view the query results.

Advanced Codeblock config

Not all options mentioned in the codeblock option will be available in the UI, to set advanced options such as evaluateAsync="true", we can add them to the Codeblock config inside Advanced properties.

These must be specified as JSON where key and values are enclosed in double-quotes.