> For the complete documentation index, see [llms.txt](https://docs.wirebootstrap.com/wirebootstrap/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.wirebootstrap.com/wirebootstrap/working-with-components/web-frameworks.md).

# Web Frameworks

Any WireBootstrap component can be used natively inside any of the modern web frameworks through integrations developed for each framework.  Click on a framework below to go to the WireBootstrap integration documentation for the framework.

|                                                                                                                                                                                                                                                                                                                               |                                                                                                                                                                                                                                                                                                               |                                                                                                                                                                                                                                                                                                    |                                                                                                                                                                                                                                                                                                      |
| ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| <img src="https://1908368930-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MHDYOz0QETYIPewpGM-%2Fuploads%2FrNt5tubl0HGvPixWw91g%2Fweb-components.png?alt=media&amp;token=899fd6a6-8c13-4b7f-9ebd-36debbb314f6" alt="" data-size="line"> [Web Components](https://docs.wirebootstrap.com/webcomponents) | <img src="https://1908368930-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MHDYOz0QETYIPewpGM-%2Fuploads%2FEjpmJwb2lD8IccOUClbw%2Fangular_card.jpg?alt=media&amp;token=d0d34256-a4fb-46a8-a88b-f80c7bec8153" alt="" data-size="line">[Angular](https://docs.wirebootstrap.com/angular) | <img src="https://1908368930-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MHDYOz0QETYIPewpGM-%2Fuploads%2FEJXHXd5FdZBOe5dSwFRT%2Freact.png?alt=media&amp;token=93cfc708-f36c-4367-b76e-054a46cda098" alt="" data-size="line">[React](https://docs.wirebootstrap.com/react) | <img src="https://1908368930-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MHDYOz0QETYIPewpGM-%2Fuploads%2FEQLg3ptlgNfZrGm7ZRY7%2Fvuejs-60x52.jpg?alt=media&amp;token=eab56ee9-2bd1-441e-bafe-e6a4ffd3e6bb" alt="" data-size="line">[Vue](https://docs.wirebootstrap.com/vue) |

In the example below, the component `myComponent` is rendered in plain JavaScript as well as four web frameworks.

{% tabs %}
{% tab title="JavaScript" %}

```html
<div id="component1"></div>
<script>
    new myComponent().render("#component1", {});
</script>
```

{% endtab %}

{% tab title="Web Components" %}

```html
<wire-component component="myComponent" config=""></wire-component>
```

{% endtab %}

{% tab title="Angular" %}

```html
<div wire-component="myComponent" [config]=""></div>
```

{% endtab %}

{% tab title="React" %}

```jsx
<WireComponent component="myComponent" config={}>
    <div></div>
</WireComponent>
```

{% endtab %}

{% tab title="Vue" %}

```html
<div wire-component="myComponent" v-wire-config=""></div>
```

{% endtab %}
{% endtabs %}