Deploy instant assessment quizzes with Jupyter notebook tools
An standalone app suitable for complimenting e-learning web applications.
If your teaching resources include HTML-based script such as formulas, this tutorial will show you how to easily tabulate content with the list of widget components from Jupyter notebook module — ipywidgets and deploy using Voilà and ngrok.
In this tutorial, you will be able to apply and share an elementary-level assessment quiz app that allows user to get interactions with a single click. The examples below include multiple-option, input, diagrams, formulas and answer key functions.
widgets, Layout, Box, GridspecLayout
Create a basic mcq widget function:
Assign and specify the variables within the ‘multipleChoice_widget’ function with the question description, options, correct answer, followed by feedback. Alternatively, you can change the button variables to fit a suitable method.
For mathematical formulas, try using Tex-based language with the Label or HTMLMath widget:
you may also apply a row and column template for Tex-based options:
Some useful links:
Reference diagrams in templates:
Load HTML widgets with embedded http links and basic layout features or tabular diagrams with GridspecLayout for grid style templates.
Assign and specify the variables within the ‘textinputquiz_widget’ function with the description, input, followed by feedback output. Alternatively, you can adjust and omit these variables to fit a suitable method.
Lastly, before you deploy align the quiz parts with VBox and HBox and save Jupyter notebook file in .ipynb format and:
- Install Voila to host your completed quiz app:
Voilà can be used to run, convert, and serve a Jupyter notebook as a browser app. A Python virtual environment creates an isolated environment for separate project dependencies. Run the command in a pipenv/conda/venv environment:
where <path> is the directory of your file. Merge the code cells and run the app, the browser should pop up and show the output. To share on a url, follow the steps below:
ngrok http 8866
where the local port for the app is forwarded. Powershell is a windows console for command-line task automation providing for the ngrok task. A ngrok url will be generated and your quiz app is ready!