Walkthroughs
Installing Slate
Slate is a monorepo divided up into multiple npm packages, so to install it you do You'll also need to be sure to install Slate's peer dependencies Note, if you'd rather use a pre-bundled version of Slate, you can yarn add slate and retrieve the bundled dist/slate. js file!
Adding Event Handlers
Okay, so you've got Slate installed and rendered on the page, and when you type in it, you can see the changes reflected. But you want to do more than just type a plaintext string.
Defining Custom Elements
In our previous example, we started with a paragraph, but we never actually told Slate anything about the paragraph block type. We just let it use its internal default renderer, which uses a plain old \<div> .
Applying Custom Formatting
In the previous guide we learned how to create custom block types that render chunks of text inside different containers. But Slate allows for more than just "blocks".
Executing Commands
Up until now, everything we've learned has been about how to write one-off logic for your specific Slate editor. But one of the most powerful things about Slate is that it lets you model your specific rich text "domain" however you'd like, and write less one-off code.
Saving to a Database
Now that you've learned the basics of how to add functionality to the Slate editor, you might be wondering how you'd go about saving the content you've been editing, such that you can come back to your app later and have it load. In this guide, we'll show you how to add logic to save your Slate content to a database for storage and retrieval later.
Using the Bundled Source
For most folks, you'll want to install Slate via npm , in which case you can follow the regular Installing Slate guide. But, if you'd rather install Slate by simply adding a \<script> tag to your application, this guide will help you.