{"id":18557994,"url":"https://github.com/zh/pouns-sdk","last_synced_at":"2025-05-15T14:30:52.523Z","repository":{"id":65062914,"uuid":"581620023","full_name":"zh/pouns-sdk","owner":"zh","description":"SDK to generate pixel-art images with data stored on Polygon blockchain.","archived":false,"fork":false,"pushed_at":"2022-12-24T12:20:55.000Z","size":78,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-03-18T05:06:56.808Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"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/zh.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":"2022-12-23T18:31:59.000Z","updated_at":"2022-12-23T18:33:29.000Z","dependencies_parsed_at":"2022-12-24T17:50:39.072Z","dependency_job_id":null,"html_url":"https://github.com/zh/pouns-sdk","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zh%2Fpouns-sdk","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zh%2Fpouns-sdk/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zh%2Fpouns-sdk/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zh%2Fpouns-sdk/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/zh","download_url":"https://codeload.github.com/zh/pouns-sdk/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254358544,"owners_count":22057937,"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":"2024-11-06T21:38:37.356Z","updated_at":"2025-05-15T14:30:52.489Z","avatar_url":"https://github.com/zh.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Nouns on Polygon (Pouns) NFTs SDK\n\nGenerate pixel-art images with data stored on Polygon blockchain.\n\n## Objectives\n\n[Nouns](https://nouns.wtf/) is a generative non-fungible token project on the Ethereum blockchain. Nouns are 32x32 pixel characters based on people, places, and things. There is a [rich eco-system](https://nouns.center/dev) around this project - REST API services, derivative art etc. All of the images are in the public domain.\n\nMaking changes to this data however is too expensive (Ethereum blockchain fees) or impossible (contract ownership), so I deployed all the art-related contracts (DAO and sells related contracts excluded) to the Polygon testnet (Mumbai) and mainnet. You can think about this as a Read-Only storage, decentrilized, faster and more secure than IPFS.\n\nThe generation of the images is by read-only transactions to the blockchain, so it does not cost any fees and does not require Ethereum wallet as Metamask to be connected. This however require direct RPC connection to the blockchain, so you will need some RPC node provider. By default [Alchemy](https://alchemy.com) is used, but you can change it your project. Good candidate for example is [GetBlock](https://getblock.io/).\n\nCurrent library capsulates and isolates all the complexity of blockchain access. Simple methods for generating SVG images are provided.\n\n## Used libraries and services\n\n* [Nouns Solidity contracts and assets](https://github.com/nounsDAO/nouns-monorepo)\n* [ethers.js](https://github.com/ethers-io/ethers.js/) - A complete Ethereum wallet implementation and utilities in JavaScript (and TypeScript).\n* [Alchemy](https://alchemy.com) - The most powerful set of web3 development tools to build and scale your dApp with ease.\n\n## Installation\n\n```sh\nnpm install pouns-sdk\n```\n\n## Development\n\n```sh\ngit clone https://github.com/zh/pouns-sdk.git\ncd pouns-sdk\nnpm install\n```\n\n## Testing\n\nThere are some basic tests implemented. The testing does not require connection to Internet.\n\n```sh\nnpm test\n```\n\n## Provided methods\n\n* *`getContracts(chain, rpcURL)`* - create JSON config file to access on-chain contracts. `chain='polygon|mumbai'`, default `rpcURL` pointing to Alchemy node.\n* *`seedPoun(contracts)`* - generate valid seed - a 5-numbers tuple, describing the character parts - head, glasses etc.\n* *`generatePoun(contracts, seed)`* - generate SVG image from a given seed. returns base64 encoded data.\n* *`getPoun(chain, seed)`* - high-level function, combining the seed and the image generation steps. Using default contracts. Seed argument is optional.\n\n## Usage\n\nGenerating pixel-art images is separated in two steps:\n\n* generate **seed** - a tuple of 5 numbers, representing different image parts.\n* generate **SVG image** from the seed\n\nThese steps can be executed in sequence, for example, when generating a random number.\nIf the seed is already saved (for example in NFT), only the second step can be executed, based on the existing seed.\n\nFor more imformation see [Nouns project documentation](https://nouns.center/).\n\n### Generate seed\n\nthe example is for node.js (CLI usage):\n\n```js\nconst { getContracts, seedPoun } = require('pouns-sdk')\n\nconst createPoun = async () =\u003e {\n  const contracts = getContracts()\n  const seed = await seedPoun(contracts)\n  ...\n}\ncreatePoun()\n```\n\n### Generate SVG image\n\nThe example is for using in *React.js* component:\n\n```js\nimport { getContracts, seedPoun, generatePoun } from 'pouns-sdk'\n...\nconst [currentImg, setCurrentImg] = useState('')\n\nconst createPoun = async () =\u003e {\n  const contracts = getContracts();\n  const seed = await seedPoun(contracts);\n  const svg = await generatePoun(contracts, seed);\n  setCurrentImg(Buffer.from(svg, 'base64').toString());\n};\n...\n```\n\nand later to display the image:\n\n```html\n\u003cdiv style={{ display: 'grid', gridTemplateColumns: '1fr' }}\u003e\n  \u003cdiv dangerouslySetInnerHTML={{ __html: currentImg }}\u003e\u003c/div\u003e\n\u003c/div\u003e\n```\n\n### Combining the two steps\n\nThe example is for using in *React.js* component:\n\n```js\nimport { getPoun } from 'pouns-sdk'\n...\nconst [currentImg, setCurrentImg] = useState('')\n\nconst createPoun = async () =\u003e {\n  const svg = await getPoun();\n  setCurrentImg(Buffer.from(svg, 'base64').toString());\n};\n...\n```\n\n### Using in URLs\n\nMost of NFTs specifing the media as an URL to the image, video etc. file. Pouns images can be represented as an URL with their seed: `pouns://[0,18,89,117,5]`. This URL can be used for image generation as follows:\n\n```js\nif (token.url.includes('pouns://')) {\n  const seed = token.url.substring(8);\n  const imgData = await getPoun(seed);\n  ....\n}\n```\n\n### Change generated SVG image size\n\nThe image size is hardcoded in the SVG image data - `320x320 px`. But because the format of the data is always the same, you can change the image size like this:\n\n```js\nconst imgData = await getPoun(seed); // imgData is a string\nconst newSize = 160;\nconst fixedData = imgData.replace(\n  '\u003csvg width=\"320\" height=\"320\"',\n  `\u003csvg width=\"${newSize}\" height=\"${newSize}\"`\n);\n```\n\n### Using 'Mumbai' testnet\n\nMost of the images data is also deployed to Mumbai Polygon testnet. In order to generate images, based on that data, specify testnet, when getting contracts.\n\n```js\nconst contracts = getContracts('mumbai')\n```\n\n### Using different RPC node\n\nIf the default Alchemy RPC connection is too slow or not working, you can use for example [GetBlock](https://getblock.io) RPC node:\n\n```js\nconst rpcURL = 'https://matic.getblock.io/.../testnet/'\nconst contracts = getContracts('mumbai', rpcURL)\n```\n\n## Future plans\n\n* REST interface for even easier image generation\n* Ready React.js components - NFTs etc. to generate and display the images\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzh%2Fpouns-sdk","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fzh%2Fpouns-sdk","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzh%2Fpouns-sdk/lists"}