https://github.com/unboxed-software/web3-react-magic-connect-nextjs
https://github.com/unboxed-software/web3-react-magic-connect-nextjs
Last synced: 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/unboxed-software/web3-react-magic-connect-nextjs
- Owner: Unboxed-Software
- Created: 2023-03-31T13:35:08.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2023-11-28T21:40:55.000Z (over 2 years ago)
- Last Synced: 2025-03-23T15:33:46.508Z (about 1 year ago)
- Language: TypeScript
- Homepage: https://web3-react-magic.vercel.app
- Size: 384 KB
- Stars: 0
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## Next.js - web3-react Magic Connect Example
This is a minimal implementation of the `@magiclabs/web3-react` Magic Connect Connector in Next.js.
It includes a wallet selector modal, network switching, message signing, and NFT minting. Note that the NFT contract is only deployed and implemented for Sepolia.
## Getting started
1. Clone this repo
2. Install dependencies: `npm install`
3. Rename `.env.example` to `.env` and replace variables with your own. You can get your own Magic Connect API Key by creating an account [here](https://magic.link/).
4. Run the development server: `npm run dev`
## Magic Connect Connector
```ts
import { initializeConnector } from "@web3-react/core"
import { MagicConnect } from "@magiclabs/web3-react"
// Initialize the MagicConnect connector
export const [magicConnect, hooks] = initializeConnector(
(actions) =>
new MagicConnect({
actions,
options: {
apiKey: process.env.NEXT_PUBLIC_MAGICKEY, // Magic Connect Publishable API key
networkOptions: {
rpcUrl: "https://rpc2.sepolia.org", // Sepolia Testnet RPC URL
chainId: 11155111, // Chain ID for the Sepolia network
},
},
})
)
```