The `fast-element` library is a lightweight means to easily build performant, memory-efficient, standards-compliant Web Components. FAST Elements work in every major browser and can be used in combination with any front-end framework or even without a framework.
## Installation
### From NPM
To install the `fast-element` library, use either `npm` or `yarn` as follows:
```shell
npm install --save @microsoft/fast-element
```
```shell
yarn add @microsoft/fast-element
```
Within your JavaScript or TypeScript code, you can then import library APIs like this:
```ts
import { FASTElement } from '@microsoft/fast-element';
```
:::tip
Looking for a setup that integrates with a particular front-end framework or bundler? Check out [our integration docs](../integrations/introduction.md).
:::
### From CDN
A pre-bundled script that contains all APIs needed to build web components with FAST Element is available on CDN. You can use this script by adding [`type="module"`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules) to the script element and then importing from the CDN.
```html
<!DOCTYPE html>
<html lang="en">
<head>
<script type="module">
import { FASTElement } from "https://cdn.jsdelivr.net/npm/@microsoft/fast-element/dist/fast-element.min.js";
// your code here
</script>
</head>
<!-- ... -->
</html>
```
The markup above always references the latest release. When deploying to production, you will want to ship with a specific version. Here's an example of the markup for that:
For simplicity, examples throughout the documentation will assume the library has been installed from NPM, but you can always replace the import location with the CDN URL.
:::
:::tip
Looking for a quick guide on building components? Check out [our Cheat Sheet](../resources/cheat-sheet.md#building-components).
:::
=========================================
END OF @microsoft/fast-element NOTICES AND INFORMATION
%% @microsoft/fast-react-wrapper NOTICES AND INFORMATION BEGIN HERE
The `fast-react-wrapper` package contains a utility that enables automatically wrapping Web Components in a React component for ease of integration into React projects.
## Installation
### From NPM
To install the `fast-react-wrapper` library, use either `npm` or `yarn` as follows:
```shell
npm install --save @microsoft/fast-react-wrapper
```
```shell
yarn add @microsoft/fast-react-wrapper
```
Within your JavaScript or TypeScript code, you can then and use the wrapper like this:
```ts
import React from 'react';
import { provideReactWrapper } from '@microsoft/fast-react-wrapper';
const { wrap } = provideReactWrapper(React);
const MyComponent = wrap(MyComponent);
```
For additional wrapper settings and more information on integrating with Design Systems, see [our integration docs](https://fast.design/docs/integrations/react).
=========================================
END OF @microsoft/fast-react-wrapper NOTICES AND INFORMATION
%% @octokit/core NOTICES AND INFORMATION BEGIN HERE