Skip to main content

5 Minute tutorial

This tutorial walks you through creating a simple React app with Remirror's Social Editor. You need to have a recent Node version installed.

First, let's set up a basic React app with CRA:

npx create-react-app cra-remirror --template typescript
cd cra-remirror
npm install

Next, we're installing Remirror:

npm add --save remirror @remirror/react @remirror/pm @emotion/react @emotion/styled @remirror/react-editors

Now, we can use Remirror in the app. For this, replace the srx/App.tsx with the following:

import { SocialEditor } from '@remirror/react-editors/social';
const USERS = [
{ id: 'joe', label: 'Joe' },
{ id: 'john', label: 'John' },
];
const TAGS = ['remirror', 'editor'];
function App() {
return (
<div style={{ padding: 16 }}>
<SocialEditor users={USERS} tags={TAGS} />
</div>
);
}
export default App;

Finally, you can run the app:

npm run start