The aim of Elm Notebook is to provide something akin to Jupyter Notebooks, but for Elm: an app with cells in which you can put both text and code, and where code in a cell can be executed, producing output of various kinds — text, image, chart, animation, etc. I've thought of it mostly as a teaching tool, but such an app could also be good for code demonstrations, experimentation, just playing around, etc.

I'd like Elm Notebook to be something as fun, useful, and as versatile as we can make it. The project is, of course, open source: github.com/jxxcarlson/elm-notebook.

Elm Notebook is very much a work-in-progress and I'd like to keep this experimental status in mind for a good while so that the project can adopt good ideas without undue friction.

Elm Notebook is based on elm-interpreter by @minibill (Leonardo Taglialegne).

You edit a cell by clicking on it, and you execute the code in it with control-RETURN, at which point the code is passed to elm-interpreter, with the result of the computation displayed below the cell:

Certain cells are evaluated in a special way. For example, a cell may render svg that is defined in a prior cell:

A cell may render a chart based on CSV data loaded into the app:

Here the chart command is an interface to terezka/charts

The above a chart of the recession velocity of galaxies versus their distance from the earth. The data is from Edwin Hubble's 1929 paper, "A Relation Between Distance and Radial Velocity Among Extra-Galactic Nebulae." This is the paper that launched the field of observational cosmology and gave the first experimental evidence for the expansion of the universe.

A cell may render an animation: The red dot moves in an ellipse around the yellow dot at the center of the ellipse. This is not a simulation of planetary motion: for that the motion has to obey Kepler's laws. More work to do!

In this case the relevant code comes in two cells. The first defines a function k :

> k t = circle (400 + (370 * cos t)) (200 + (170 * sin t)) 10 "red"

The second renders the animation:

> evalSvg [k (ticks / 30), circle 400 200 20 "yellow"]

Here ticks is part of the runtime that gives access to a discrete series of clock ticks.

In addition to access to a clock, the runtime provides access to a vector of random numbers in the range [0,1]: on each tick of the clock. This is illustrated by the next animation, a simulation of gambler's ruin.

Notebooks can be public or private. In the screenshot below, I'm signed in as myself, looking at my notebooks. Italicized titles are public, non-italicized (like "Data Sources") are private. If you click on the Public tab, you will see a list of other users's public notebooks. The examples discussed above are takend from the public notebooks listed here.

Public notebooks can be cloned using the Clone button. This button, located in the footer, bottom right, is displayed whenever another user's public notebook is selected. A cloned notebook belongs to you and can be used as you like. Cloned notebooks are useful in a classroom setting. This way the instructor can deliver material to the students.