• Stars
    star
    17,450
  • Rank 1,456 (Top 0.03 %)
  • Language
    TypeScript
  • License
    Other
  • Created over 7 years ago
  • Updated about 1 month ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

A build system for development of composable software.

Website | Docs | Community | Bit Cloud

apache prs Circle Status Styled with Prettier Join Slack

Bit is a build system for development of composable software. It makes the composition of applications from independently versioned components seamless and fast.

Bit is similar in sense, but stands as the opposite for the "Monorepo" approach, which aims to center all code under a central repository. Instead, Bit is bringing simplicity for distribution of source code into independently versioned components, depending on each other.

People often use Bit to run a Monorepo, a Polyrepo or without using repositories at all.

The core innovation of Bit is the "Bit Component", a composable and versioned container for source code, whereas dependencies are first-class citizens. Components can be used as packages, ESM modules, runtime scripts, and any other artifact a build task can generate.

  • πŸ“¦ Descriptive module names. Use components through descriptive package names. No aliases required.
  • πŸš€ Dependency versioning. Automatic detection and versioning of dependency changes. No more redundant package.json files.
  • βš“ Reusable development environments. Reusable components including all of your dev config. No more duplication of countless tsconfig.json, eslintrc or prettierrc configs.
  • βš’οΈ Build pipelines. Independently build and store packages, bundles, and binaries.
  • πŸ‘“ Preview and auto-generated docs. Every component is an asset with auto-generated docs and component previews.
  • πŸ›« Change review. Use Lanes to propose and preview changes and collaborate on them with others.
  • πŸ§‘β€πŸ’» Component generators. Create new components using pre-built or custom templates for any type of component.

Getting started

Install Bit

Use the Bit installer to install Bit to be available on your PATH.

npx @teambit/bvm install

For better VSCode dev experience, install the Bit VSCode Plugin.

Create a new workspace

Run the following to create a workspace with a few components included, using the hello-world starter:

bit new hello-world my-hello-world --env teambit.community/starters/hello-world

For the quick start, we use two React components and one Node module, though you can create components using any JS-based framework. You can explore our official starters for Vue, Angular, and other supported tools or learn how to create your own.

Run the app

Your workspace maintains a number of components. One of these components is also an app. Run it using:

bit run hello-world-app

You can get any component to become an app by adding a single file to it.

Create components

Start creating components using the default component generators, or create your own.

bit create react buttons/button

You can view other built-in component templates, by running the bit templates command.

Use components

After creating a new component, start using it by adding an import statement in one of your workspace components.

import { Button } from '@org/scope-name.buttons.button';

Once added, Bit will autodetect the dependency between these components. Use bit show or the VSCode plugin to view the list of dependencies Bit detected for your components.

Create a remote scope

You can either use hosted scopes on Bit Cloud or by hosting scopes on your own. Use the following command to create your Bit Cloud account and your first scope.

bit login

Once done, change to your own owner and scope names using this command:

bit scope rename org.scope-name my-org.my-scope-name --refactor

This command will refactor your components to use the new owner and scope names.

Record component and dependency changes

Run snap or tag to record component changes, and assign a semantic version to them. Bit will version the dependents graph of each modified components.

bit snap --message 'initial release'

Snapped components are ready to be built upon 'export' (see next step). The build artifacts will also be stored in the component's new version ('snap').

By default, components are built using bit.cloud's CI platform, Ripple CI. However, you can run the components' build locally by adding the --build flag, or use your own CI platform. To learn more see Set up CI.

Export components to a remote scope

Export your staged components from your workspace to their remote scopes. This will make them available to be used by components outside of your workspace, and from your other projects.

bit export

Head over to your bit.cloud account to see your components build progress. Once the build process is completed, the components will be available for use in their remote scopes. πŸŽ‰πŸŽ‰πŸŽ‰

Contributors

Bit is entirely built with Bit and you can find all its components on Bit Cloud.

Your contribution, no matter how big or small, is much appreciated. Before contributing, please read the code of conduct.

See Contributing.

License

Apache License, Version 2.0

More Repositories

1

movie-app

react application deconstructed to Bit components, to be a shared-library https://bit.dev/bit/movie-app
JavaScript
102
star
2

bit-docker

A dockerfile setup to run your own Bit server.
Dockerfile
89
star
3

