In this guide, you will learn how to enable GitHub authentication and onboard users.
- Make sure you can access Arcana Developer Dashboard: https://dashboard.arcana.network
- Install the
@arcana/authpackage. For details, see Arcana Auth Quick Start Guide.
Note that some steps are performed using GitHub Developer Settings Dashboard, and others using Arcana Dashboard. After that simply integrate your dApp with the Arcana Auth SDK to trigger GitHub login and onboard users.
To enable GitHub based social authentication in Web3 applications, developers must perform these three steps before integrating with the Arcana Auth SDK.
Step 1: Use Arcana Dashboard
Go to the Arcana Dashboard: https://dashboard.arcana.network
Registering the Application
If you have already registered your dApp using Arcana Dashboard and obtained an App Address, you may skip this step.
Register your dApp by creating a new dApp entry and specify a dApp name. Use defaults for other settings or change them as per your use case. Refer to the how to configure dApp guide for details.
Go to the
Configure->Social Auth configuration section and copy the redirect URI value displayed there. This will be used in the next step to generate GitHub OAuth credentials.
Do not close the dashboard browser tab. Open another tab and set up GitHub OAuth. Then come back to the Dashboard tab and complete the dApp configuration settings.
Step 2: GitHub Developer Settings
Go to the GitHub Developer Settings > OAuth Apps and register your dApp as a new GitHub application.
- Enter the application name.
- Specify the homepage URL where your dApp is deployed.
- Provide a brief description of your dApp.
Use the redirect URI value that you saved in the previous step from the
Auth tab of the Arcana Network Dashboard, in the Authorization callback URL field. See here for GitHub OAuth details.
Save the newly registered application in GitHub Developer Settings. GitHub will generate a unique ClientID and a secret for this new application entry.
Copy and save the Client ID and the secret assigned by GitHub for the newly registered application. It will be required in the next step while completing the Arcana Dashboard dApp configuration.
Step 3: Update Arcana Dashboard
Revisit the Arcana Developer Dashboard portal. Click on your app entry and visit the application dashboard page. Click
Configure->Social Auth in the LHS navigation bar and refer to the "GitHub" field. Paste the Client ID and the Secret assigned by GitHub, in the previous step.
Save the settings. Arcana Network assigns an App Address to every registered and configured dApp. You need to save this App Address and use it while integrating the dApp with the Auth SDK.
You are all set with GitHub Setup. Integrate Web3 application with the Arcana Auth SDK and call social login function when the user chooses to log in.
The App Address is displayed on the top right of your dashboard.
You can revisit the Arcana Dashboard later to view and modify configuration settings.
Step 4: Integrate and Use Arcana Auth SDK
Use instructions here to integrate with Arcana Auth SDK. After integration, use the following code to trigger social login for GitHub:
Check if a user is logged in:
const connected = await auth.isLoggedIn()
Use other Auth SDK functions in your dApp. See Auth SDK Usage Guide for details.
Add code in the application to log out an authenticated user:
That is all!
Your dApp is all set for onboarding users via the GitHub OAuth authentication mechanism.
After enabling user sign-in via GitHub, you can allow authenticated users to access the Arcana wallet for signing blockchain transactions on any EVM-compatible network.
- Arcana authentication concepts.
- How to integrate with Arcana Auth SDK
- Handling authentication errors