Component Starter Kit (CSK)

The Component Starter Kit offers the following:

  • A set of modern, theme-able components to learn about Uniform in the quickest way possible and to use these components to build your own project.
  • An example of how to activate an existing component library in Uniform Canvas. If you already invested in your design system and have a robust component library, you can bring it into Uniform exactly the same way as was done in this starter.
  • A showcase for a custom integration built with the Uniform Mesh SDK, that can extend the default UX of Uniform Canvas with custom layout control parameters, button style selectors, or anything else you want.

In addition, CSK provides a Uniform project that demonstrates the following:

  • Live preview for all page types and in-line editing
  • Personalization and A/B testing
  • Ability to manage sitemap in Project Map
  • Custom themes

Uniform built this starter with:

With the component starter kit, you can begin working with Uniform tools like Canvas and Mesh in just a few minutes. This set of open-source, customizable front-end components can be added to a component development system, like Storybook, and connected to content sources using Mesh. Now your entire team can access all your source content and data and start crafting customer experiences with little or no code.

Comprised of a Next.js app, React components, and the Uniform SDK, when paired with the available theme pack integration the component starter kit gives you everything you need to start your project.

Design Extensions (DEX) integration is built Mesh SDK and it extends the default UX of Uniform Canvas with custom design and layout control parameters like color pickers that respect your design system, margin/padding control, button style selectors, etc. It allows you to define your own custom theme which will be respected by the custom parameters controlling the look and feel of your components.

Here's a live version of the Component starter kit.

To see all the components and their variants, visit this hosted Storybook

CSK source code is available here.

The CSK tutorial is a step-by-step guide to the Component Starter Kit.

Are there more components coming?

Yes, we continuously roll out new components. If you are missing components you need for your project, please contact our team.

Can I use these components for a commercial project?

Yes you can! We’d be very happy if you do.

Can I connect my own content and data to these components?

Of course! You can use one of the dozens Uniform integrations or connect to any REST-based API using a generic REST Data Source via Uniform Mesh without writing a single line of code!

Last modified