envs

Component development environments for the Bit community
TypeScript
63
star
4

base-ui

The basic bit.dev React component design system.
TypeScript
59
star
5

bvm

Bit version manager
TypeScript
38
star
6

bit-javascript

A javascript driver for bit
TypeScript
38
star
7

evangelist

React components used to build the bit.dev marketing website.
TypeScript
37
star
8

bit-angular

Angular support for bit harmony
TypeScript
28
star
9

bit-dev

Bit's website.
TypeScript
28
star
10

cleargraph

A library for modeling and traversing graphs
TypeScript
24
star
11

bit.envs

DEPRECATED - Bit compilers and testers were moved to https://github.com/teambit/envs
JavaScript
23
star
12

bit-vue-tutorial

Demo Vue app for the official Bit with Vue components tutorial.
Vue
12
star
13

bit-with-github-actions

A Bit integration with GitHub Actions CI.
JavaScript
12
star
14

react-demo-app

A React TODO app with some UI components -> Shared as a reusable collection:
JavaScript
10
star
15

bit-react-tutorial

Official React tutorial for Bit.
JavaScript
9
star
16

react-tailwind-env

An example of a custom react env with basic support for tailwindcss
TypeScript
9
star
17

relsym

Converts absolute symlinks to relative ones
JavaScript
9
star
18

docs

Bit documentation website
JavaScript
8
star
19

bit-lit

Lit element support for Bit Harmony
TypeScript
7
star
20

harmony-base-ui

TypeScript
6
star
21

demo-react-component-lib

A Bit workspace demonstrating best practices to structuring design systems with Bit.
TypeScript
5
star
22

documenter

TypeScript
5
star
23

harmony-with-github-actions

A demo project: Component collaboration using Bit, Bit.dev, git, and Github.
TypeScript
4
star
24

vue-demo-app

A VueJS todo app
Vue
4
star
25

harmony-evangelist

TypeScript
4
star
26

bit.utils

JavaScript
4
star
27

try-bit

A Bit Harmony demo workspace.
TypeScript
3
star
28

bit-angular-tutorial

TypeScript
3
star
29

bit-foundations

Concrete component-driven implementations for integrating workflows and tech stacks with bit
TypeScript
3
star
30

design

Teambit's Design System components
TypeScript
2
star
31

custom-prettier-config

An example repo for customizing prettier config in a custom env
TypeScript
2
star
32

any-fs

anyfs is a composable and extendible file-system and fully compatible with the node `fs` module.
TypeScript
2
star
33

examples-workspace-internal

Internal version of the Harmony beta project, where we'll add numerous use cases and tests to ensure that nightly changes dont break workflows
TypeScript
2
star
34

bit-with-azure-devops

A Bit integration with Azure.
JavaScript
2
star
35

example-templates

Automatic templates for bit.dev's examples
TypeScript
1
star
36

detective-vue

JavaScript
1
star
37

remote-teams

Repo for https://medium.com/@JonathanSaring/739625e7069d
JavaScript
1
star
38

bit-websites

Components for Bit Websites
1
star
39

explorer

TypeScript
1
star
40

onboarding-docs

Docs for onboarding to Bit
TypeScript
1
star
41

vue-lookup

JavaScript
1
star
42

harmony-demos-handlebars

Demo for using Handlebars with Bit Harmony
TypeScript
1
star
43

examples

Examples of using and extending Bit.
TypeScript
1
star
44

harmony-jsx-less

JavaScript
1
star
45

styled-jsx

Harmony repo with added support for styled-jsx
TypeScript
1
star
46

templates

a list of templates for bit
TypeScript
1
star
47

custom-eslint-config

An example of how to customize eslint config
TypeScript
1
star
48

github-ci-example

Example of setting up Bit's git-first flow using Github
TypeScript
1
star
49

figma-bit-design-tokens-sync

TypeScript
1
star
50

dependabot-bit

1
star
51

.github

Adds a readme file to the orgs overview tab
1
star
52

envs-health-status

basic e2e runs for default envs created and maintained by bit
1
star
53

custom-preview-example

a workspace showcasing a custom preview aspect
TypeScript
1
star
54

nimble-demo

A demo of how multiple teams can work together in Bit to combine their work into a single, cohesive application.
TypeScript
1
star