# Using a Third-Party Framework

`lightning:container` allows you to use an app developed with a third-party framework, such as AngularJS or React, in an Aura component. Upload the app as a static resource.

Your application must have a launch page, which is specified with the `lightning:container` `src` attribute. By convention, the launch page is `index.html`, but you can specify another launch page by adding a manifest file to your static resource. The following example shows a simple Aura component that references `myApp`, an app uploaded as a static resource, with a launch page of `index.html`.

```html
<aura:component>
  <lightning:container src="{!$Resource.myApp + '/index.html'}" />
</aura:component>
```

The contents of the static resource are up to you. It should include the JavaScript that makes up your app, any associated assets, and a launch page.

As in other Aura components, you can specify custom attributes. This example references the same static resource, `myApp`, and has three attributes, `messageToSend`, `messageReceived`, and `error`. Because this component includes `implements="flexipage:availableForAllPageTypes"`, it can be used in the Lightning App Builder and added to Lightning pages.

```html
<aura:component access="global" implements="flexipage:availableForAllPageTypes">
  <aura:attribute access="private" name="messageToSend" type="String" default="" />
  <aura:attribute access="private" name="messageReceived" type="String" default="" />
  <aura:attribute access="private" name="error" type="String" default="" />

  <div>
    <lightning:input
      name="messageToSend"
      value="{!v.messageToSend}"
      label="Message to send to React app: "
    />
    <lightning:button label="Send" onclick="{!c.sendMessage}" />
    <br />
    <lightning:textarea value="{!v.messageReceived}" label="Message received from React app: " />
    <br />
    <aura:if isTrue="{! !empty(v.error)}">
      <lightning:textarea name="errorTextArea" value="{!v.error}" label="Error: " />
    </aura:if>

    <lightning:container
      aura:id="ReactApp"
      src="{!$Resource.SendReceiveMessages + '/index.html'}"
      onmessage="{!c.handleMessage}"
      onerror="{!c.handleError}"
    />
  </div>
</aura:component>
```

The component includes a `lightning:input` element, allowing users to enter a value for `messageToSend`. When a user clicks **Send**, the component calls the controller method `sendMessage`. This component also provides methods for handling messages and errors.

This snippet doesn’t include the component’s controller or other code, but don’t worry. We’ll dive in, break it down, and explain how to implement message and error handling as we go in [Sending Messages from the Lightning Container Component](/docs/platform/aura-platform/guide/container-sending-messages.md#sending-messages-from-the-lightning-container-component) and [Handling Errors in Your Container](/docs/platform/aura-platform/guide/container-handling-errors.md#handling-errors-in-your-container).

**See Also**

- [Lightning Container](/docs/platform/aura-platform/guide/container-overview.md)
- [Sending Messages from the Lightning Container Component](/docs/platform/aura-platform/guide/container-sending-messages.md)
- [Handling Errors in Your Container](/docs/platform/aura-platform/guide/container-handling-errors.md)