> For the complete documentation index, see [llms.txt](https://deepakrajas-organization.gitbook.io/aptos-move-docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://deepakrajas-organization.gitbook.io/aptos-move-docs/aptos-integration/getting-started-with-aptos-integration/getting-started-with-integration.md).

# Getting Started with Integration

Here’s how the folder structure for the `frontend` directory would look with `App.tsx` included:

<pre class="language-vbnet"><code class="lang-vbnet"><strong>frontend/
</strong>    ├───components
    │   └───ui
    ├───entry-functions
    ├───lib
    ├───utils
    ├───view-functions
    ├───App.tsx
    ├───index.tsx
</code></pre>

The `App.tsx` file is a crucial component of your Aptos DApp, handling the main application logic and rendering based on the wallet connection status

```typescriptreact
import { useWallet } from "@aptos-labs/wallet-adapter-react";
// Internal Components
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { Header } from "@/components/Header";
import { WalletDetails } from "@/components/WalletDetails";
import { NetworkInfo } from "@/components/NetworkInfo";
import { AccountInfo } from "@/components/AcoountInfo";

function App() {
  const { connected } = useWallet();

  return (
    <>
      <Header />

      <div className="flex items-center justify-center flex-col">
        {connected ? (
          <Card>
            <CardContent className="flex flex-col gap-10 pt-6">
              <WalletDetails />
              <NetworkInfo />
              <AccountInfo />
            </CardContent>
          </Card>
        ) : (
          <CardHeader>
            <CardTitle>To get started Connect a wallet</CardTitle>
          </CardHeader>
        )}
      </div>
    </>
  );
}

export default App;
```

To select the network for your application, you should configure the `.env` file in the root folder. Set the `VITE_APP_NETWORK` variable to either `testnet`, `devnet`, or `mainnet`, depending on where your contract is deployed.

{% tabs %}
{% tab title=".env" %}

```properties
PROJECT_NAME=my-aptos-dapp
VITE_APP_NETWORK=testnet
```

{% endtab %}
{% endtabs %}

By default, it is set to `testnet`.