Molekule

screenshot of Molekule
react
styled-components

React UI kit built on styled-components

Overview:

Molekule is a React component library that aims to be the last one you'll ever need. It offers a range of features and tools to make component development and integration easier.

Features:

  • Automatic release: Molekule automatically builds and publishes releases as soon as branches are merged into the main branch.
  • Conventional commits: To support automated semantic versioning, Molekule requires the use of conventional commits, such as "fix" for patch version bumps, "feat" for minor version bumps, and "BREAKING CHANGE" for major version bumps.
  • Previewing: Molekule provides a way to preview changes made to components in consuming applications using Yalc. This allows for easier testing and integration before publishing changes.
  • Chromatic integration: Molekule integrates with Chromatic, a tool that visually diffs components and detects new changes. This helps ensure that changes are thoroughly reviewed and approved.

Summary:

Molekule is a powerful React component library that offers automated release management, support for conventional commits, and tools for previewing changes and visually diffing components. Its integration with Chromatic allows for thorough testing and approval processes. With Molekule, developers can streamline their component development and integration workflows.

react
React

React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components

styled-components
Styled Components

Styled Components is a popular library for styling React components using CSS syntax. It allows you to write CSS in your JavaScript code, making it easier to create dynamic styles that are specific to each component.

ui-kit
UI Kits & Components

A UI kit provides developers with a set of reusable components that can be easily integrated into a website or application. These components are pre-designed with consistent styling and functionality, allowing developers to save time and effort in the design and development process. UI kits can be either custom-built or third-party, and often include components for buttons, forms, typography, icons, and more.

github-pages
GitHub Pages

Gridsome is a Vue.js-based static site generator that makes it easy to build fast and flexible websites and applications by leveraging modern web technologies like GraphQL, Webpack, and hot reloading

typescript
Typescript

TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.

Yup

Yup is a schema builder for runtime value parsing and validation. It provides a declarative way to define validation schemas with support for complex nested objects, array validation, and custom validation rules. Often used with Formik for form validation.