Get started¶
In order to use Thebe, you must take the following steps on a page:
Load the thebe javascript bundle¶
The Thebe Javascript is most-easily obtained from a CDN. You can load the javascript library from a CDN by including this on a page:
<script src="https://unpkg.com/thebe@latest/lib/index.js"></script>
Alternatively, you can download the bundle and include it along with your site.
Configure Thebe in your page’s HTML¶
Thebe looks for a specific HTML block for its configuration. This happens when Thebe is “bootstrapped” (i.e., launched).
The configuration block has the following structure:
<script type="text/x-thebe-config">
{
a: collection
of: key
val: pairs
}
</script>
See Configure Thebe for information about how and what to configure with Thebe.
Bootstrap Thebe on the page¶
If the Thebe Javascript bundle is loaded, and the configuration file is present, you may bootstrap (i.e., launch) Thebe by calling the following Javascript function:
thebelab.bootstrap()
This will take one or more of the following actions:
Re render the code cells to make them live cells. (the rendering can handle cells that contain a mixture of inputs and ouputs distinguished by prompts)
(optional) Request a notebook server from Binder
(optional) Request a Jupyter kernel from a notebook server.
Calling the bootstrap function is generally accomplished by connecting it to the “click” event of a button on the page.
Tip
If bootstrap: true is in the Thebe configuration, this will be triggered
automatically upon page load.