Feedback: The inline editing gap in Notebook Kit's CLI workflow

[a10k]

Feedback from a long-time user. D3 and Observable have genuinely shaped how I think about code. Thanks for making these tools! 😊👌🏻

Background

I first encountered reactive notebooks watching Mike Bostock's d3.express keynote from OpenVis Conf 2017 on YouTube. It clicked immediately. I had early struggles with generators, viewof, and Observable's non-standard syntax, but the ability to work on small logical units, iterate in isolation, and watch changes cascade was transformative. Over time it deepened my understanding of the JS runtime, library internals, and module systems.

What made Observable notebooks powerful for me

Code and output in the same viewport. That's the superpower. Throw in a quick cell with d3.rollup(...) or tmp.xyz[0].map(d => ...) to explore a dataset, inspect it with Inputs.table, clean it up, make it visualization-ready — all with instant feedback. Mock something quickly so you get to the interesting problem first, then refine cells incrementally with changes propagating instantly.

Reusing code outside notebooks was never seamless, but not a major issue — once a problem is solved through iteration, I know what works and can extract it. I wished for better cell organization beyond linear notebooks, but creating separate notebooks and importing across them worked well enough.

Community VS Code extensions

The community extensions and unofficial compiler rabbit hole wasted lot of my time — they lose the code-next-to-output layout, which is the entire point.

Where Notebook Kit leaves me stuck

Native JS support was exciting. I use React and TypeScript, and the old htm + JSX-in-template-literals workarounds were painful. Right direction.

But there's a gap:

• Observable Desktop has the inline editing I need, but it's a closed macOS app disconnected from my CLI and browser workflow. I'd honestly prefer this on observablehq.com.
• The CLI (notebooks preview) gives me the reactive runtime with hot reload, but I'm editing in VS Code and viewing output in a separate browser window. No inline code + output. At this point I could just use Vite + HMR.

What would help

A VS Code notebook interface — like the Python/Jupyter integration — where cells render inline with output. VS Code's Notebook API supports this pattern, and its shared webview architecture fits Observable's reactive model. The Gordon Smith extension (vscode-ojs) is working toward Notebook Kit support, but official backing would carry more weight and a smooth DX where I install the official extension, iterate and see the output, like the web version but locally, and the files and code are all local so I can use other workflows as needed.

Alternatively, bringing the Desktop editing experience to the web (as mentioned in the Notebooks 2.0 docs) would also solve this — the browser was always the natural home.

What I still do today

I still reach for the original Observable notebooks for data exploration and quick iteration — inspecting objects, rolling up datasets, prototyping visualizations, and occasionally building React components cell-by-cell. That workflow remains unmatched, and I wish the original notebooks supported TypeScript natively. I just copy the whole notebook and share with my AI coding tool of the month to have it setup normal tsx code and components based on my Observable notebook prototype.

---

Most of this may already be on your roadmap. I don't want to come across as dismissive of the work behind Notebook Kit and Desktop — they've made my work significantly better. Sharing this as a data point from someone who loves the reactive model and is struggling to find a place for Notebook Kit in their workflow.

[mbostock]

Thank you for the feedback and for using our tools. We’re actively working on bringing Notebooks 2.0 to the web! We should have an update for you Real Soon Now (by which I mean we are aiming for next month but haven’t publicly committed to that date yet).

We’ll also work on some file watching capabilities for Observable Desktop that will improve hybrid workflows (simultaneous editing inside Desktop and via CLI or other editors). But that’s currently lower priority than bringing Notebooks 2.0 to the web.