{"id":29182824,"url":"https://github.com/magiclabs/example-nft-gated-content","last_synced_at":"2025-07-01T20:33:09.014Z","repository":{"id":231603081,"uuid":"765847060","full_name":"magiclabs/example-nft-gated-content","owner":"magiclabs","description":"Public example/demo site for NFT Gating functions in the Magic SDKs","archived":false,"fork":false,"pushed_at":"2024-04-04T23:09:44.000Z","size":181,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":4,"default_branch":"master","last_synced_at":"2024-04-05T21:28:02.484Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://example-nft-gated-content.vercel.app","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/magiclabs.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":".github/CODEOWNERS","security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null}},"created_at":"2024-03-01T18:30:04.000Z","updated_at":"2024-04-04T19:10:55.000Z","dependencies_parsed_at":"2024-04-04T21:27:53.886Z","dependency_job_id":"320a4fd9-0028-46ea-8e1e-c27ca9e9d0a6","html_url":"https://github.com/magiclabs/example-nft-gated-content","commit_stats":null,"previous_names":["magiclabs/example-nft-gated-content"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/magiclabs/example-nft-gated-content","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/magiclabs%2Fexample-nft-gated-content","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/magiclabs%2Fexample-nft-gated-content/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/magiclabs%2Fexample-nft-gated-content/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/magiclabs%2Fexample-nft-gated-content/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/magiclabs","download_url":"https://codeload.github.com/magiclabs/example-nft-gated-content/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/magiclabs%2Fexample-nft-gated-content/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":263033216,"owners_count":23403117,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-07-01T20:32:58.792Z","updated_at":"2025-07-01T20:33:08.897Z","avatar_url":"https://github.com/magiclabs.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Magic NFT Token Gating - Demo Repo\n\nWelcome to Magic's NFT Token Gating demo repo.\n\nThis site shows how to implement a NextJS app that:\n1. Contains a \"restricted\" section of the website, only accessible by logged in users that own a specific NFT\n2. Generates QR codes for an IRL event, where someone can scan the code and determine if the user owns a specific NFT\n\n## Setup\n\n### Prerequisites\n\nYou'll need an NFT that you want to use to gate the content on your site. If you don't have a contract set up, you can mint a free NFT on Magic's homepage: https://magic.link/ and send it to your wallet later on.\n\nYou also need a Magic Dedicated Wallet App, which you can create for free at https://dashboard.magic.link/ -- make sure you are using Dedicated Wallet and not Universal!\n\n### Environment Variables\n\nClone this repo locally and copy the `.env.example` file into a new file called `.env.local`. \n\n- Add the Magic public + private keys (found in your dashboard at https://dashboard.magic.link/).\n- Replace the contract address and token ID with your contract. This repo assumes you are using Polygon mainnet -- if not, replace the RPC_URL and CHAIN_ID variables.\n\n### Installation\n\nInstall yarn (or other package manager) if you don't already have it, then run\n\n`yarn install`\n\nto install all the required packages.\n\n### Development Server\n\nRun the development server with:\n\n`yarn dev`\n\nAnd open your browser to http://localhost:3000 to view the app.\n\n## Usage\n\nOnce the app is up and running, you can try to click \"View Gated Content\" -- you'll get access denied because you haven't logged in.\n\nLog into the app by clicking \"Connect\", and try again. You will still get access denied, but this time the message will show that it's because you don't have the NFT. Transfer a Demo NFT (or your own, if you set the contract + token information in the environment variables) to your new wallet. You can find details about the wallet by clicking the \"Open Wallet\" button.\n\nOnce you have logged in, and your wallet has the right NFT, you should be able to view the Gated Content!\n\nYou can also build an \"IRL\" type experience using this repo. For example, let's say you deploy this to https://awesome-gated-experience.com on Vercel. You sent your users their tickets to an event via email, they minted the NFTs and have their wallets ready to go. At the event:\n\n1. The users scan a QR code printed on a banner or entrance area\n2. The QR brings them to your website. They log into Magic if needed (they may already be logged in from minting previously).\n3. A big QR code appears on their phone screen. They present it to the ticket-checking staff\n4. The ticket-checking staff scans the QR code, which brings them to https://awesome-gated-experience.com/verify . This checks that the user actually owns the wallet, and that the wallet contains the NFT. The app shows either \"Valid\" or \"Not Valid\" and the user is (hopefully) allowed into the event!\n\n## How it Works\n\nUnder the hood we use DID tokens -- a special token you can generate with the Magic SDK for logged in users. The token is sent to your backend (SSR in this repo example) for validation:\n\n- The backend uses the Magic Admin SDK to call Magic's API and validate the DID token, which expires after a certain time\n- Magic returns the wallet address for the token, so your backend can then check on-chain to see if the wallet contains the NFT\n\n\n## Additional Resources\n\n- [API Documentation](https://magic.link/docs/home/welcome)\n- [Blog](https://magic.link/blogs)\n- [Help Center](https://help.magic.link/knowledge)\n\n## Help\n\nContact us via [discord](https://discord.gg/magiclabs) or visit our [help page](https://help.magic.link/knowledge).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmagiclabs%2Fexample-nft-gated-content","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmagiclabs%2Fexample-nft-gated-content","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmagiclabs%2Fexample-nft-gated-content/lists"}