Notebook to Vanilla JavaScript Steps

Observable’s runtime doesn’t require any server resources, it can be run entirely in the browser. Here’s an exercise that might be enlightening. Try downloading the tarball of any of your favorite notebooks and copying its contents (you really just need the .js file and index.html) into an empty folder.

If you open that index.html file directly in your browser, you’re likely to get CORS errors, so start up a simple HTTP webserver (like the python one described in this post) and then open index.html using that server and it should work.

Note that all this local server is doing is just passing the HTML and JS files to the browser. There’s nothing else necessary on the server side. If you have webhosting of your own, you could also just copy the .js and index.html files into a folder there and see that your notebook works without any fancy server environment.

In fact, you can copy your files to a github “gist” and create a fully-functioning block from an Observable notebook this way as well:

2 Likes