Table of Contents (ctrl-F to skip to section)
NFTs might be down, but they are not out
You CAN build your own NFT experience
Quick tips for vibecoding
Highlight how-to
Manifold how-to
How to use other smart contract providers
Ideas to inspire you
Let's mint something that matters
I think it's fair to say that we are in a bit of an NFT lull. Certainly no collectible to-date has commanded the eye-popping prices of pieces from collections like Bored Ape Yacht Club or Doodles at the peak of NFT mania in the early 2020s (save for maybe the Farcaster OGs).
But to me, it seems unfair to judge the token formats simply by the fact they don't generate millions of dollars of revenue in seconds. They still are a valuable and interesting packaging layer for digital rights, and can enable all kind of interesting experiences, some of which have yet to be built. I think of the onchain Patreon alternative Hypersub which revolves around NFTs and wonder what else could be enabled.
Farcaster gives creators a unique chance to sell NFTs directly in-feed, mintable in one click using the built-in wallet. Thanks to the built-in liquidity layer Farcaster provides, artists can connect with current and would-be patrons easily, opening up new opportunities for creators and collectors alike.
This can already be taken advantage of today, via some (definitely neglected) mini app experiences from some of the no-code NFT creation platforms. And I know that as artists and creators, we want to focus on what we do best—making amazing work—not wrestling with code. But the reality is that having your own customized minting experience can make a huge difference in how collectors engage with your drops.
Luckily, today this is easier than ever before. You don't need to hire an engineer—you can direct AI to be your engineer, plus test and deploy your custom minting mini-apps super cheaply!
Below, you'll fiind step-by-step instructions for doing this, using
either Highlight and Manifold provided smart contracts
AI assistance from the model of your choice for technical and design support
Easy testing and deployment on Replit
All mints in this tutorial were deployed on Base
When you do this, it costs nothing to you, but really helps me!
As someone who can't write most code straight from her fingers anymore, but can understand generally, what she's looking and what it does, my level of understanding is still not strong enough yet that I feel comfortable using fully agentic modes of development. I most often work by copying sections of code into AI chat windows, talking to the AI about it, and then copy/pasting it back into Replit, VSCode, et cetera.
This ensures I have command of my files still and am actively learning about code, how it works.
If I really don't understand what's going on in an open source repository that does something I want to also do, I will have Gemini go through every file and tell me what that file does. You can write a simple script to do this and execute it within Replit. You can also do this with single files and get line by line comments!
Make sure you are taking advantage of your endlessly patient pair programmer, who writes better docs than a human ever could or would and doesn't get mad when you ask the same question 5 times in a row.
Take the time to set up Github in your projects. You will appreciate the version control, I promise.
Make sure to read the Farcaster mini-app docs on deployment. This tutorial discusses adapting several different smart contract providers for a mini-app. All of the template mini apps are set up for deployment, but you'll have to update the Farcaster metadata in the files, as well as generate your own farcaster.json
to use.
While working with Replit, to test your mini app on Farcaster, copy THIS url while the server is running and paste it into a debugger like the Farcaster Preview Tool or the Frames.js Debugger.
Horsefacts.eth generously deployed a mini-app that will be the basis of all going forward.
This mini app template works out of the box with Highlight smart contracts, requiring only a few simple swaps to get up and running. You don't need to change much at all, because all mints on Highlight are minted via the same smart contract.
Change the vectorID in the config.ts
to your mint's vector ID. You can find this number on your mint's management page. (Optionally, add a referrer address so your mini app gets referral coin from your mints!)
Update the NFT metadata to match your own NFT's details. Make sure to match the price for 1 NFT exactly to what Highlight charges, INCLUDING fees. Try a test transaction out and see what amount pops up in your wallet, and then put that in, exactly.
Add in your mint image to the /public
folder, making sure the reference to the file in the metadata also changes as well.
Have fun adding any customizations you want! All of the components that control the front end are in /src/app/components
and are styled with Tailwind. You can dump an entire component file in to an AI and ask it to change whatever you want, and go from there!
I also experimented with using Manifold's widget technology in a mini-app.
Unlike the other examples here, you do not interact directly with your mint. Instead, Manifold provides a component that handles everything for you, from wallet connection to the confirmation dialogue.
It's very simple to set up, but you have very little control over display and function. There's no auto-connection to the Farcaster wallet. And because you are completing all operations passing through Manifold, it can be quite slow.
BUT! It works! And is an option for you. So here's how to do it.
Add the links to the Javascript and CSS files to the widget you want to use from Manifold into the <head>
of your page in index.html
. You'll see here I have both the Connect and Buy Button components here available.
In the app.tsx
, replace the entire <CollectButton>
component with the HTML provided by Manifold for the Buy Button. Replace the data-id
with the Instance number of your mint, from the mint management page.
then repeat steps 3 and 4 above!
Add in your mint image to the /public
folder, making sure the reference to the file in the metadata also changes as well. (The information in config.ts
becomes way less relevant in this example. You could remove most of that and just write in all the details you want, on the front end, if you so choose.)
Have fun adding any customizations you want! All of the components that control the front end are in /src/app/components
and are styled with Tailwind. You can dump an entire component file in to an AI and ask it to change whatever you want, and go from there! To style the Manifold provide Buy Button, right-click-Inspect-Element, copy the HTML for the button out of the page, and then ask AI to style it using the classes provided in that HTML.
Highlight and Manifold are not the only smart contract providers available for artists who don't want to write their own.
When modifying Horsefacts' original example for other smart contracts, the files you'll want to focus on to adapt that repository for other providers are:
src/config.ts
src/components/app/collectButton.tsx
Those 2 files control the entirety of the "web3" logic within the application. All other files are just window dressing that make your app look cool and allow the end user to have a great experience. You can drop those 2 files in their entirety into an AI, along with the docs you're working with, and start to adapt the files.
Scatter.art (recently used for Based Dickbutts and Based Interns collections, the mini app is open source)
Creating and deploying your own smart contract! (In the process of doing this tutorial, I experimented with this option, and found it easier than I expected. Perhaps the start of another tutorial).
Wrap your entire application in a wrapper that detects if the app is being loaded in a Farcaster mini app or not. Bam! You can now display minting and crypto stuff only to people with wallets, and create "normie friendly" experiences for everyone else. Make a Quote of the Day app but only allow Farcaster users to mint it.
Offer a free mint if the user provides his or her email address, allowing you to build your audience in a way that exists outside of Farcaster.
Bring back the time-released metadata of the NFT boom and turn a metadata reveal into a social event (the creative hook here is on you!).
We’re past the gold-rush stage when a NFT could raise millions overnight—and that’s good . The quieter market gives builders room to experiment without noise and beating back scammers. With free AI copilots, one-click contract deployments, and Farcaster’s fully integrated wallets, you can launch a completely custom minting experience in a weekend or less.
At the end of the day, an NFT is just a wrapper. What you wrap—art, access, memories, patronage, gameplay—is up to you. So spin up a Replit workspace, remix a mini-app, and let the AI handle the boilerplate while you focus on the fun stuff. 🥰
This is brilliant! Thank you keccers - minted for later, looking forward to working through it.
I wrote up step-by-step instructions on ✨ how to put your own @highlight mint into this mini-app (works out of the box!) ✨ how to use this repl with @manifoldxyz (example below, it's not great, but you can do it!) ✨ what files to look at if you want to adapt this repl for other smart contracts ✨ vibecoding tips & tricks Building is for everyone now, not just the purely technical. Go get it! https://paragraph.com/@keccers/making-your-own-farcaster-mini-app-as-an-artist
Here's what a mini-app with @manifoldxyz widgets looks like. Does it work — YES. DOES IT WORK WELL? NO! I don't recommend this approach, but wanted to show you how to do it because of the popularity of the service. https://moo-token.replit.app/
Queen of not gatekeeping knowledge
I bet you could get this to use the Manifold contracts directly too (instead of their component). Will look when I get some time. We could extend the original example with “mint strategies” for different platforms .
Dude, if you find out where, let me know. I would love for this to be true cc @priyanka I went digging everywhere and it didn't seem like they exposed those in a way that would work here. The mint functions exposed in the creator core are callable by owner only — I couldn't see how that could work https://docs.manifold.xyz/manifold-for-developers/smart-contracts/manifold-creator/contracts/creator-core/erc721-functions
I ran out of time too cause I wanted to shove this out before talking with you later today. Thirdweb and Scatter.art would be great extension candidates!
ohhhh 👀 i just started working on remixing your mini app last night, but i shall put that on hold until @horsefacts.eth can look into this. not having to ask people to connect wallets would be AWESOME
NFTs may be in a lull, but there's still potential for creators to thrive with tools like Farcaster. Learn to craft your own NFT minting experience through AI and simple coding in @keccers.eth's latest blog post, featuring no-code tips, smart contract insights, and creative inspiration. Let's mint meaningful moments!