Quick Start: Web Apps

Overview

Follow these steps to begin using the Arcana Auth product:

1. Use the Arcana Developer Dashboard and register the app; obtain a unique Client ID. Set up social providers that will be enabled for onboarding app users.
2. Install the SDK and integrate the app with the Arcana Auth SDK. Use the Client ID to create a new AuthProvider and use either the built-in plug-and-play login UI or custom UI to onboard users.
3. Add code in the app for onboarding users and programmatically accessing Web3 wallet operations supported by the Arcana wallet. Authenticated users can instantly access the Arcana wallet.
4. Deploy app on the Testnet, validate and then deploy on Mainnet.

Get Started

Register & Configure

First, follow the instructions to register and configure the app using the Arcana Developer Dashboard. As part of the app registration, a unique value, Client ID, is assigned to each app. This is required for integrating the app with the Arcana Auth SDK.

During app configuration, developers can enable configure one or more authentication providers to onboard app users.

Install Arcana Auth SDK

Arcana Auth SDK can be integrated with different types of Web3 apps. Depending upon the type of Web3 app, developers may need to install one or more Arcana Auth packages and integrate the app. See SDK installation guide for more details.

Integrate App

Follow the integration instructions as per the app type and integrate the app with the Arcana Auth SDK. Manage user experience for signing blockchain transactions with wallet visibility settings. These must be specified during app integration and instantiation of the AuthProvider.

After integrating with the Arcana Auth SDK app developers can use the AuthProvider to access the standard Ethereum Web3 provider interface in the context of an authenticated user. Use AuthProvider functions to onboard users, and sign blockchain transactions. For more information, see Arcana Auth SDK Usage Guide and Arcana Auth SDK Reference Guide, and the Arcana wallet Developer's Guide.

Onboard Users

After installing and integrating with the Arcana Auth SDK, app developers can add code to onboard the users using one of the two available methods:

1. Use the plug-and-play login UI feature to instantly access the built-in, default user login UI provided by the Arcana Auth SDK. Simply call connect method of the AuthProvider to bring up the plug-and-play login UI. The plug-and-play pop-up UI displays all the authentication mechanisms configured by the app developer. User can select one and onboard the app.

2. Build a custom user login UI for the app and call the appropriate Arcana Auth SDK functions for onboarding users via the configured social providers and the passwordless login option.

Sign Blockchain Transactions

After onboarding users, developers can add code to use the AuthProvider in the app and call standard JSON RPC Web3 wallet functions programmatically in the context of an authenticated user. Enable authenticated users to sign blockchain transactions, send and receive tokens, NFTs, and more using the Arcana wallet.

Deploy App

An app integrated with the Arcana Auth SDK can be deployed for use only after the developer has completed these steps:

• Register and configure the app via the Arcana Developer Dashboard
• Integrate the app with the Arcana Auth SDK
• Add code to onboard users
• Add code to allow authenticated users to sign the blockchain transactions

Developers can choose to deploy one instance of the app (say, under active development) on the Arcana Testnet while simultaneously deploying a stable version of their app (say, one validated on Testnet and ready for users) on the Arcana Mainnet.

By default, when an app is registered, a 'Testnet' configuration profile is associated with the app, and a unique Client ID is assigned to this 'Testnet' profile. To deploy your app on the Arcana Mainnet, you need to create a corresponding 'Mainnet' configuration profile and update the Arcana Auth SDK integration code to use the new Client ID assigned to the app's 'Mainnet' configuration profile. For details on how to deploy your app on the Arcana Testnet / Mainnet, see App Deployment Guide.

Examples

Here are some examples of Arcana Auth SDK usage:

1. See how to integrate an app with the Arcana Auth SDK and create a Web2-like familiar user onboarding experience via Google .

2. Manage Web3 user experience for signing blockchain transactions with the Arcana wallet:

   • Enable authenticated users to sign blockchain transactions by setting the Arcana wallet visibility parameter while instantiating the AuthProvider.
   • Use pre-configured blockchains or add other supported blockchain networks programmatically as per your app requirements. Refer to the list of supported blockchain networks.
   • Allow authenticated app users to use the Arcana wallet and check account balances, send or receive ERC-20, ERC-721, and ERC-1155 tokens, deploy smart contracts, interact with smart contracts, switch networks, manage NFTs. See the Arcana wallet Developer's Guide.

Developer & User Guides

For more details on how users interact with the Arcana wallet, see Arcana wallet User Guide.

Developers can refer to the Arcana Developer Dashboard User Guide to learn more about how to register and configure the apps. Also, see Arcana Auth SDK Usage Guide and the Arcana Auth SDK Reference Guide for various functions offered by the Arcana Auth SDK. To programmatically access Web3 wallet operations, see Arcana wallet Developer's Guide.

See also

• User Authentication
• Video Tutorials
• Configuring Arcana wallet visibility
• Handling Arcana Auth SDK error messages
• Arcana Auth SDK Usage Guide
• Arcana Auth SDK Reference Guide