Create A Whitelisting Application

Many projects, whether for an NFT mint or a token airdrop, employ whitelisting of approved wallet addresses. In this guide, we will create an application that whitelists connected wallets.

The Smart Contract

To start, clone the following repository from GitHub and rename it to 'whitelist-app':

git clone https://github.com/projectbuidlonbase/buidl-on-base-starter
mv buidl-on-base-starter whitelist-app

Navigate to the 'hardhat' subdirectory and initialize a Node.js project. Then, install Hardhat:

cd whitelist-app/hardhat
npm init --yes
npm install --save-dev hardhat

Set up a new Hardhat project:

npx hardhat

When prompted, select 'Create a JavaScript project' and accept the default settings.

Open the project directory with your code editor, navigate to the 'contracts' folder, and delete the 'Lock.sol' file. Create a new file named 'Whitelist.sol' and add the following code:

// SPDX-License-Identifier: Unlicense
pragma solidity ^0.8.0;

contract Whitelist {
    uint8 public maxWhitelistedAddresses;
    mapping(address => bool) public whitelistedAddresses;
    uint8 public numAddressesWhitelisted;

    constructor(uint8 _maxWhitelistedAddresses) {
        maxWhitelistedAddresses =  _maxWhitelistedAddresses;
    }

    function addAddressToWhitelist() public {
        require(!whitelistedAddresses[msg.sender], "Sender has already been whitelisted");
        require(numAddressesWhitelisted < maxWhitelistedAddresses, "More addresses can't be added, limit reached");
        whitelistedAddresses[msg.sender] = true;
        numAddressesWhitelisted += 1;
    }
}

Before deploying the contract, install the 'dotenv' package to handle environment variables:

npm install dotenv

Create a '.env' file in the 'hardhat' folder and add your deployer's private key:

WALLET_KEY=YOUR_DEPLOYER_PRIVATE_KEY

Replace 'YOUR_DEPLOYER_PRIVATE_KEY' with the actual private key from the wallet address you are using to deploy the contract. Ensure that the wallet has Base Sepolia ETH to deploy the contract. Please be extremely careful with your private key; it's advised to use a development wallet for this purpose.

Create a 'scripts' folder in the 'hardhat' directory and add a 'deploy.js' file with the following content:

const hre = require("hardhat");

async function main() {
  const whitelistContract = await hre.ethers.deployContract("Whitelist", [10]);
  await whitelistContract.waitForDeployment();
  console.log("Whitelist Contract deployed to:", whitelistContract.target);
}

main().catch((error) => {
  console.error(error);
  process.exitCode = 1;
});

This script deploys the 'Whitelist' contract with a maximum of 10 whitelisted addresses.

Deploying the Contract

To deploy the contract, add the Base Sepolia network configuration to 'hardhat.config.js':

require("@nomicfoundation/hardhat-toolbox");
require("dotenv").config();

const WALLET_KEY = process.env.WALLET_KEY;

module.exports = {
  solidity: "0.8.0",
  networks: {
    baseSepolia: {
      url: "https://sepolia.base.org",
      accounts: [WALLET_KEY],
    },
  },
};

Run the deployment script:

npx hardhat run scripts/deploy.js --network baseSepolia

After deployment, the console will log the address of the deployed contract.

Frontend Integration

Navigate to the 'web' subdirectory and install the necessary dependencies: