Quickstart

If you want to get started with Univer as quickly as possible, you've come to the right place! This page will guide you through building a working Univer app in just a few minutes.

Play Online

You can play with Univer online without installing anything. Just click the link below and start using Univer right away.

📝 Univer Doc^RC

Starter Kit

If you prefer to start with a local development environment, you can use the following starter kits to create a new Univer app in just a few seconds.

Run the following command requires your device has nodejs >= 18, npm >= 8 and git installed.

Shell

npx degit dream-num/univer-doc-start-kit univer-doc-start-kitcd univer-doc-start-kitnpm installnpm run dev

Run the following command requires your device has nodejs >= 18, pnpm >= 7 and git installed.

Shell

pnpm dlx degit dream-num/univer-doc-start-kit univer-doc-start-kitcd univer-doc-start-kitpnpm installpnpm dev

Great job on your first steps with Univer! You've successfully created your first project and gotten a taste of what Univer can do.

Basic Concepts

Before diving deeper into Univer, please read this document to understand the basic concepts of Univer, which will help you use Univer more smoothly.

The basic concepts include:

Plugin
Snapshot
Command
Facade API

Plugins

All of Univer's features are provided by plugins, which are the basic building blocks of Univer. Multiple plugins combined together form a Univer application.

The responsibilities of plugins include:

Implementing features, such as @univerjs/docs-hyper-link, which provides the hyperlink model and commands for Univer Docs.
Providing some basic capabilities, such as @univerjs/engine-render provides rendering capabilities.

You can combine Univer's plugins to customize a Univer application that meets your requirements and avoid loading unnecessary code. You can also extend Univer's functionality by writing plugins to meet personalized needs.

Hyperlinks to learn how to add a Docs feature in preset or plugin mode.
Univer Architecture to learn more about Univer's architecture design.

Snapshot

Univer Docs uses IDocumentData as its snapshot format. It describes the document body, document-level styles, headers and footers, drawings, lists, tables, and plugin resources.

The optional resources field stores data defined by plugins.

Caution

Note! Univer's snapshot is only used to store data. It does not reflect the latest document status at runtime! If you want to save the document status as a snapshot, use the method to save the snapshot on the Facade API.

Command

In Univer Docs, changes to document content and formatting are executed through commands. This makes it possible to track changes, implement undo, redo, and collaborative editing, and coordinate related features.

The Facade API prepares the parameters and executes the corresponding Docs commands behind the scenes.

Caution

Do not modify the snapshot directly! This will not take effect and will not trigger the update of views or UI. Please modify data through commands or the Facade API.

Facade API

Due to the high complexity of office applications, Univer's architecture is also very complex. To make it easier for developers to use Univer, we provide the Facade API, which is a wrapper for Univer's first-party plugins, providing simpler interfaces that make it easier for developers to use Univer.

The Facade API is actively being improved. If you have any questions or requirements, please submit an issue on GitHub.

The Facade API is a high-level API that abstracts the underlying details. While it simplifies common tasks, complex features may require understanding Univer's architecture and using the low-level API directly.

How is this guide?