Open edX

How to create a basic Open edX's XBlock?

What is a Open edX XBlock?

The XBlock specification is a component architecture designed to make it easier to create new online educational experiences inside an Open edX platform.

In Open edX, XBlocks can be used to represent individual problems, web-formatted text and videos, interactive simulations and labs, or collaborative learning experiences. Furthermore, XBlocks are composable, allowing an XBlock developer to control the display of other XBlocks to compose lessons, sections, and entire courses.

How to create a basic XBlock?

An XBlock developer does not need to download and run the entire edx-platform developer stack or to know anything about the technologies that edX uses to provide the XBlock runtime. Instead, XBlock developers writing with edX in mind can work from the xblock-sdk and deploy their work on any platform that is compatible with XBlocks.

Any web application can be an XBlock runtime by implementing the XBlock API. Note that the XBlock API is not a RESTful API.

It is also possible to develop Xblocks without using the XBlock-sdk, within edX platform, but in this tutorial we focus on doing so with sdk, otherwise there may be more problems and incompatibilities.

Prerequisites

http://edx.readthedocs.io/projects/xblock-tutorial/en/latest/getting_started/prereqs.html

This tutorial is for developers who are new to XBlock. To use this tutorial, you should have basic knowledge of the following technologies.
- Python
- JavaScript
- HTML and CSS
- Python virtualenv
- Git

When you have installed all prerequisites, you are ready to set up the XBlock SDK in a virtual environment. To do this, complete the following steps.

At t he command prompt, run the following command to create the directory, and change to it.

mkdir name_that_you_prefer
cd name_that_you_prefer
# Then create the virtual environment in your name_that_you_prefer directory.
virtualenv venv

# Run  the following command to activate the virtual environment.
source venv/bin/activate

# When the virtual environment is activated, the command prompt shows the name of the virtual directory in parentheses.

(venv)

- Clone the XBlock Software Development Kit:

The XBlock SDK is a Python application you use to help you build new XBlocks. The XBlock SDK contains three main components:

  • An XBlock creation tool that builds the skeleton of a new XBlock.
  • An XBlock runtime for viewing and testing your XBlocks during development.
  • Sample XBlocks that you can use as the starting point for new XBlocks, and for your own learning.​

In the name_that_you_prefer directory, run the following command to clone the XBlock SDK repository from GitHub.

git clone https://github.com/edx/xblock-sdk.git
# Run the following command to change to the xblock-sdk directory.
cd xblock-sdk
# Run  the following command to install the XBlock SDK requirements.
pip install -r requirements/base.txt
# Return  to the name_that_you_prefer directory, where you will perform the rest of your work.
cd ..


You use the XBlock SDK to create skeleton files for an XBlock. To do this, follow these steps at a command prompt.

Run the fo llowing command to create the skeleton files for the XBlock.

xblock-sdk/bin/workbench-make-xblock

Instructions in the command window instruct you to determine a short name and a class name. Follow the guidelines in the command window to determine the names that you want to use.

You will be prompted for two pieces of information:

* Short name: a single word, all lower-case, for directory and file
 names. For a hologram 3-D XBlock, you might choose "holo3d".

* Class name: a valid Python class name.  It's best if this ends with
 "XBlock", so for our hologram XBlock, you might choose
 "Hologram3dXBlock".

Once you specify those two names, a directory is created in the
``xblock_development`` directory containing the new project.

If you don't want to create the project here, or you enter a name
incorrectly, type Ctrl-C to stop the creation script.  If you don't want
the resulting project, delete the directory it created.

At the command prompt, enter the Short Name you selected for your XBlock and enter the Class name you selected for your XBlock.

$ Short name: myxblock
$ Class name: MyXBlock

The skeleton files for the XBlock are created in the myxblock directory. For more information about the XBlock files, see Anatomy of an XBlock.

Install the XBlock:

After you create the XBlock, you install it in the XBlock SDK.
In the name_that_you_prefer directory, use pip to install your XBlock.

pip install -e myxblock

Create the SQLite Database:

Before running the XBlock SDK the first time, you must create the SQLite database.

In the name_that_you_prefer directory, run the following command to create the database.

Run the XBlock SDK Server:

To see the web interface of the XBlock SDK, you must run the SDK server.
In the name_that_you_prefer directory, run the following command to start the server.

python xblock-sdk/manage.py runserver

Then test that the XBlock SDK is running. In a browser, go to http://localhost:8000. You should see the following page.

**To customize your XBlock, you can see this page:**

http://edx.readthedocs.io/projects/xblock-tutorial/en/latest/customize/index.html

About the author

Let’s have a coffee and talk about your project

START A PROJECT

Let’s have a coffee and talk about your project

START A PROJECT

We use cookies to ensure you get the best experience on our website. More info.

Accept