H5P Stanalone - Django Integration

H5P is a standard for reusable, sharable learning content. I have been working to bring H5P support to Django-based projects for a while now, and I have found the easiest integration so far. The h5p-standalong project is a pure Javascript implementation. By adding the hooks for server-side content delivery and progress recording, we can focus on the parts that Django does best, and leave the Javascript to the h5p-standalone library.

by Dave on March 10, 2020, 2:06 a.m.

I have been working with H5P learning content for a few years now. I started working on a Python interpretation of the PHP libraries, and got stuck trying to manage the content library dependencies. The code is up on my GitHub. At the same time another group was working on a more direct PHP to Python port H5PP, which did meet the basic requirements, but was definitely not as Python-y as I would have liked. I helped port the code to Django 2.2 and Python 3 along the way. It looks like development on that end has slowed down. It is difficult to track the PHP server side implementation in Python, there isn’t a lot of documentation besides the code. At any rate, the server-side code is not the interesting part of H5P. H5P content contains all the Javascript libraries to deliver the interactive content. The server is used to manage users, permissions, and storing user data and progress. The client side code has hooks to send the data to the server, so we don’t need a PHP implementation for that. The PHP implementation also does all the content library dependency tracking and resolution, to deliver the javascript code for each H5P content bundle. This seems overly complex, as all the specification for the Javascript requirements is contained in the content JSON definition.

H5P Standalone handles all this in Javascript on the client side. It means we can focus on the server specific code, and let the Javascript sort itself out. Right now the H5P Standalone project serves up content quite well. I recently contributed code to allow projects to store content support libraries in a central location, which makes it easier to manage them and integrate it within a Django project. The next step is to fully enable the content editor library in standalone mode as well. Right now I am working on building the appropriate webpack bundles from the editor library, and loading the editor in the browser. From there it should be straightforward to enable server side integration to load content for editing, and save content.

After I get the content editor working, I plan on updating my H5P simple course management system to fully use H5P standalone. It should allow for a quick proof-of-concept for anyone who is interested in adding H5P interactive content to their Django project.