Recipes Collection

Hi all, and thanks for Observable! (been hanging for it since mike’s talk last year).

A reflection on the featured collections …

I’ve recently been trying to piece together a certain bit of interactivity. It ended up working nicely in a relatively succinct and idiomatic (I hope) way. But it required taking bits and pieces from a few of the notebooks in the Introduction and Techniques collections and those linked to in this forum. As well as, of course, understanding what was going on!

It then struck me that the Introduction and Techniques notebooks tend to focus on particular tools, such as promises and the mutable and viewof operators (is that what they are called?). They’re bit like documentation, it seems. Which is obviously necessary.

But what would have really helped me is a collection of recipes, where the title and concept of a notebook are focused on how to achieve a particular end or function. And obviously you have been making such notebooks for us! But, it seems that many of the notebooks people are making (including the one I was making) are essentially such experimental recipes. So, I thought I would throw it out there that a user generated collection of recipe notebooks could be quite nice for aggregating best/idiomatic/experimental practice and serving as a launching pad for discussing+experimenting with the Observable features.

Or, if a collection is too open, perhaps a forum category or some aspect of the coming social features you’ve spoken of … ?

Anyhow … thanks again for Observable!

Nice idea! Can you give us a few examples of the sort of recipes you’d like to see?


Didn’t know there was a limit on the number of links for new users. I was feeling ranty, so there were a lot.

I put all the links in a notebook, if they’re helpful. Anything in [square brackets] was supposed to be a link. You’ll find the same labels in the linked notebook.


Sure …

Probably all notebooks made by yourself/tom/jashkenas in response to a query from the forum could be collected together. For example, the two posts/notebooks between my initial post and this reply fit the bill nicely:

  • [Jeremy’s Response to a Slider Query]
  • [Tom’s Table Notebook]

Building on all the Generators and Promises stuff, I can see a notebook about automating and animating that brings those techniques together, along with how it is all stitched together with updating the page in some fashion.

Extending the above, a set of Play/Pause/Stop button recipes would help (that’s what I was working on), like [this canvas animation from Jeremy] that was a reply to a query from this forum.

Extending again, this leads to the whole multi-input or shared-state or mutable input pattern that seems to have come up a bit. You’ve obviously made a few notebooks on that front (thank you!). But, I suspect I would have enjoyed reading through your [Five Minute Intro Notebook] followed by a “How to have a play button that also moves a slider” notebook (which, for me, kinda became [this contact networks notebook] before getting the technical insight about using and mutating views from your featured notebooks ([Brief Intro to viewof], [Views are Mutable]).

As you say at the bottom of [Views are Mutable Values], there are a few ways of going about these sorts of inputs (contrasting, for instance Views are Mutable with Jeremy’s [Sliders sharing a value], and I think it would be nice to bring them together, not only for convenience, but as a way of learning the trade offs you reference and the technicalities of the fundamental tools/features.

Otherwise, I can imagine much of the tinkering we’re all doing here could qualify as an interesting recipe for others to use. I suspect most of the cool notebooks that we’re all saving or forking involve some neat combination of techniques.
Nonetheless, some quick examples that could probably be dropped straight away into a sort of Recipes Collection:

  • [Jeremy’s Inputs Notebook]
  • in a similar vein, [Kelly’s Little Things Notebook] (making “rich input elements” could be a whole set of recipes)
  • [SVG Input] (related to the all of the above I guess)

The idea is really to replicate the quasi-tutorial role that a curated and/or searchable collection or gallery of illustrative examples serve - much like your bl.ocks (and blockbulder search webpage), the [Matplotlib gallery - the only way people actually understand matplotlib ;P] etc.

There’s obviously overlap with the techniques collection, but the key difference matters I think. Starting with a “what” you want to achieve and stepping through the “how” (or “hows”).

I think [Jake VanderPlas] summed up just how much people will ignore your documentation and instead copy and paste from examples: https://twitter.com/jakevdp/status/978665789598257152

Right now, especially for those who (only) know how to make some good DOM API spaghetti, getting into the groove of Observable does probably involve some getting used and adjustment, which means any novelty in a notebook potentially qualifies it as a useful “recipe”.