Skip to main content
A consistent file layout keeps vault logic, wallet plumbing, and UI concerns easy to reason about. The structure below assumes a Vite + React front end with Privy for authentication and viem for EVM tooling, but the same patterns work for Next.js or other frameworks. 
├─ .env.local             # Privy App ID, Amplify API key, RPC URLs (never commit)
├─ package.json
├─ src/
│  ├─ app/
│  │  ├─ App.tsx          # Top-level routes, feature shells
│  │  └─ providers.tsx    # React providers (PrivyProvider, AmplifyProvider, QueryClient)
│  ├─ components/
│  │  ├─ DepositForm.tsx
│  │  ├─ WithdrawForm.tsx
│  │  └─ StatusBanner.tsx
│  ├─ hooks/
│  │  ├─ useAmplify.ts    # initAmplifySDK + helper wrappers
│  │  └─ useBalances.ts   # data fetching with react-query / wagmi
│  ├─ lib/
│  │  ├─ privy.ts         # Privy login/logout helpers
│  │  └─ viem.ts          # Public/wallet client factories
│  ├─ pages/              # Optional route segments (Next.js / Remix)
│  ├─ styles/
│  └─ main.tsx            # Vite entry point
├─ tests/                 # Component and integration tests
└─ docs/                  # Internal runbooks and integration notes

​
Separation of Concerns

  • Providers layer – initialize Privy, React Query, and the Amplify SDK once. Re-export hooks for the rest of the app.
  • Hooks layer – wrap SDK helpers (prepareDepositTxData, prepareBulkWithdrawTxData) with domain-specific logic and query invalidation.
  • Components layer – pure UI components that receive prepared data plus callbacks for execution.
  • Lib layer – interaction helpers for viem, Privy, or analytics that should not depend on React state.

​
Server-Side Usage

If you execute transactions from a backend service, mirror the same separation:
  • server/app.ts – Express/Fastify entry point.
  • server/clients/amplify.ts – initAmplifySDK and helper wrappers.
  • server/services/deposits.ts – orchestrates approvals, permits, or withdrawals.

​
Next Steps

  • Follow the Quickstart to wire the providers and hooks.
  • Keep business logic aligned with the primitives in Functions.
  • For opinionated UI integrations check the Examples.***