The Bit Blog
The official blog for component-driven software
What's New in Bit? December 07, 2023
The newest features of Bit include selectin gcomponents by their status, locally testing the tag and snap pipelines, auto dependency installation for new components, and more.
What's New in Bit? November 20, 2023
The newest features of Bit include an easy way to detect which components use a specific dependency, support for Angular 17, support for Lit 3, CI integration suites, and more.
What's New in Bit? November 13, 2023
The newest features of Bit in version 1.3.21 include NextJS support, updates to the Storybook, support for handling components with the same name in a workspace, auto-open Ripple CI jobs, and a new VSCode plugin.
Understanding Component Runtime Environments
Learn how to use component development environments to define the runtime environment for your components.
Announcing Bit v1.0. A beginning of a new era in component-driven software.
Bit has reached a major milestone with the release of v1.0. Learn about the new features and improvements in this release.
Bit v1.0: Upgrade Notes
Find out how to upgrade to version 1.0.0 and what changes could affect your existing workflows.
Creating Indepenent Bit Components in a NextJS Project
Learn how to create and share components that can be used and maintained in any NextJS or even React project.
Mastering Micro Frontends with Module Federation and Bit
Explore the transformative power of Webpack Module Federation and Bit in developing micro frontends.
Building Scalable React Native Apps with Independent Bit Components
Learn how to leverage Bit to enhance the scalability, maintainability, of your React Native projects. Create and consume Bit components, and keep them in sync across projects.
What's New in Bit? June 05, 2023
The newest features of Bit in version v0.1.57, and new demos and guides. Learn how to use Tailwind CSS with Bit, how to implement Micro Frontends with Bit, and more.
How to Configure Tailwind for Component Previews and Apps
Learn how to configure your Tailwind Webpack Transformer for customized Tailwind component previews and apps.
Using a Static Dependency Policy in a Legacy Env
Optimize installation and gain more control over your dependencies with the new env.jsonc file for envs.
What's New in Bit? Quicker build task debugging, a guide to creating Bit components in your existing project, and more!
Explore the latest updates to Bit. This blog details the newest features in version v0.1.52. Stay updated with Bit's evolving capabilities to optimize your development process.
Build Bit components in your existing project
Learn how to create independent Bit components in your existing project, and use them in your app
Render Context for React Component Previews and Tests
In this tutorial, we'll walk you through the process of creating a common render context and share it between the Env mounter and Test runner.
What's New in Bit? May 22, 2023
The newest features of Bit in version v0.1.48, and new demos and guides. Learn how to create framework-agnostic components, how to use bit lanes, how to create AWS Lambda function components, and more.
What's New in Bit? May 15, 2023
Explore the latest updates to Bit. This blog details the newest features in version v0.1.42. Stay updated with Bit's evolving capabilities to optimize your development process.
How to Create Reusable CSS Components with Bit
Learn how to create reusable CSS components using Bit and SCSS, increasing efficiency and maintainability in your web development projects.
What's New in Bit? May 08, 2023
Discover Bit's latest features, guides, and demos!
Debugging components in a Bit workspace
How to debug backend components Bit workspaces
How to Update Dependencies in a Scope
Explore the importance of aligning dependencies in Bit components within a scope and across different scopes in your organization, understand the workflow for managing and inspecting dependencies, and learn how aligned dependencies contribute to efficient collaboration and code maintenance in component-based software engineering.
Integrating Tailwind CSS and Bit for Component Styling
Learn how to use Tailwind with Bit, to create React with Tailwind components. Understand the principles of customizing component previews and app bundles.
Bit Components: Build Time and Runtime Consumption
Learn about Bit components and the differences between consuming them at build time and runtime. Discover the advantages and disadvantages of each method, and explore an example of using both approaches.
How to Integrate Bit into your Existing Project: The Basics
Componentize your project with Bit to make it maintainable, reusable and composable.
Introducing Stencil Component Development Environment
Learn about Bit's newly introduced support for Stencil, and the Developer Experience with Bit for creating flexible, individually versioned and universally consumable web-component libraries.
Setting the Right Context for Your Component Previews
Learn how to create a Composition Playground with an integrated toolbar for component previews. Discover how to utilize Bit Env to configure your components with a composition provider, making it easy to switch between themes or other contexts as needed.
Migrate to New Component Development Environments
Learn how to migrate to new component development environments (envs)
Introducing Angular Component Development Environment
Learn about the recent upgrades for Angular Developer Experience with Bit, how to modify and extend your configuration to get better development workflow.
Introducing React Component Development Environment
Learn about the recent upgrades for React Developer Experience with Bit, how to modify and extend your configuration to get better development workflow.
Introducing Lit Component Development Environment
Learn about the recent upgrades for Lit Developer Experience with Bit, how to modify and extend your configuration to get better development workflow.
Deploying a Composable React App to Netlify
Discover how to deploy React apps to Netlify using Bit. We'll show you how to build a scalable React app that can be easily extended and maintained and deployed to Netlify using component-based software development.
Creating a Cross-Platform Design System for React and React Native with Bit
For web and mobile development, many teams use React and React Native for UI/UX consistency. When developers synchronize between these platforms, sharing code is a challenge. In an ecosystem where teams want to maintain consistency while allowing styling variations, the challenge is especially tough. Here you'll learn how to build a consistent Design System out of React and React Native, sharing design tokens, logic, and types.
Composable Link Component that Works in Any React Meta-Framework
Bit's Link Component is a component that is agnostic to the environment it is running in. You can use this link with any React meta-framework such as Gatsby, Next, Remix etc. This results in more flexible and reusable components that can be used in any React application.
Theming React Apps with Styled Components and Bit
An in-depth guide to creating an app using styled-components and Bit. We will cover theming, versioning, testing, visualizing, and collaborating. Using Bit and Styled Components, you can create reusable, maintainable components that ensure consistency throughout your application.
How to Create a Composable React App with Bit
Learn how to build a React app from independent components using Bit. All the necessary concepts will be covered, including routing, versioning, testing, and deploying.
Component-Driven Microservices with NodeJS and Bit
Do you have a component-based backend? At Bit, components are the foundation of everything we do. Learn how to create a highly maintainable and scalable system by componentizing Node.js microservices using Bit.
Sharing Types Between Your Frontend and Backend Applications
Your backend API has been updated to return data of a new type. The frontend team must be informed to update accordingly. What would you do if you had dozens of frontend apps that are consuming this API? Bit simplifies your life by creating a centralized "entity" component.
Advanced Bit Dependency Management and Configs
Bit makes it simple to define and manage dependencies at any scale. Among other things, this means that `bit install` must work for everything and everyone out of the box. However, the JavaScript ecosystem is huge and sometimes some tweaks are required to make your tooling work properly.
Sharing JavaScript Utility Functions Across Projects
This blog post explains how you can use Bit to create reusable JS util functions that can be used across many different projects, backend or frontend.
How to Reuse React Components Across Your Projects
In this tutorial you will learn how independent components save you time by reusing the same components in various contexts.
Composing Reusable Landing Pages in Components
Learn how to easily and quickly create landing pages that you can reuse anywhere with components using Bit.
Painless Monorepo Dependency Management with Bit
Simplify dependency management in a monorepo to avoid issues with phantom dependencies and versions. Learn about dependency installation with yarn, pnpm, and Bit workspaces - and how to make it easy.
How to Build a Reusable Cloudflare Worker component
Cloudflare Workers are a platform for enabling serverless functions to run as close as possible to the end user. Combining Cloudflare worker with Bit gives you super powers as you are able easily manage the workers dependencies, manage its versions, and more
How to build Material UI components with Bit
Material UI is great, but did you know that you can also combine it with Bit? Learn how to create a theme and a custom environment to visualize and distribute your MUI components.
Theming in Components with React and Bit
How we use composable components and design tokens to create React themes that are scala, modular, consistent, quick, and easy to apply.
Building a Composable UI Component Library
In this tutorial, we will learn how to build a composable component library, which forms the foundation for the design system and the organization apps. This will be done using Bit, React, and TypeScript.
Component Spotlight: Composable Search Bar
This post tells the story of a composable search bar being used in a single app, turning into a generic component that can be used in any app. We will show you how we built the search bar component in this website, bit.dev, and the Workspace UI.
Design Tokens in Components with React and Bit
Modern design practices have facilitated better collaboration amongst design and engineering teams. Here we will see how design tokens and Bit create better collaboration between designers, developers, and product owners.
Extracting and Reusing Pre-existing Components using bit add
Our goal in this Guide is to learn how to free components from the monolithic jail. We will use Bit to track a component and decompose it into two independent components.
Meet Component-Driven Content: Applicable, Composable
In a component-driven world, where any component can be used anywhere, creating content as a component provides a level of portability, flexibility, reusability, and customizability not seen before.
How to build a composable blog
Creating a blog from scratch requires quite a lot. We created a reusable, extendable Blog component that you can use to create your own blog compositions. Here, we show you how to get up and running with our Starter blog.
Extendable UIs: How to build better UIs for developers
In this blog post, we will talk about the ability to design UI components that are extendable. You will see how we have built the blog component this website uses to be extendable.
