5.9. Creating Question Modules

Now that you’ve gone through a few examples of both the front- and back-end code for question modules, you’re ready to create your own.

The simplest way to get started is to copy one of the example questions into a new question. Be sure to change the appropriate names so that the question is actually loaded.

To copy a question, run:

python cli/developer.py copy-question {Existing Question} {New Question}

Going back to our example of a SortingQuestion, here’s a recommended directory layout:

questions/q/
   SortingQuestion
      templates/
         question.html
      __init__.py
      question.py
      SortingQuestion.jsx

This uses the recommended single-template approach, where all of the data for viewing the question and submission result is present directly in the React component.

With an example or existing question copied, you can modify the question to fit your needs.

Compiling Question’s React Component

To compile and bundle the React component, run:

$ gulp questions -q SortingQuestion