New docs

docs/apps/___create-app.md

@@ -0,0 +1,6 @@
+---
+id: create-app
+title: Create an App
+---
+
+...

docs/apps/___overview.md

@@ -0,0 +1,10 @@
+---
+id: overview
+title: Overview
+---
+
+...
+
+## What is an app component?
+
+..

docs/apps/___recomposing-apps.md

@@ -0,0 +1,6 @@
+---
+id: recomposing-apps
+title: Recomposing Apps
+---
+
+..

docs/apps/deploy-app/___aws.md

@@ -0,0 +1,6 @@
+---
+id: aws
+title: AWS
+---
+
+...

docs/apps/deploy-app/___netlify.md

@@ -0,0 +1,6 @@
+---
+id: netlify
+title: Netlify
+---
+
+..

docs/apps/deploy-app/___vercel.md

@@ -0,0 +1,6 @@
+---
+id: vercel
+title: Vercel
+---
+
+...

docs/aspects/builder/builder.mdx

@@ -1,6 +1,6 @@
 ---
 id: builder
-title: Builder
+title: Build Pipelines
 slug: /aspects/builder
 description: build components on isolated directories
 ---

docs/aspects/dependency-resolver/dependency-resolver.mdx

@@ -7,7 +7,6 @@ description: Simplifies the dependency management of components in a Bit workspa
 
 Check out the [Dependency Resolver Aspect](https://bit.dev/teambit/dependencies/dependency-resolver) on Bit.dev
 
-
 The [Dependency Resolver](https://bit.dev/teambit/dependencies/dependency-resolver) configures and installs dependencies for components in a Bit workspace. It auto-generates the dependency graph for components to spare us the tedious work of manually configuring it ourselves.
 It does so by integrating the dependency policies set by various Bit extensions (primarily the workspace) with the components' parsed and analyzed `import`/`require` statements.
 In addition to that, the Dependency Resolver offers an efficient API to manually modify the generated graph using policies that can be applied on groups of components.
@@ -256,9 +255,9 @@ Set the `devFilePatterns` property to add your own list of file extensions to be
 
 #### peer dependencies
 
-Setting a package as a peer dependency ensures the package manager installs only a single version of that package. If that is not possible, i.e. if there is no single “agreed upon” version for all components in the workspace, then an error will be thrown.
+Setting a package as a peer dependency ensures the package manager installs only a single version of that package. If that is not possible, i.e. if there is no single "agreed upon" version for all components in the workspace, then an error will be thrown.
 
-This can be crucial when different components communicate with each other using shared objects that are instantiated by an installed package (the dependency). If different versions of the same package create different object instances then the “means of communication” is broken. There is no single object to address, no single source of truth. This can turn out to be critical when working with modules that are used as “plugins” of another module (for example, Babel), or when working with components that are coordinated in runtime using a shared library (for example, React).
+This can be crucial when different components communicate with each other using shared objects that are instantiated by an installed package (the dependency). If different versions of the same package create different object instances then the "means of communication" is broken. There is no single object to address, no single source of truth. This can turn out to be critical when working with modules that are used as "plugins" of another module (for example, Babel), or when working with components that are coordinated in runtime using a shared library (for example, React).
 
 To set a package as a peer dependency, place it under the `peerDependencies` entry, like so:
 
@@ -349,8 +348,8 @@ Read about setting a proxy in NPM's global configuration [here](https://docs.npm
 > If that token cannot be found in the `.npmrc` file, Bit will look for it in your global Bit configurations (use the `bit config` command to output your `user.token` property).
 >
 > <br />
-> If your npm is configured to use a registry other than npmjs's, then the Dependency Resolver will use that configured registry,
-> instead.
+> If your npm is configured to use a registry other than npmjs's, then the Dependency
+> Resolver will use that configured registry, instead.
 
 > The 'install' process includes importing components and linking them to the `node_modules` directory.
 

docs/aspects/mdx/index.ts

@@ -1 +1,2 @@
 export { default as Mdx } from './mdx.mdx';
+

docs/aspects/pnpm/pnpm.mdx

@@ -1,7 +1,7 @@
 ---
 id: pnpm
 title: pnpm
-slug: /aspects/pnmp
+slug: /aspects/pnpm
 description: Enables the use of pnpm in a Bit workspace
 ---
 
@@ -24,8 +24,8 @@ To start using the pnpm aspect as a package manager for your workspace, set the
 }
 ```
 
-> Package manager are only configurable at th workspace configuration root-level.
-> That means, different components in the same workspace cannot use different package manager.
+> The package manager is only configurable at the workspace configuration root-level.
+> That means, different components in the same workspace cannot use different package managers.
 
 ---
 

docs/builder/build-artifacts.md

@@ -0,0 +1,90 @@
+---
+id: build-artifacts
+title: Build Artifacts
+---
+
+Artifacts are files that are generated by a build task, and persisted in the component objects (the component version).
+
+For example, TypeScript's build task generates compiled files, type decelerations and source maps. These artifacts are persisted in the component object when running the snap or tag pipelines.
+
+```bash title="Listing the TypeScript Aspect artifacts for component ui/text"
+$ bit artifacts ui/text --aspect teambit.compilation/compiler
+
+my-workspace/ui/text@0.0.1
+  teambit.compilation/compiler
+    TSCompiler
+      dist/index.d.ts
+      dist/index.js
+      dist/index.js.map
+      dist/text.composition.d.ts
+      dist/text.composition.js
+      dist/text.composition.js.map
+      dist/text.d.ts
+      dist/text.docs.mdx
+      dist/text.js
+      dist/text.js.map
+      dist/text.module.scss
+      dist/text.spec.d.ts
+      dist/text.spec.js
+      dist/text.spec.js.map
+```
+
+## Using artifacts - CLI
+
+Use the `--out-dir` option to extract artifacts from the component objects.
+
+```
+bit artifacts <component-id> --out-dir <dir-name>
+```
+
+[See here](/reference/cli-reference#artifacts) to learn more about the `artifacts` command.
+
+## Using artifacts - API
+
+Builder provides an API for retrieving artifacts from the component objects.
+
+The following methods receive as arguments, a [Component](https://bit.dev/teambit/component/component/~code/component.ts) (a component object, not the component id) and values to filter the artifacts by. They return the artifacts as an array of [`Artifact`](https://bit.dev/teambit/pipelines/builder/~code/artifact/artifact.ts) or as an array of [`ArtifactVinyl`](https://www.npmjs.com/package/vinyl).
+
+Use the scope API to get a component from the scope, using its component id.
+
+### getArtifacts
+
+```ts
+getArtifacts(component: Component): ArtifactObject[] | undefined
+```
+
+### getArtifactsVinylByExtension
+
+```ts
+getArtifactsVinylByExtension(component: Component, aspectName: string): Promise<ArtifactVinyl[]>
+```
+
+### getArtifactsVinylByExtensionAndName
+
+```ts
+getArtifactsVinylByExtensionAndName(component: Component, aspectName: string, name: string): Promise<ArtifactVinyl[]>
+```
+
+### getArtifactsByName
+
+```ts
+getArtifactsByName(component: Component, name: string): ArtifactObject[] | undefined
+```
+
+### getArtifactsByExtension
+
+```ts
+getArtifactsByExtension(component: Component, aspectName: string): ArtifactObject[] | undefined
+```
+
+### getArtifactsByExtensionAndName
+
+```ts
+getArtifactsByExtensionAndName(component: Component, aspectName: string, name: string): ArtifactObject[] | undefined
+```
+
+### getDataByAspect
+
+```ts
+getDataByAspect(component: Component, aspectName: string): Serializable | undefined
+```

docs/builder/build-pipelines.mdx

@@ -0,0 +1,175 @@
+---
+id: build-pipelines
+title: Build Pipelines
+---
+
+import { Image } from '@site/src/components/image';
+import pipelinesImg from './pipelines.png';
+
+The Builder runs three separate build pipelines, the basic build pipeline, the snap pipeline and the tag pipeline.
+
+<Image src={pipelinesImg} />
+
+To get a list of the build tasks included in each pipeline for a specific component, run `bit build --list-tasks <id>`.
+For example:
+
+```bash
+bit build --list-tasks ui/button
+```
+
+```bash
+Tasks List
+id:    my-scope/ui/button@1.0.0
+envId: my-scope/custom-env@0.0.1
+
+Build Pipeline Tasks:
+teambit.harmony/aspect:CoreExporter
+teambit.compilation/compiler:TSCompiler
+teambit.defender/tester:TestComponents
+teambit.pkg/pkg:PreparePackages
+teambit.pkg/pkg:PublishDryRun
+teambit.preview/preview:GeneratePreview
+
+Tag Pipeline Tasks:
+teambit.harmony/application:build_ui_application
+teambit.pkg/pkg:PackComponents
+teambit.pkg/pkg:PublishComponents
+
+Snap Pipeline Tasks:
+teambit.pkg/pkg:PackComponents
+```
+
+## Build (the basic build pipeline)
+
+Components can be built without committing changes using the `bit build` command. This is often used to test the build process.
+`bit build` runs only the build's build pipeline which mainly includes:
+
+- Generating the component's `package.json`
+- Installing or symlinking the component's dependencies
+- Compiling the component's code (optional)
+- Testing the component (optional)
+- Performing ['dry run'](https://docs.npmjs.com/cli/v6/commands/npm-publish#:~:text=%5B--dry-run%5D%20As,the%20specified%20registry.)
+- Generating the component's visualization (mainly, docs and 'compositions')
+
+### Add a build task from an Env
+
+Use the `getBuildPipe` method to customize the Env's build pipeline.
+
+```ts
+getBuildPipe?: (tsconfig?: TsConfigSourceFile) => BuildTask[];
+```
+
+For example:
+
+```ts {2,13-24} title="my-react.main.runtime.ts"
+// ...
+import { PrintCmpNameTask } from './print-cmp-name.task';
+
+export class MyReactMain {
+  static slots = [];
+
+  static dependencies = [ReactAspect, EnvsAspect];
+
+  static runtime = MainRuntime;
+
+  static async provider([react, envs]: [ReactMain, EnvsMain]) {
+    // Get the env's default build pipeline
+    const reactPipe = react.env.getBuildPipe();
+
+    // Add the custom task to the end of the build tasks sequence.
+    // Provide the task with the component ID of the Aspect (Env) using it, and a task name (i chose not to set these values in the task itself)
+    const tasks = [
+      ...reactPipe,
+      new PrintCmpNameTask('company.scope/envs/my-react', 'PrintCmpNameTask'),
+    ];
+
+    const templatesReactEnv = envs.compose(react.reactEnv, [
+      react.overrideBuildPipe(tasks),
+    ]);
+    envs.registerEnv(templatesReactEnv);
+    return new MyReactMain();
+  }
+}
+
+// ..
+```
+
+See the custom task used in the example above, [here](/build-tasks).
+
+### Add a build task from any Aspect
+
+Use the `registerBuildTasks` API to register one or more tasks, from any Aspect.
+
+```ts
+registerBuildTasks(tasks: BuildTask[])
+```
+
+For example:
+
+```ts title="my-aspect.main.runtime.ts"
+import { BuilderMain } from '@teambit/builder';
+import { PrintCmpNameTask } from './print-cmp-name.task';
+
+export class MyAspectMain {
+  static slots = [];
+  static dependencies = [];
+  static runtime = MainRuntime;
+  static async provider() {
+    // Register this task using the Builder registration API.
+    builder.registerBuildTasks([
+      new ExampleTask('extensions/my-aspect', 'PrintCmpNameTask'),
+    ]);
+
+    return new MyAspectMain();
+  }
+}
+// ..
+```
+
+## Snap
+
+`bit snap` executes the basic pipeline before it runs its own build pipeline. The snap build pipeline consists, mainly, of packing <!--TODO [packing](#) --> the component without publishing it (since it is a snap and not a release version).
+
+### Add a build task from an Env
+
+Use the `getSnapPipe` method to customize the Env's build pipeline.
+
+```ts
+getSnapPipe?: (tsconfig?: TsConfigSourceFile) => BuildTask[];
+```
+
+See the [build pipeline example](#add-a-build-task-from-an-env), from more context.
+
+### Add a build task from any Aspect
+
+Use the `registerSnapTasks` API to register one or more tasks, from any Aspect.
+
+```ts
+registerSnapTasks(tasks: BuildTask[])
+```
+
+See the [build pipeline example](#add-a-build-task-from-any-aspect), from more context.
+
+## Tag
+
+`bit tag` executes the basic pipeline before it runs its own build pipeline. The snap build pipeline consists, mainly, of packing <!--TODO [packing](#) -->the component and publishing it.
+
+### Add a build task from an Env
+
+Use the `getTagPipe` method to customize the Env's build pipeline.
+
+```ts
+getTagPipe?: (tsconfig?: TsConfigSourceFile) => BuildTask[];
+```
+
+See the [build pipeline example](#add-a-build-task-from-an-env), from more context.
+
+### Add a build task from any Aspect
+
+Use the `registerTagTasks` API to register one or more tasks, from any Aspect.
+
+```ts
+registerTagTasks(tasks: BuildTask[])
+```
+
+See the [build pipeline example](#add-a-build-task-from-any-aspect), from more context.