The conceptual building blocks for a composable architecture are usually: Apps, UI Components, Entities, Modules and Hooks. Architecture varies from one framework to others.
Here are common composable architecture patterns for specific tech stacks:
React
Explore the component templates available in your workspace:
Unlock seamless dev experience with Cloud Workspaces
Use Cloud Workspaces for a ready-to-go, web-based and integrated development environment for creating your components.
Create a reusable UI component to use in your apps:
This will create the component in the corresponding directory, and will link this component in your workspace node_modules directory.
You can use components in your workspace or in other linked projects using an import statement with the component module name:
import { Login } from '@my-org/my-platform.login';
Create a React shell application and use your UI component:
Launch the app locally:
The application is now running on the host displayed in the output. You can learn more on creating apps on the create apps docs.
You can install external dependencies using bit install. You can find more information on installing dependencies here.
Below you can find guides for creating specific component types for your architecture needs.
Apps are components, associated with a deploy task. Apps are used for building frontend applications, backend services or deployable frontends (e.g. micro frontends).
It is usually recommended to minimize the amount of frameworks used in a single application, to improve the performance and maintainability of your software. Altough it is possible to combine frameworks as specific needs arises.
To create apps, head here.
UI component serves a specific function or displays certain content using hooks and entities:
Hooks are generally used for state management and data fetching.
Entities are used to describe entities such as User, Product or Post. It eases serialization and deserialization and increases reuse and consistency between the backend and the frontend.
Modules are Node or ESModules modules containing certain logic and API. You can use modules to build utilities, SDKs, or other general purpose logic you would usually build in NodeJS.
Platforms are a composition of apps, built and deployed to various runtimes, including your backend and frontend.
If you are looking to introduce pluggability to your platform, you are welcome to use Harmony, a minimalistic framework for stitching composable architectures. Using Aspects you can compose components into domain-centric and pluggable user experiences.
You can use Aspects to extend Bit, but also to build your own Composable Harmony applications.
You can also create and use Aspects to extend Bit.
We are happy to introduce more composable architectures to the Bit community. If you have or want more composable frameworks to show here, please let us know and contribute your ideas on the Bit Community.
