Learn more
Introducing Telegram Auto-Wallets: Generate a wallet with your Telegram account with a single click!
Table of contents
Ever envisioned crafting a web3-first authentication experience on mobile? Well, get ready because it's easier than you think! In this blog post we’ll explore creating a mobile login with the Dynamic SDK.
Let’s get started!
Note: we assume that you’ve already successfully enabled Dynamic with your React project. If you haven’t yet, we suggest getting started here.
When integrating a Dynamic through a browser, remember that there's no direct connection between the browser and the app itself. The authentication process happens with Dynamic, and once the token is received, a query is made to the backend, leading to a deep link response which will be leveraged by the mobile app.
This means that the process will work like this:
Before we dive into the details, if you want to see this in action, check out the tokenproof.xyz mobile app. Here you can see how they’ve leveraged this process to enable Dynamic both on their website and inside their mobile app.
The first step in the process involves setting up the user's interaction with your mobile app. The user clicks on a 'connect' button, which triggers a redirect to your web browser. This web browser hosts the Dynamic SDK.
Inside the browser, the user will complete authentication through the Dynamic SDK. Upon successful authentication, a JWT (JSON Web Token) is generated.
In this snippet, `sendTokenToServer` is a function that you would define to handle sending the token to your server.
Once your server receives the JWT, it verifies the token. If the JWT is valid, the server responds with a deep link. This deep link redirects the user back to your mobile app and allows them to log in.
Here, `respondWithDeepLink` is a function that you would define to generate the deep link based on the user's data.
At this step of the process, there are various ways to deeplink back to your mobile app. tokenproof elected to use firebase’s dynamic link, where they have rendered a button that opens the app and exchanges that code for a tokenproof credential.
Integrating Dynamic in your mobile app is a straightforward process. By ensuring a seamless transition between your app, the browser, and the backend, you can enhance the user experience significantly.
The key to this process is the successful generation, transmission, and verification of the JWT, which securely handles user authentication. This approach leverages the robustness of Dynamic, making it an efficient method for developers to authenticate users in their mobile applications.
Once you finish implementation, a few key things to explore are:
Share this article