⚡Quickstart
⚡Quickstart
Get started with magical web3 onboarding in less than two minutes.
# 📥 Install
NPM
01npm install --save magic-sdk
Yarn
01yarn add magic-sdk
CDN
01<script src="https://auth.magic.link/sdk"></script>
#🔧 Configure
#API Keys
You will need to sign up on the Magic Dashboard to get your own API keys to use the SDK. You can access your Universal Wallet API key via the Home tab of any Universal Wallet app in the developer dashboard.
#Network
Universal Wallet currently supports testnets and mainnet for Ethereum, Polygon, and Optimism. If no custom network configuration is passed in, Magic will default to Ethereum as the chain and use pre-defined RPC urls. Other urls listed in the documentation are publicly available and not guaranteed to be working.
Note: All network configurations will share the same address/identity space outside of network: "goerli" which will have it's own space intended for testing.
Ethereum Mainnet
01// ethereum mainnet
02const magic = new Magic('YOUR_API_KEY', {
03 network: "mainnet", // or your own custom node url in the format of { rpcUrl: string chainId: number }
04});
Ethereum Testnet (Sepolia)
01// ethereum testnet
02const magic = new Magic('YOUR_API_KEY', {
03 network: {
04 rpcUrl: 'https://rpc2.sepolia.org/',
05 chainId: 11155111,
06 }, // or your own custom node url
07});
08
Ethereum Testnet (Goerli)
01// ethereum testnet
02const magic = new Magic('YOUR_API_KEY', {
03 network: 'goerli'
04});
05
Polygon
01// polgyon mainnet
02const magic = new Magic('YOUR_API_KEY', {
03 network: {
04 rpcUrl: 'https://polygon-rpc.com/', // or https://matic-mumbai.chainstacklabs.com for testnet
05 chainId: 137 // or 80001 for polygon testnet
06 }
07});
Optimism
01// optimism mainnet
02const magic = new Magic('YOUR_API_KEY', {
03 network: {
04 rpcUrl: 'https://mainnet.optimism.io/', // or https://goerli.optimism.io/ for testnet
05 chainId: 10, // or 420 for goerli optimism testnet
06 }
07});
Note: The examples listed here are using public node providers. It is recommended to switch to your own infrastructure provider through services like Infura and Alchemy prior to going to production.
#🔗 Connect
Once your Magic instance has been configured and initialized, you can now use web3.js or ethers.js to request signatures and call any supported EVM RPC Methods.
Connect with web3.js:
01import { Magic } from "magic-sdk"
02import Web3 from 'web3';
03
04const magic = new Magic('YOUR_API_KEY', {
05 network: {
06 rpcUrl: 'https://rpc2.sepolia.org/', // Sepolia testnet
07 chainId: 11155111,
08 }
09});
10
11const provider = await magic.wallet.getProvider();
12
13const web3 = new Web3(provider);
14const accounts = await magic.wallet.connectWithUI();
Connect with ethers.js:
01import { Magic } from "magic-sdk"
02import { ethers } from "ethers";
03
04const magic = new Magic('YOUR_API_KEY', {
05 network: {
06 rpcUrl: 'https://rpc2.sepolia.org/', // Sepolia testnet
07 chainId: 11155111,
08 }
09});
10
11const provider = await magic.wallet.getProvider();
12
13const web3Provider = new ethers.providers.Web3Provider(provider);
14
15const accounts = await magic.wallet.connectWithUI();
#Next Steps
- 👉 Dive into a React based codesandbox demo and try out Magic's functionality.
- 👉 Learn how to configure your authentication options, show the users's Magic wallet, and request emails from users.
- 👉 Check out our SDK reference.
- 👉 For white-labeled solutions and additional blockchain support, see our enterprise solution Dedicated Wallet.