ac009527 / TypeCell

Welcome to TypeCell! An open source live programming environment. Together, we want to make it a lot easier to build software, and ultimately to understand, build and share knowledge.

Features

• Open Source, cell-based notebook environment
• Same, powerful editing experience as VS Code
• Full TypeScript support! (no weird custom language constructs)
• Reactive Runtime, cells automatically re-evaluate when their dependencies update (learn more)
• Import NPM packages + types just by writing an import statement
• Support for real-time collaboration (using Yjs)
• Runs on top of Matrix using Matrix-CRDT.

Try the Tutorial to get started!

Documentation 📖

Tutorial

Complete the tutorial to get familiar with TypeCell:

» Interactive introduction

Manual

We've written about the main functionality of TypeCell in the manual:

• Notebooks and cells
• TypeScript and exports
• Reactive variables
• Working with user input
• Imports & NPM
• Collaboration

Demos

Another good way to learn is to check out some notebooks from our community:

» View demo notebooks

Feedback 🙋‍♂️🙋‍♀️

We'd love to hear your thoughts and see your experiments, so come and say hi on Discord or Matrix.

Contributing 🙌

See CONTRIBUTING.md for more info and guidance on how to run the project (TLDR: just use npm start).

TypeCell is organised as a monorepo containing several packages. Directory structure:

typecell
├── packages
│   ├── common          - Utility functions shared across the codebase
│   ├── editor          - The main React application
│   ├── engine          - The live-code execution engine
│   ├── packager        - Tool to bundle TypeCell notebook apps (WIP)
│   └── parsers         - Helpers to convert to / from TypeCell notebooks
├── patches             - patch-package patches
└── test-util           - Server and data for unit tests

The codebase is automatically tested using Vitest and Playwright.

Credits ❤️

We build on top of some really great technologies:

• Monaco: the open source editor that also powers VS Code
• Yjs: CRDT for multi-user collaboration
• MobX: for our Reactive Runtime
• Matrix: the backend of TypeCell.org is a single Matrix instance, using Matrix-CRDT to store and collaborate on "documents as chat rooms"
• ESM.sh: for dynamic ESM imports from NPM
• Typescript: for our compiler and language toolkit

TypeCell is proudly sponsored by the renowned NLNet foundation who are on a mission to support an open internet, and protect the privacy and security of internet users. Check them out!