buidlguidl / batch4.buidlguidl.com Goto Github PK

Goal

Create a PR with your personal page so it's displayed on the Batch site.

Creating the Batch page

1. If you haven't done it already: fork & clone the repo, install dependencies, and create your own branch.
2. Create a new folder & file in packages/nextjs/app/builders/[your-0xAddress]/page.tsx
3. You can have a little bio, avatar, address, links to your socials, etc.
   -> Keep it simple! (no heavy assets, etc.)

⚠️ Important Notes:

• Pay special attention to linting, code format, etc.
• Be creative! Don't just copy what other builders and doing.
• Inspecting how other SE-2 components/pages are created is a great way to learn.
• Make sure to read the README file for more guidance.

⚠️ If you are the first one to create your personal page, you'll need to create the builders folder in packages/nextjs/app/.

Goal

There is a "To Be implemented" string in packages/nextjs/app/page.tsx that should show the number of builders that have checked in to the contract.

We want to show the real count (reading from the BatchRegistry contract)

For more info about the contract: #9

🏰 BuidlGuidl 📝 Grant Application

Once all the Batch issues have been fixed, BuidlGuidl wants to fund your next night and weekend build with 0.25 ETH.

Think of it like a mini hackathon! ⛵️ Build something that you learn from, can possibly teach others, doesn't necessarily have to be a product or a big thing!

Don't stress about inventing something new; feel free to take an existing idea and add your unique touch to it. The key is, it should be something you can complete over a weekend.

🧾 What to Do:

• Submit Your Idea: Head over to our BG grants to submit an application: https://grants.buidlguidl.com/

🕵️‍♀️ We’ll look into the ideas and help you refine the project to build if needed. It might take some back & forth on the proposal! We'll sent you 50% on grant approval, and 50% at the end when the build is submitted.

👉 Form Deadline: Make sure to fill out the form and submit your idea by April 21th
👉 Project Due Date: Once approved, you have 2 weeks to submit your build

Project Submission Requirements:

• 2-3 Minute Video: Each project must include a short video (2-3 minutes) showcasing what you’ve built.
• Good README: Make sure your project repository has a well-documented README.

Looking forward to seeing your awesome projects!

Goal

When a user connects to the dApp, let's display 2 things:

1. Is the connected address a member of the batch? (is the in the allowList)
2. Is the connected address already checked in?

Feel free to place that info whenever you want. It could be just some icons that show next to the wallet for members.

For more info about the contract: Check-in with the BatchRegistry contract

Description
Goal is to create a multiframe where:

1. Frame1 -- showcases current batch image and has 2 buttons
   1. Button1: External link to buidlguidl
   2. Button2: Nextjs api call to render the next frame
2. Frame2 -- showcase stats of the current batch -- no of builders, PRs, new users onboarded etc.
   This will have external link to the builders page of the current batch

Eng work:

1. create apis for rendering farcaster frames -- this would involve creation of functions that aggregate stats and display it in an html and gets converted to an image using vercel's og-image-generation.
2. Add button 2 to the metadata for the initial frame for the api call

^^ feel free to add more ideas here.

Show the current members of your batch in the app.

• Show it on the main page or create a page (/builders) listing all the builders registered in the BatchRegistry contract
• Each builder should link to their personal profile

Goal

Discuss with your peers what you would like the homepage to show! It can be a good opportunity to tweak the app colors/layout etc.

As in pervious issue, keep it simple (no big images, external assets, etc)

This can be an ongoing issue while you all keep implementing things.

Goal

Update your batch's mainpage.

• Create a random logo (or use Dall-E!) to generate a batch logo
• title: Batch #{batch_number}
• subtitle: Whatever you feel appropriate :)

Goal

Check-in into the BatchRegistry contract.

💡 This issue doesn't require you to raise a PR, just get yourself checked-in. Create a local branch to work on this.

BatchRegistry contract

The BatchRegistry contract is deployed on Optimism.

• Check it out on Etherscan
• Check it out on abi.ninja

You can find the contract code in packages/hardhat/contracts/BatchRegistry.sol. It's also available in the externalContracts.ts file in packages/nextjs/contracts/ (for front-end use in future issues).

You can see/interact with the contract on the Debug page of SE-2: Clone this repo, run yarn install and yarn start and go to http://localhost:3000/debug.

💡 You can check if you wallet address is in the allowList ;)

Checking-in

There are many ways to check-in into the Contract. Here we'll use the Scaffold-ETH 2 way ™.

1. Create your own branch

Before you begin, make sure you're working on a separate branch. Here's how:

1. Clone the repo to your local machine (If you haven't already)
2. Navigate to the cloned directory in your terminal.
3. Create a new branch using git checkout -b [your-branch-name]

2. Spin up Your Local SE-2

Set up your local environment:

1. Run yarn install (install dependencies)
2. Run yarn start (starts SE2 front-end)
3. Go to http://localhost:3000/. You should see SE-2 app.

💡 You'll notice that the dApp points to the Optimism chain. Check the scaffold.config.ts file to see how it's configured.

3. Understand the checkIn function

Go the the BatchRegistry.sol contract and check the checkIn function. You'll see that in order to check in, 3 things are required:

1. The Batch is open (should be open already :D)
2. Your EOA address is on the allowed list (ping us if you are not on the list)
3. To be able to call the functions, they must be called from a contract (not an EOA!)

So you'll need to deploy a contract that calls the checkIn function on the BatchRegistry contract.

4. Set up the local environment

Instead of deploying a contract on Optimism, we'll deploy it locally so we can test.

1. Start your local hardhat node: yarn chain
2. Deploy the BatchRegistry contract: yarn deploy
   a. Check packages/hardhat/deploy/00_deploy_your_contract.ts
3. Change the dApp chain to hardhat in scaffold.config.ts (targetNetwork should be chain.hardhat)
4. Start the front-end if you haven't already: yarn start

If you go to the Debug page, you should see the BatchRegistry contract (but this time is deployed locally!)

💡 You'll need to tweak the deploy script to make yourself the owner of the BatchRegistry contract (so you can update the allowList, etc.)

5. Deploy a contract that calls the checkIn function

Now it's time to create a contract that calls the checkIn function. E.g.

1. Create a CheckIn.sol contract in packages/hardhat/contracts/
2. Declare an interface for the BatchRegistry contract (More info here: Interfaces in Solidity By Example)
3. The constructor should receive the address of the BatchRegistry contract
4. Implement a function in your contract that calls the checkIn BatchRegistry function.
5. (Optional) You can implement an owner pattern to avoid other people calling the function in your contract ;)
6. Tweak the 00_deploy_your_contract.ts script to deploy your contract (and pass the address of the BatchRegistry contract)

Test it!

6. Check-in live

Once you have tested that your contract works, it's time to deploy it to Optimism and check-in live!

😯 We're dealing with real money now that we're deploying to Optimism! You should have some oEth from your onboarding process. And don't worry, the Optimism chain is much less expensive to deploy on than mainnet.

1. Create a deployer account to deploy your contract (yarn generate)
2. Send some Optimism ETH to it
3. Check your account balances (yarn account)
4. Tweak the 00_deploy_your_contract.ts script to only deploy your contract to Optimism (you don't want to deploy the BatchRegistry contract, which is already deployed by us!)
5. Deploy your contract to Optimism (yarn deploy --network optimism)
6. Change the dApp chain to Optimism in scaffold.config.ts
7. Go to the Debug page and check that your contract is there
8. Call the checkMeIn function!

✅ You should be checked-in! (You can check it by calling the yourContractAddress function)

In future issues, we'll be showing this info on the UI.