This is Nouns Builder front-end website and subgraph mono-repo. You can find Nouns Builder deployed on:
For an introduction to Nouns Builder and its concept, you can find further documentation here You can also find the nouns protocol code here.
apps
web
: Nouns Builder front-endsubgraph
: Nouns Builder subgraph
packages
blocklist
: Package to check for sanctioned wallet addressesanalytics
: Shareable analytics packagezord
: Shareable ui componentseslint-config-custom
:eslint
configurations (includeseslint-config-next
andeslint-config-prettier
)tsconfig
:tsconfig.json
s used throughout the monorepoipfs-service
: api for image uploads to ipfs
This monorepo contains a comprehensive set of packages under the @buildeross
namespace, designed to support Web3 application development:
- Modern design system and component library with Vanilla Extract
- Type-safe styling, theming support, and accessibility features
- The main UI foundation for BuilderOSS applications
- Comprehensive SDK for blockchain and GraphQL interactions
- Contract ABIs, subgraph queries, and EAS (Ethereum Attestation Service) integration
- Generated TypeScript types for type-safe API interactions
- Collection of React hooks for Web3 and UI functionality
- Includes hooks for NFT data, token balances, voting, and more
- Reusable logic across different applications
- Shared utility functions for Web3 development
- Helpers for ENS, blockchain data parsing, and Wagmi integration
- Form validation schemas with Yup
- Centralized configuration and constants
- Chain configurations, API endpoints, and application settings
- Shared across all applications in the ecosystem
- Shared TypeScript type definitions
- Chain types, proposal states, and common interfaces
- Ensures type consistency across the monorepo
- Analytics integrations for Google Analytics, Segment, and Vercel
- Consistent tracking across BuilderOSS applications
- Blockchain address blocklist functionality
- OFAC sanctions list integration for compliance
- IPFS integration for decentralized file storage
- Image upload utilities and gateway management
@buildeross/eslint-config-custom
- Shared ESLint configuration with Next.js and Prettier integration
- TypeScript configurations for different project types
- Base, Next.js, and React library configurations
All packages are published to npm and can be installed individually:
# Core libraries
npm install @buildeross/zord
npm install @buildeross/sdk
npm install @buildeross/hooks
# Utilities & configuration
npm install @buildeross/utils
npm install @buildeross/constants
npm install @buildeross/types
# Specialized services
npm install @buildeross/analytics
npm install @buildeross/blocklist
npm install @buildeross/ipfs-service
# Development tools
npm install @buildeross/eslint-config-custom
npm install @buildeross/tsconfig
-
Clone this repo locally
-
Add the required environment variables
-
Install dependencies across all apps and packages
pnpm i
- Once environment variables are defined, you can run the app in dev mode
pnpm dev
Note: linting and prettier formatting are automatically run on pre-push hooks
To lint:
pnpm run lint
To format:
pnpm run format
To run type checks:
pnpm run type-check
> pnpm run build
> pnpm run start
This app has several third party api keys that you need in order to run Builder:
- Tenderly as the main rpc node provider and transaction simulator
- Etherscan to dynamically fetch abis
- Alchemy for NFT metadata and balances
- Redis for caching layer
We ask that you supply your own secrets locally for running in development environment. Non-secret environment variables are already included in the .env
files in this repo.
Add the following variables to .env.local
within this root directory (needed to run tests against a local anvil node):
ANVIL_FORK_URL=$RPC_URL
ANVIL_BLOCK_NUMBER=8305745
Add the following variables to apps/web/.env.local
:
# tenderly RPC
NEXT_PUBLIC_TENDERLY_RPC_KEY=<TENDERLY_API_KEY>
# tenderly simulator env variables
TENDERLY_ACCESS_KEY=<API_KEY>
TENDERLY_PROJECT=<PROJECT_NAME>
TENDERLY_USER=<ACCOUNT_NAME>
# etherscan
ETHERSCAN_API_KEY=<ETHERSCAN_API_KEY>
# alchemy for NFT/token data
NEXT_PUBLIC_ALCHEMY_API_KEY=<ALCHEMY_API_KEY>
# redis for caching
REDIS_URL=<REDIS_URL>
Note: to run tests you need to install anvil.
Once anvil is installed, you can now locally run anvil (from the root directory in the monorepo) in a separate terminal session to start a local ethereum node:
pnpm run anvil
Now you can run the tests in a separate terminal session:
pnpm run test
You can also run the tests in watchmode, which will react to any source code or test files changing. To do that, run:
pnpm run test:watch
The Nouns Builder client is deployed on Vercel. Any pull requests will trigger a new preview deployment providing you with an environment to test out and preview changes.
The Nouns Builder subgraph is deployed for the following networks:
Please refer to our contributions guideline on how best to contribute.
Feel free to reach out to us via Discord