System Overview

Algebrakit is a system with the following main components:

  1. The web service exposes Algebrakit's evaluation engine, handles exercise sessions, and allows access to exercises stored in Algebrakit's CMS.
  2. The frontend API handles web component configuration, learning events, and more.
  3. The frontend web components are injected into your web page and interact between Algebrakit and the student.
  4. The Algebrakit CMS is an online environment where authors can create and manage Algebrakit exercises.

Exercise life cycle

The life cycle of an exercise is as follows:

  1. Create sessions: Call the Algebrakit web service from your LMS backend to create an empty session for every exercise you want to start. You can identify sessions by a unique session ID.
  2. Insert web components: Insert a custom HTML tag with the session ID for each web component. Each tag will transform automatically into a functioning Algebrakit exercise or question type.
  3. Session events: The web component initializes itself and communicates with Algebrakit for evaluations, hints, and error feedback.
  4. Collect results: Use the session ID to retrieve scoring results from Algebrakit.

Exercise Flow

This approach guarantees no ‘confidential’ information, such as the exercise's answer, is sent to the front end. It also minimizes the payload size of web service requests.

Frontend - your web page

To use Algebrakit in your solution, you must load the frontend API first. You include exercises through the dedicated tags, referring to the session through the session ID. The frontend API will automatically detect the tags, determine the question type, and launch the corresponding web component.

<html>
   <head></head>
   <body>
      ...  <!-- Whatever your page contains... -->

      <!--Insert an Algebrakit question here -->
      <akit-exercise session-id="{id}"></akit-exercise>

      ...  <!-- Whatever your page contains... -->

      <!--Load frontend API -->
      <script src="https://widgets.algebrakit.com/akit-widgets.min.js"></script>
   </body>
</html>

Note that the sessions are created server-side through a call to the Algebrakit web service.

Also, note that this is a minimal setup; see the frontend API documentation to read more about configuration, listening to events, and sending commands.