This project is part of a two part live stream series where we explore building a custom rich text editor which can add metadata to image assets in the Contentful UI.
In part one, we explore the developer experience around fleshing out an idea and using the Contentful App Framework, Forma-36, and the open source field editors to build our rich text editor.
The code in this repo is the product of part two in our series, where we build out an app that matches rich text assets to modifiable fields. We recommend you follow along with the live streams in order to fully understand the context when running this app locally.
This project was bootstrapped using the Create Contentful App which utilizes Create React App under the hood. If you are familiar with running a Node process, you can follow the steps outlined below.
If you are new to the Contentful App Framework, we recommend learning how to build and run an app by following our detailed tutorial.
In the project directory, you can run:
Creates or updates your app definition in Contentful, and runs the app in development mode. Open your app to view it in the browser.
The page will reload if you make edits. You will also see any lint errors in the console.
Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.
The build is minified and the filenames include the hashes. Your app is ready to be deployed!
To make your app look and feel like Contentful use the following libraries:
- Forma 36 – Contentful's design system
- Contentful Field Editors – Contentful's field editor React components
Read more and check out the video on how to use the CLI.
Create Contentful App uses Create React App. You can learn more in the Create React App documentation and how to further customize your app.