CW3D Dapp Boilerplate For Netlify

This boilerplate is set up to be deployed on Netlify and you can directly deploy this project by clicking the button below:

Deploy to Netlify

Visit the Live Demo here

Resources

Please refer to CW3D's documentation and the following useful links for an in depth explanation of how to work with projects bootstrapped with CW3D:

  • Docs - Everything you need to know when using CW3D
  • GitHub - look at the extensive code example or start contributing
  • Website - Learn more about CW3D and add components to your project
  • Templates - Check out the pre-built project templates
  • Components Library - Add features directly to your project through components
  • Examples - See the components implemented in a real world dapp
  • Community - Meet other builders, get support, and give feedback!

Overview

This project serves as a boilerplate for creating decentralized applications (dApps) using Create Web3 Dapp. It is preconfigured to be deployed on Netlify, providing you with a seamless way to get your dApp up and running in no time.

This boilerplate is built using CW3D (Create Web3 Dapp), a powerful tool developed by Alchemy that allows developers to rapidly create and deploy dApps.

What's Included?

This boilerplate has everything you need to start building a dapp:

  • Next.js
  • Wagmi Hooks
  • Ethers.js
  • Rainbowkit
  • Alchemy SDK

Supported Chains

The project supports all the major EVM chains:

  • Ethereum
  • Polygon
  • Polygon zkEVM
  • Arbitrum
  • Optimism

Getting Started

Prerequisites

To get started with this boilerplate, you'll need to have the following software installed on your local machine:

Installation

  1. Clone the repository to your local machine:
    git clone https://github.com/alchemyplatform/netlify-alchemy-dapp-boilerplates.git
    
  2. Navigate to the project directory:
    cd netlify-alchemy-dapp-boilerplates
    
  3. Install the required dependencies:
    yarn install
    

Running the Project

  1. Start the local development server:
    yarn run dev
    
  2. Open your browser and navigate to http://localhost:3000/ to view the dApp in action.

Deploying to Netlify

This boilerplate is set up to be deployed on Netlify and you can directly deploy this project by clicking the button below:

Deploy to Netlify

If you prefer to deploy it manually, you can follow these steps:

  1. Sign up for a Netlify account at netlify.com if you don't already have one.
  2. Install the Netlify CLI:
    npm install -g netlify-cli
    
  3. Run the following command to deploy your dApp to Netlify:
    netlify deploy
    
  4. Follow the prompts and provide the required information. Your dApp will be deployed and accessible via a unique URL.

Project Structure

The boilerplate project is a Next.js application with the following structure:

📦root
 ┣ 📂components
 ┃ ┣ 📂navigation
 ┃ ┃ ┗ 📜navbar.jsx
 ┃ ┗ 📜InstructionsComponent.jsx
 ┣ 📂layout
 ┃ ┗ 📜mainLayout.jsx
 ┣ 📂pages
 ┃ ┣ 📜_app.js
 ┃ ┗ 📜index.jsx
 ┣ 📂public
 ┃ ┗ 📜cw3d-logo.png
 ┣ 📂styles
 ┃ ┣ 📜Home.module.css
 ┃ ┣ 📜InstructionsComponent.module.css
 ┃ ┣ 📜Navbar.module.css
 ┃ ┗ 📜globals.css
 ┣ 📜.gitignore
 ┣ 📜README.md
 ┣ 📜next.config.js
 ┣ 📜package-lock.json
 ┗ 📜package.json

Start editing the pages/index.jsx file to customize the project according to your own needs!