1<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="/assets/styles-CXrhRRgc.css" data-precedence="default"/><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Work+Sans:wght@300;400;500;600;700&display=swap" data-precedence="default"/><title>Build strategy â verifiable onchain demos in one Lovable build</title><meta name="author" content="StreetKode Fam · Indian Krump Festival 14"/><meta property="og:type" content="website"/><meta name="twitter:card" content="summary"/><meta name="twitter:site" content="@Lovable"/><meta name="twitter:title" content="Creative Blockchain â 2,000 web3 hackathon ideas"/><meta name="twitter:description" content="An archive of 2,000 copy-paste Lovable mega-prompts that wire MetaMask, Polygon Amoy, PolygonScan, Privy, Pinata and x402 USDC micropayments into ten creative disciplines."/><meta property="og:image" content="https://storage.googleapis.com/gpt-engineer-file-uploads/attachments/og-images/1a26910c-a223-475e-81b0-20964634d527"/><meta name="twitter:image" content="https://storage.googleapis.com/gpt-engineer-file-uploads/attachments/og-images/1a26910c-a223-475e-81b0-20964634d527"/><meta name="description" content="How to ship a Polygon Amoy-verified web3 demo in a single Lovable build: five secrets, one paste, contract live on PolygonScan, assets pinned on IPFS, sign-in via Privy."/><meta property="og:title" content="Real onchain in one Lovable build"/><meta property="og:description" content="Build-time pattern for Lovable + Polygon Amoy hackathon entries."/><link rel="modulepreload" href="/assets/index-DYOZkI1T.js"/><link rel="modulepreload" href="/assets/chunk--c01j_DQ.js"/><link rel="modulepreload" href="/assets/ClientOnly-GukezuWP.js"/><link rel="modulepreload" href="/assets/link-CH4xpYBE.js"/><link rel="modulepreload" href="/assets/matchContext-BGKmh-E3.js"/><link rel="modulepreload" href="/assets/useStore-BSaljYDy.js"/><link rel="modulepreload" href="/assets/react-dom-BgfaE1k6.js"/><link rel="modulepreload" href="/assets/jsx-runtime-DxoCn-kY.js"/><link rel="modulepreload" href="/assets/strategy-COrdjTP3.js"/><link rel="modulepreload" href="/assets/site-shell-VLmgk5dE.js"/><link rel="modulepreload" href="/assets/copy-button-B3yD9nno.js"/><link rel="preconnect" href="https://fonts.googleapis.com"/><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="anonymous"/>
1<script defer src="/~flock.js" data-proxy-url="/~api/analytics"></script>
1</head><body><!--$--><div class="min-h-screen flex flex-col overflow-x-hidden"><header class="sticky top-0 z-40 backdrop-blur-md bg-background/80 border-b border-border"><div class="max-w-7xl mx-auto px-5 sm:px-8 py-3 sm:py-5 flex items-center justify-between gap-3"><a href="/" class="flex items-center gap-2 min-w-0 group"><span class="hidden sm:inline eyebrow shrink-0">Vol. 01</span><span class="font-display text-lg sm:text-2xl truncate text-foreground">Creative <span class="italic text-primary">Blockchain</span></span></a><nav class="hidden md:flex items-center gap-1 text-sm"><a href="/themes" class="px-3 py-1.5 text-[11px] tracking-[0.24em] uppercase font-medium text-muted-foreground hover:text-primary transition-colors duration-500">Themes</a><a href="/showcase" class="px-3 py-1.5 text-[11px] tracking-[0.24em] uppercase font-medium text-muted-foreground hover:text-primary transition-colors duration-500">Showcase</a><a class="px-3 py-1.5 text-[11px] tracking-[0.24em] uppercase font-medium text-muted-foreground hover:text-primary transition-colors duration-500 px-3 py-1.5 text-[11px] tracking-[0.24em] uppercase font-medium text-primary" href="/strategy" data-status="active" aria-current="page">Strategy</a><a href="/quantum-primer" class="px-3 py-1.5 text-[11px] tracking-[0.24em] uppercase font-medium text-muted-foreground hover:text-primary transition-colors duration-500">Primer</a><a href="/about" class="px-3 py-1.5 text-[11px] tracking-[0.24em] uppercase font-medium text-muted-foreground hover:text-primary transition-colors duration-500">About</a><a href="https://creativequantum.lovable.app/" target="_blank" rel="noreferrer" class="ml-3 px-3 py-2 border border-border text-foreground text-[10px] font-semibold tracking-[0.28em] uppercase hover:border-primary/60 hover:text-primary transition-colors duration-500">Hackathon â</a><a href="https://amoy.polygonscan.com/" target="_blank" rel="noreferrer" class="ml-2 px-4 py-2 bg-primary text-primary-foreground text-[10px] font-semibold tracking-[0.28em] uppercase hover:bg-foreground transition-colors duration-500">PolygonScan â</a></nav><button type="button" aria-haspopup="dialog" aria-expanded="false" aria-controls="radix-_R_daq_" data-state="closed" aria-label="Open menu" class="md:hidden inline-flex items-center justify-center h-10 w-10 border border-border text-foreground hover:border-primary/60 transition shrink-0"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-menu h-5 w-5" aria-hidden="true"><path d="M4 5h16"></path><path d="M4 12h16"></path><path d="M4 19h16"></path></svg></button></div></header><main class="flex-1 overflow-x-hidden"><article class="max-w-3xl mx-auto px-5 pt-14 pb-20"><div class="eyebrow text-primary mb-4">build strategy · onchain</div><h1 class="font-display text-4xl sm:text-5xl md:text-6xl font-bold leading-[0.95] tracking-tight text-foreground">Real onchain, <span class="text-primary italic">five secrets</span>, one build.</h1><p class="mt-6 text-lg text-muted-foreground leading-relaxed font-light">Every mega-prompt in this repo uses the same pattern, because it's the only pattern that lets a Lovable account ship a verifiable Polygon Amoy demo in one shot.</p><section class="mt-10 p-6 border border-primary/30 bg-card"><h2 class="font-display text-xl font-semibold text-foreground italic">Why Polygon Amoy?</h2><p class="mt-3 text-sm text-muted-foreground leading-relaxed font-light">Polygon Amoy is Coinbase's free L2 testnet â full EVM, PolygonScan explorer, standard wallets, but funded by a public faucet. Contracts are publicly inspectable, you never spend real POL, and Privy sponsored transactions on Base cost fractions of a cent so judges can try the demo without a wallet. PolygonScan is Etherscan-v2 under the hood, so a single<!-- --> <code>ETHERSCAN_API_KEY</code> verifies contracts on both.</p></section><section class="mt-10"><h2 class="font-display text-2xl font-semibold mb-3 text-foreground italic">The recipe</h2><div class="flex items-baseline justify-between mb-2"><span class="eyebrow text-primary">recipe</span><button class="inline-flex items-center gap-2 px-4 py-2 bg-primary text-primary-foreground text-[10px] tracking-[0.28em] uppercase font-semibold hover:bg-foreground transition-colors duration-500">Copy recipe</button></div><pre class="whitespace-pre-wrap break-words [overflow-wrap:anywhere] font-mono text-[12px] sm:text-[13px] leading-relaxed p-4 sm:p-5 max-w-full overflow-x-hidden border border-border bg-card text-foreground
1/90"># 1. In your Lovable project, add five secrets (Settings -> Secrets): 2METAMASK_PRIVATE_KEY=0x... 3POLYGON_AMOY_RPC_URL=https://rpc-amoy.polygon.technology # or Alchemy Polygon Amoy HTTPS URL 4ETHERSCAN_API_KEY=... # Etherscan v2 single key â covers PolygonScan 5PRIVY_APP_ID=... 6PINATA_JWT=eyJhbGciOi... 7 8# 2. Fund the MetaMask account on Polygon Amoy: 9open https://faucet.polygon.technology/ 10# or https://www.alchemy.com/faucets/polygon-amoy 11 12# 3. Copy a mega-prompt from this repo into Lovable. One paste: 13# - scaffolds the React app 14# - writes the Solidity contract (with hackathon credit in NatSpec) 15# - deploys to Polygon Amoy and verifies on PolygonScan 16# - wires Privy social login + sponsored tx 17# - pins generated assets to IPFS via Pinata 18# - exposes the contract address + PolygonScan link in the UI 19 20# 4. Open the live PolygonScan link. Your demo is provably onchain. 21</pre></section><section class="mt-10"><h2 class="font-display text-2xl font-semibold mb-3 text-foreground italic">1. The contract â credit baked in</h2><p class="text-sm text-muted-foreground mb-3 font-light">Every Solidity file deployed from a Creative Blockchain prompt MUST carry the hackathon credit in NatSpec, so provenance lives onchain alongside the bytecode.</p><div class="flex items-baseline justify-between mb-2"><span class="eyebrow text-primary">contracts/Provenance.sol</span><button class="inline-flex items-center gap-2 px-4 py-2 bg-primary text-primary-foreground text-[10px] tracking-[0.28em] uppercase font-semibold hover:bg-foreground transition-colors duration-500">Copy</button></div><pre class="whitespace-pre-wrap break-words [overflow-wrap:anywhere] font-mono text-[11px] sm:text-[12px] leading-relaxed p-4 sm:p-5 max-w-full overflow-x-hidden border border-border bg-card text-foreground/90">// contracts/Provenance.sol â every contract carries the hackathon credit in NatSpec 22// SPDX-License-Identifier: MIT 23pragma solidity ^0.8.24; 24 25/// @title Provenance 26/// @notice Built during the Creative AI & Quantum Hackathon 27/// @notice organised by StreetKode Fam during Indian Krump Festival 14 28contract Provenance { 29 event Logged(address indexed author, string cid, uint256 at); 30 31 function log(string calldata cid) external { 32 emit Logged(msg.sender, cid, block.timestamp); 33 } 34} 35</pre></section><section class="mt-10"><h2 class="font-display text-2xl font-semibold mb-3 text-foreground italic">2. Hardhat config for Polygon Amoy + Etherscan v2</h2><p class="text-sm text-muted-foreground mb-3 font-light">Install <code>@nomicfoundation/hardhat-ethers</code> and<!-- --> <code>@nomicfoundation/hardhat-verify</code>. Etherscan v2 uses a single API key across 60+ EVM chains including Base â no separate PolygonScan key required.</p><div class="flex items-baseline justify-between mb-2"><span class="eyebrow text-primary">hardhat.config.cjs</span><button class="inline-flex items-center gap-2 px-4 py-2 bg-primary text-primary-foreground text-[10px] tracking-[0.28em] uppercase font-semibold hover:bg-foreground transition-colors duration-500">Copy</button></div><pre class="whitespace-pre-wrap break-words [overflow-wrap:anywhere] font-mono text-[11px] sm:text-[12px] leading-relaxed p-4 sm:p-5 max-w-full overflow-x-hidden border border-border bg-card text-foreground/90">// hardhat.config.cjs â Polygon Amoy (chainId 80002) + Etherscan v2 verification 36require("@nomicfoundation/hardhat-ethers"); 37require("@nomicfoundation/hardhat-verify"); 38 39const pk = process.env.METAMASK_PRIVATE_KEY; 40 41module.exports = { 42 solidity: { version: "0.8.24", settings: { optimizer: { enabled: true, runs: 200 } } }, 43 networks: { 44 polygonAmoy: { 45 url: process.env.POLYGON_AMOY_RPC_URL || "https://rpc-amoy.polygon.technology", 46 accounts: pk ? [pk.startsWith("0x") ? pk : "0x" + pk] : [], 47 chainId: 80002, 48 }, 49 }, 50 etherscan: { 51 // Single Etherscan v2 key â works for PolygonScan too. 52 apiKey: process.env.ETHERSCAN_API_KEY, 53 customChains: [{ 54 network: "polygonAmoy", 55 chainId: 80002, 56 urls: { 57 apiURL: "https://api.etherscan.io/v2/api?chainid=80002", 58 browserURL: "https://amoy.polygonscan.com", 59 }, 60 }], 61 }, 62 sourcify: { enabled: false }, 63}; 64</pre></section><section class="mt-10"><h2 class="font-display text-2xl font-semibold mb-3 text-foreground italic">3. Deploy + verify on PolygonScan</h2><div class="flex items-baseline justify-between mb-2"><span class="eyebrow text-primary">scripts/deploy.cjs</span><button class="inline-flex items-center gap-2 px-4 py-2 bg-primary text-primary-foreground text-[10px] tracking-[0.28em] uppercase font-semibold hover:bg-foreground transition-colors duration-500">Copy</button></div><pre class="whitespace-pre-wrap break-words [overflow-wrap:anywhere] font-mono text-[11px] sm:text-[12px] leading-relaxed p-4 sm:p-5 max-w-full overflow-x-hidden border border-border bg-card text-foreground
64/90">// scripts/deploy.cjs â deploys, then verifies on PolygonScan 65const hre = require("hardhat"); 66async function main() { 67 const F = await hre.ethers.getContractFactory("Provenance"); 68 const c = await F.deploy(); 69 await c.waitForDeployment(); 70 const addr = await c.getAddress(); 71 console.log("deployed:", addr); 72 // then, in a second command: 73 // npx hardhat verify --network polygonAmoy <address> 74} 75main().catch((e) => { console.error(e); process.exit(1); }); 76</pre></section><section class="mt-10"><h2 class="font-display text-2xl font-semibold mb-3 text-foreground italic">4. Pin assets to IPFS via Pinata</h2><div class="flex items-baseline justify-between mb-2"><span class="eyebrow text-primary">src/lib/pinata.ts</span><button class="inline-flex items-center gap-2 px-4 py-2 bg-primary text-primary-foreground text-[10px] tracking-[0.28em] uppercase font-semibold hover:bg-foreground transition-colors duration-500">Copy</button></div><pre class="whitespace-pre-wrap break-words [overflow-wrap:anywhere] font-mono text-[11px] sm:text-[12px] leading-relaxed p-4 sm:p-5 max-w-full overflow-x-hidden border border-border bg-card text-foreground/90">// src/lib/pinata.ts â pin a Blob to IPFS via Pinata JWT 77export async function pinToIPFS(file: Blob, name = "artifact") { 78 const fd = new FormData(); 79 fd.append("file", file, name); 80 const r = await fetch("https://api.pinata.cloud/pinning/pinFileToIPFS", { 81 method: "POST", 82 headers: { Authorization: `Bearer ${process.env.PINATA_JWT}` }, 83 body: fd, 84 }); 85 const { IpfsHash } = await r.json(); 86 return IpfsHash as string; // the CID 87} 88</pre></section><section class="mt-10"><h2 class="font-display text-2xl font-semibold mb-3 text-foreground italic">5. Sign in with Google via Privy</h2><p class="text-sm text-muted-foreground mb-3 font-light">Enable Polygon Amoy (chainId 80002) as a supported chain in your Privy dashboard before shipping.</p><div class="flex items-baseline justify-between mb-2"><span class="eyebrow text-primary">src/main.tsx</span><button class="inline-flex items-center gap-2 px-4 py-2 bg-primary text-primary-foreground text-[10px] tracking-[0.28em] uppercase font-semibold hover:bg-foreground transition-colors duration-500">Copy</button></div><pre class="whitespace-pre-wrap break-words [overflow-wrap:anywhere] font-mono text-[11px] sm:text-[12px] leading-relaxed p-4 sm:p-5 max-w-full overflow-x-hidden border border-border bg-card text-foreground/90">// src/main.tsx â Privy social login + sponsored Polygon Amoy transactions 89import { PrivyProvider } from "@privy-io/react-auth"; 90 91<PrivyProvider 92 appId={import.meta.env.VITE_PRIVY_APP_ID} 93 config={{ 94 loginMethods: ["google", "email"], 95 embeddedWallets: { ethereum: { createOnLogin: "users-without-wallets" } }, 96 defaultChain: { id: 80002, name: "Polygon Amoy" }, 97 }} 98> 99 <App /> 100</PrivyProvider> 101</pre></section><section class="mt-10 p-6 border border-border bg-card"><h2 class="font-display text-xl font-semibold text-foreground italic">Hackathon rules of thumb</h2><ul class="mt-3 space-y-2 text-sm text-muted-foreground font-light"><li>· One mega-prompt = one build message. Don't iterate the architecture, iterate the UI.</li><li>· Always show the live PolygonScan link in the UI â that's your proof.</li><li>· Use Privy sponsored tx so judges don't need a wallet to try the demo.</li><li>· Pin every user-generated asset to IPFS the moment it's created.</li><li>· Add a "Built during the Creative AI & Quantum Hackathon â StreetKode Fam · Indian Krump Festival 14" line to your footer.</li></ul></section><div class="mt-10 flex flex-wrap gap-3"><a href="/themes" class="px-5 py-2.5 bg-primary text-primary-foreground font-semibold hover:bg-foreground transition">Pick an idea â</a><a href="/quantum-primer" class="px-5 py-2.5 border border-primary/40 text-foreground hover:bg-primary hover:text-primary-foreground transition">Blockchain primer</a></div></article></main><footer class="border-t border-border mt-24"><div class="max-w-7xl mx-auto px-5 sm:px-8 py-10 flex flex-col gap-3 text-[10px] tracking-[0.32em] uppercase text-muted-foreground"><div class="flex flex-wrap items-center justify-between gap-4"><span>Vol. 01 · 1,000 entries · 10 disciplines</span><span class="font-display normal-case tracking-normal text-base italic text-primary">Lovable à Polygon Amoy</span><span>MetaMask · Privy · Pinata · MMXXVI</span></div><div class="border-t border-border/60 pt-3 normal-case tracking-normal text-[11px] font-light leading-relaxed text-muted-foreground
101/80">Built during the Creative AI & Quantum Hackathon â organised by<!-- --> <span class="text-primary">StreetKode Fam</span> during Indian Krump Festival 14.</div></div></footer></div>
101<script>(function(t){let s;try{s=JSON.parse(sessionStorage.getItem(t.storageKey)||"{}")}catch(e){console.error(e);return}const c=t.key||window.history.state?.__TSR_key,r=c?s[c]:void 0;if(t.shouldScrollRestoration&&r&&typeof r=="object"&&Object.keys(r).length>0){for(const e in r){const o=r[e];if(!o||typeof o!="object")continue;const l=o.scrollX,i=o.scrollY;if(!(!Number.isFinite(l)||!Number.isFinite(i))){if(e==="window")window.scrollTo({top:i,left:l,behavior:t.behavior});else if(e){let n;try{n=document.querySelector(e)}catch{continue}n&&(n.scrollLeft=l,n.scrollTop=i)}}}return}const a=window.location.hash.split("#",2)[1];if(a){const e=window.history.state?.__hashScrollIntoViewOptions??!0;if(e){const o=document.getElementById(a);o&&o.scrollIntoView(e)}return}window.scrollTo({top:0,left:0,behavior:t.behavior})})({"storageKey":"tsr-scroll-restoration-v1_3","shouldScrollRestoration":true});document.currentScript.remove()</script>
101<!--/$-->
101<script class="$tsr" id="$tsr-stream-barrier">(self.$R=self.$R||{})["tsr"]=[];self.$_TSR={h(){this.hydrated=!0,this.c()},e(){this.streamEnded=!0,this.c()},c(){this.hydrated&&this.streamEnded&&(delete self.$_TSR,delete self.$R.tsr)},p(e){this.initialized?e():this.buffer.push(e)},buffer:[]};$_TSR.router=($R=>$R[0]={manifest:$R[1]={routes:$R[2]={__root__:$R[3]={preloads:$R[4]=["/assets/index-DYOZkI1T.js","/assets/chunk--c01j_DQ.js","/assets/ClientOnly-GukezuWP.js","/assets/link-CH4xpYBE.js","/assets/matchContext-BGKmh-E3.js","/assets/useStore-BSaljYDy.js","/assets/react-dom-BgfaE1k6.js","/assets/jsx-runtime-DxoCn-kY.js"],assets:$R[5]=[$R[6]={tag:"script",attrs:$R[7]={type:"module",async:!0},children:"import(\"/assets/index-DYOZkI1T.js\")"}]},"/strategy":$R[8]={preloads:$R[9]=["/assets/strategy-COrdjTP3.js","/assets/site-shell-VLmgk5dE.js","/assets/copy-button-B3yD9nno.js"]}}},matches:$R[10]=[$R[11]={i:"__root__�",u:1790998748912,s:"success",ssr:!0},$R[12]={i:"�strategy�strategy",u:1790998748912,s:"success",ssr:!0}],lastMatchId:"�strategy�strategy"})($R["tsr"]);$_TSR.e();document.currentScript.remove()</script>
101<script type="module" async="">import("/assets/index-DYOZkI1T.js")</script>
101</body></html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.