Javascript APIs for Jupyter output areas

Run from /demo/data directory:

python server.py

Then load ./demo/demo.html.

npm install jupyter-js-output-area

git clone https://github.com/jupyter/jupyter-js-output-area.git
cd jupyter-js-output-area

To build

npm install
npm run build

To display a Jupyter output area, you need to instantiate an output model and an output view, in that order.

import {OutputModel, OutputView} from 'jupyter-js-output-area';
let model = new OutputModel();
let view = new OutputView(model, document);

You can then display the output by appending it to your document.

document.querySelector('body').appendChild(view.el);

To have the output area display actual outputs, you can either pass it full Jupyter msgs

model.consumeMessage(msg);

or set the state directly

model.state = state;

You can save the state by accessing the same property

state = model.state;

TODO: Describe how to write custom models and views.