Overview:
Forma 36 is an open-source design system created by Contentful to simplify UI creation for digital teams building and extending Contentful products. It provides tools and guidance to reduce the overhead of creating user interfaces.
Features:
- Creating new packages: Use Plop to scaffold new packages and generate relevant files and imports.
- Development: Install dependencies and build packages for local development using npm scripts.
- Storybook for f36-components: Use Storybook with the react component library to develop components.
- Commits & releases: Use Commitzen CLI to create conventional commit messages and release new commits on the main branch.
- Testing with your own project locally: Test changes to a package in your own project by building the changes and linking to the local version of the package.
- Get involved: Welcome PRs and contributions to the repositories.
- Reach out to us: Connect with Contentful community Slack channel #forma36 for announcements and updates.
- Bug reporting and feature proposals: Use issue templates to report bugs or propose new features.
Installation:
To install Forma 36, follow these steps:
- Run
npm run-script generate
in the root of the repository to use Plop and scaffold new packages. - Install dependencies by running
npm i
in the root of the repository. - Build all packages by running
npm run-script build
in the root of the repository. - Follow the package-specific instructions provided in their README files for further development.
For local testing in your own project:
- Ensure latest changes in the desired package have been built by running
npm run-script build
in the package’s directory. - Link to the local version of the package by running
npm link NAME_OF_PACKAGE
in your local project’s directory (e.g.,npm link @contentful/f36-components
).
Summary:
Forma 36 is an open-source design system by Contentful that aims to simplify UI development for digital teams building and expanding Contentful products. It offers features like package creation, local development, using Storybook for component development, committing and releasing changes, testing changes locally, and contributing to the project. The installation guide provides step-by-step instructions for setting up Forma 36 and using it in your own projects.