{"id":19498060,"url":"https://github.com/patrickalphac/all-on-chain-generated-nft","last_synced_at":"2025-04-06T01:08:37.703Z","repository":{"id":37324621,"uuid":"402107490","full_name":"PatrickAlphaC/all-on-chain-generated-nft","owner":"PatrickAlphaC","description":"A repo for generating random NFTs with metadata 100% on chain!","archived":false,"fork":false,"pushed_at":"2022-03-15T07:08:53.000Z","size":75,"stargazers_count":354,"open_issues_count":2,"forks_count":149,"subscribers_count":13,"default_branch":"main","last_synced_at":"2024-07-31T20:37:34.632Z","etag":null,"topics":["chainlink","nft","random"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/PatrickAlphaC.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2021-09-01T15:18:12.000Z","updated_at":"2024-07-09T09:48:18.000Z","dependencies_parsed_at":"2022-07-09T04:00:23.727Z","dependency_job_id":null,"html_url":"https://github.com/PatrickAlphaC/all-on-chain-generated-nft","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/PatrickAlphaC%2Fall-on-chain-generated-nft","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/PatrickAlphaC%2Fall-on-chain-generated-nft/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/PatrickAlphaC%2Fall-on-chain-generated-nft/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/PatrickAlphaC%2Fall-on-chain-generated-nft/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/PatrickAlphaC","download_url":"https://codeload.github.com/PatrickAlphaC/all-on-chain-generated-nft/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247419860,"owners_count":20936012,"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":["chainlink","nft","random"],"created_at":"2024-11-10T21:49:06.048Z","updated_at":"2025-04-06T01:08:37.685Z","avatar_url":"https://github.com/PatrickAlphaC.png","language":"JavaScript","readme":"\u003cbr/\u003e\n\u003cp align=\"center\"\u003e\n\u003ca href=\"https://chain.link\" target=\"_blank\"\u003e\n\u003cimg src=\"./img/randomsvg.svg\" width=\"225\" alt=\"Random NFT logo\"\u003e\n\u003c/a\u003e\n\u003c/p\u003e\n\u003cbr/\u003e\n\n# All On Chain Generated NFT\n\nThis is a repo that shows 2 things:\n\n1. How to create NFTs with metadata that is 100% on-chain\n2. How we can generate random art on-chain using the SVG method\n\nInspired by the [NFT Brownie Mix](https://github.com/PatrickAlphaC/nft-mix)\n\n- [All On Chain Generated NFT](#all-on-chain-generated-nft)\n    - [About SVGs](#about-svgs)\n  - [Requirements](#requirements)\n  - [Installation](#installation)\n  - [Quickstart / Deploy](#quickstart--deploy)\n    - [SVGNFT Deployment](#svgnft-deployment)\n    - [Random SVG Deployment](#random-svg-deployment)\n- [Create NFT \u0026 View on OpenSea](#create-nft--view-on-opensea)\n  - [Important notes for SVGs](#important-notes-for-svgs)\n  - [Other Notes](#other-notes)\n  - [Test](#test)\n  - [Verify on Etherscan](#verify-on-etherscan)\n    - [Linting](#linting)\n\n### About SVGs\n\n[SVG](https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Introduction) means \"Scalable Vector Graphics\", and is an XML language and can be used to create an image either by specifying all the lines and shapes necessary, by modifying already existing raster images, or by a combination of both.\n\nWe can then [base64 encode](https://stackoverflow.com/questions/201479/what-is-base-64-encoding-used-for) this SVG string into a URL that we can set as the `imageURI` in our NFT `tokenURI`. [Like this triangle](data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nNTAwJyBoZWlnaHQ9JzUwMCcgdmlld0JveD0nMCAwIDI4NSAzNTAnIGZpbGw9J25vbmUnIHhtbG5zPSdodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Zyc+PHBhdGggZmlsbD0nYmxhY2snIGQ9J00xNTAsMCxMNzUsMjAwLEwyMjUsMjAwLFonPjwvcGF0aD48L3N2Zz4=)\n\n\n[You can learn everything about SVG parameters and try some examples here.](https://www.w3schools.com/graphics/svg_intro.asp)\n\nWe are going to use the following path data commands because they each only take 2 parameters\n\n```\nM = moveto\nL = lineto \n```\n\nHowever, there are a lot more. You can see sample SVGs in the `img` folder. These get base64 encoded to URLs. You can [see an example of a randomly generated base64 URL here.](data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIGhlaWdodD0nNTAwJyB3aWR0aD0nNTAwJz48cGF0aCBkPSdNIDIwMSA0NzBMIDEwNSA0OThNIDM5OCA0NjBMIDMxNSAzMDFMIDExMiAzMjInIGZpbGw9J3RyYW5zcGFyZW50JyBzdHJva2U9J2JsdWUnLz48cGF0aCBkPSdMIDQzNyA0NjMnIGZpbGw9J3RyYW5zcGFyZW50JyBzdHJva2U9J2dyZWVuJy8+PHBhdGggZD0nTCAyOTQgMzE3JyBmaWxsPSd0cmFuc3BhcmVudCcgc3Ryb2tlPSdibGFjaycvPjxwYXRoIGQ9J00gMzAgMTExTCA0ODMgOTNMIDI2NCAyOTdNIDUzIDQxN0wgMzYzIDY2JyBmaWxsPSd0cmFuc3BhcmVudCcgc3Ryb2tlPSdibHVlJy8+PHBhdGggZD0nTCAzOTkgNDI4TCA0NDEgMjAyJyBmaWxsPSd0cmFuc3BhcmVudCcgc3Ryb2tlPSdncmVlbicvPjxwYXRoIGQ9J00gMjEgMzkwTCAzOTMgNDQyJyBmaWxsPSd0cmFuc3BhcmVudCcgc3Ryb2tlPSdncmVlbicvPjxwYXRoIGQ9J00gMTM5IDE3NUwgMjQ5IDIxMU0gMTI3IDQ2MU0gMjIgMTUzJyBmaWxsPSd0cmFuc3BhcmVudCcgc3Ryb2tlPSdibHVlJy8+PHBhdGggZD0nTSAxOTcgMTk4JyBmaWxsPSd0cmFuc3BhcmVudCcgc3Ryb2tlPSd5ZWxsb3cnLz48L3N2Zz4=)\n\n ## Requirements\n\n- [NPM](https://www.npmjs.com/) or [YARN](https://yarnpkg.com/)\n\n## Installation\n\nSet your `RINKEBY_RPC_URL` [environment variable.](https://www.twilio.com/blog/2017/01/how-to-set-environment-variables.html). You can get one for free at [Infura's site.](https://infura.io/) You'll also need to set the variable `PRIVATE_KEY` which is your private key from you wallet, ie MetaMask. This is needed for deploying contracts to public networks.\n\nYou can set these in your `.env` file if you're unfamiliar with how setting environment variables work. Check out our [.env example](https://github.com/smartcontractkit/hardhat-starter-kit/blob/main/.env.example). If you wish to use this method to set these variables, update the values in the .env.example file, and then rename it to '.env'\n\n![WARNING](https://via.placeholder.com/15/f03c15/000000?text=+) **WARNING** ![WARNING](https://via.placeholder.com/15/f03c15/000000?text=+)\n\nDon't commit and push any changes to .env files that may contain sensitive information, such as a private key! If this information reaches a public GitHub repository, someone can use it to check if you have any Mainnet funds in that wallet address, and steal them!\n\n`.env` example:\n```\nRINKEBY_RPC_URL='www.infura.io/asdfadsfafdadf'\nPRIVATE_KEY='abcdef'\nMAINNET_RPC_URL=\"https://eth-mainnet.alchemyapi.io/v2/your-api-key\"\n```\n`bash` example\n```\nexport RINKEBY_RPC_URL='www.infura.io/asdfadsfafdadf'\nexport PRIVATE_KEY='cat dog frog...'\nexport MAINNET_RPC_URL=\"https://eth-mainnet.alchemyapi.io/v2/your-api-key\"\n```\n\nIf you plan on deploying to a local [Hardhat network](https://hardhat.org/hardhat-network/) that's a fork of the Ethereum mainnet instead of a public test network like Kovan, you'll also need to set your `MAINNET_RPC_URL` [environment variable.](https://www.twilio.com/blog/2017/01/how-to-set-environment-variables.html) and uncomment the `forking` section in `hardhat.config.js`. You can get one for free at [Alchemy's site.](https://alchemyapi.io/).\n\nYou can also use a `MNEMONIC` instead of a `PRIVATE_KEY` environment variable by uncommenting the section in the `hardhat.config.js`, and commenting out the `PRIVATE_KEY` line.\n\nThen you can install all the dependencies\n\n```bash\ngit clone https://github.com/patrickalphac/all-on-chain-generated-nft\ncd all-on-chain-generated-nft\n```\nthen\n\n```bash\nnpm install\n```\n\nOr\n\n```bash\nyarn\n```\n\n\n## Quickstart / Deploy\n\nDeployment scripts are in the [deploy](https://github.com/smartcontractkit/hardhat-starter-kit/tree/main/deploy) directory. If required, edit the desired environment specific variables or constructor parameters in each script, then run the hardhat deployment plugin as follows. If no network is specified, it will default to the Kovan network.\n\n### SVGNFT Deployment\n\nThis will deploy to a local hardhat network.\n\n```bash\nnpx hardhat deploy --tags svg\n```\n\nTo deploy to testnet:\n\n*You'll need testnet ETH in your wallet*\n\n```bash\nnpx hardhat deploy --network rinkeby --tags svg\n```\n\n### Random SVG Deployment\n\nThis will deploy to a local hardhat network.\n\n```bash\nnpx hardhat deploy --tags rsvg\n```\n\nTo deploy to testnet:\n\n*You'll need testnet LINK and ETH in your wallet*\n\n```bash\nnpx hardhat deploy --network rinkeby --tags rsvg\n```\n\nThis will also call the `create` function after deploying and request a random number from a Chainlink node. And it will call `finishMint` to finalize the minting. \n\n# Create NFT \u0026 View on OpenSea\n\nOnce deployed, each will look something like this: \n\n[SVGNFT Opensea](https://testnets.opensea.io/assets/0x2695C58d06501A0f62d3c80e3009DFc655632f7c/0)\n[Random SVG Opensea](https://testnets.opensea.io/assets/0x418859e0d1a9a31461359e759347141e7e854cf4/2)\n[Another Random SVG Opensea](https://testnets.opensea.io/assets/0x418859e0d1a9a31461359e759347141e7e854cf4/3)\n\n\n## Important notes for SVGs\n\n1. Make sure all the double quotes are single quotes\n\nUsing SVGs will allow you to make all the drawings directly on-chain, and store them on chain too! For example, you could store an SVG as a string, and then edit it to change your drawings. \n\n## Other Notes\n\n1. I wasn't able to make `data:image/png` types work as an imageURI, but hypothetically it should. \n\n## Test\nTests are located in the [test](https://github.com/smartcontractkit/hardhat-starter-kit/tree/main/test) directory, and are split between unit tests and integration tests. Unit tests should only be run on local environments, and integration tests should only run on live environments.\n\nTo run unit tests:\n\n```bash\nnpx harhat test\n```\n\n\n## Verify on Etherscan\n\nYou'll need an `ETHERSCAN_API_KEY` environment variable. You can get one from the [Etherscan API site.](https://etherscan.io/apis)\n\n```\nnpx hardhat verify --network \u003cNETWORK\u003e \u003cCONTRACT_ADDRESS\u003e \u003cCONSTRUCTOR_PARAMETERS\u003e\n```\nexample:\n\n```\nnpx hardhat verify --network kovan 0x9279791897f112a41FfDa267ff7DbBC46b96c296 \"0x9326BFA02ADD2366b30bacB125260Af641031331\"\n```\n\n### Linting\n\n```\nyarn lint:fix\n```\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpatrickalphac%2Fall-on-chain-generated-nft","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpatrickalphac%2Fall-on-chain-generated-nft","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpatrickalphac%2Fall-on-chain-generated-nft/lists"}