Deploying Your App to Production

Before you deploy your app to real users, you'll want to make sure your application is secure and ready to onboard users to your app. This involves separating some operations to the server and others to the client.

The examples in Getting Started do everything on the client. The following examples demonstrate what should be on the server instead to ensure your application is secure.

Some of the code here is left for you to implement. This provides you with flexibility and control over your application's authentication. However, if you'd like specific examples, check out our templates or framework guides.

At the root of your application:


import { ThirdwebProvider } from "thirdweb/react";
 
export default function App() {
  return <ThirdwebProvider>{/* Your app here */}</ThirdwebProvider>;
}

In your components directory:


import { ConnectButton } from "thirdweb/react";
import { createThirdwebClient } from "thirdweb";
 
const client = createThirdwebClient({ clientId });
 
export default function Connect() {
  <ConnectButton
    client={client}
    auth={{
      getLoginPayload: async (params) => {
        const address = params.address;
        // fetch the login payload here using address
      },
      doLogin: async (params) => {
        // send the signed login payload (params) to the server
      },
      isLoggedIn: async () => {
        // fetch the user's login status from the server
      },
      doLogout: async () => {
        // send a logout request to the server
      },
    }}
  />;
}