The fastest way to get started with a fully-fledged web3 frontend

Overview

create-web3-frontend

The fastest way to get started with a fully-fledged web3 frontend setup consisting of Next.js, wagmi and Tailwind CSS.

npx create-web3-frontend my-app

# For TypeScript
npx create-web3-frontend --ts my-app

Available options

  1. --ts or --typescript: Use TypeScript instead of JavaScript.
  2. --use-npm: Use npm for installing dependencies.
  3. --use-pnpm: Use pnpm for installing dependencies.

Thanks

This project is inspired by and re-uses a lot of code from create-next-app.

You might also like...

TechSquad Community is what you need to get started in Coding and Development

 TechSquad Community is what you need to get started in Coding and Development

TechSquad Community is what you need to get started in Coding and Development This is a Community website under development. This community aims to cr

Dec 16, 2022

This SDK helps developers get started with the on-chain tools provided by Metaplex.

This SDK helps developers get started with the on-chain tools provided by Metaplex.

Metaplex JavaScript SDK ⛔️ DO NOT USE IN PRODUCTION, THIS SDK IS IN VERY EARLY ALPHA STAGES! This SDK helps developers get started with the on-chain t

Dec 27, 2022

Minimal template to get started with Foundry + Hardhat

Hardhat x Foundry Template Template repository for getting started quickly with Hardhat and Foundry in one project Getting Started Use Foundry: forge

Jan 3, 2023

Get started with AI vision at the edge with no coding experience at all!

Get started with AI vision at the edge with no coding experience at all!

No-Code Edge AI Vision with Node-RED Now you can get started with AI vision at the edge in just THREE STEPS with no coding experience at all! Prerequi

Dec 5, 2022

Get started with GatsbyJS straight away without having to spend a whole day configuring your usual addons.

Get started with GatsbyJS straight away without having to spend a whole day configuring your usual addons.

Gatsby Starter Infinite Get started with GatsbyJS straight away without having to spend a whole day configuring your usual addons. This starter includ

Jun 27, 2022

🏄‍♂️ A node.js template to quickly get started building

hacky-node-template 🏄‍♂️ A type-safe Node.js template to quickly get started building. Tech-stack Express.js - Fast, un-opinionated, minimalist web f

Jan 4, 2023

A great place for platforms to get started on Cloudflare Workers!

Workers for Platforms Example Project Blog post Docs For SaaS companies, it's challenging to keep up with the never ending requests for customizations

Dec 23, 2022

An NPM package to help you get started with modern javascript tooling easier & faster

MODERNIZE.JS Creating config files for webpack and babel can be an hell of stress, this NPM package helps you get started with writing code as soon as

Sep 22, 2022

CloudCrafter CLI is a command-line interface tool that provides templates for common cloud resources to help you get started quickly.

CloudCrafter CLI CloudCrafter CLI is a command-line interface tool that provides templates for common cloud resources to help you get started quickly.

May 5, 2023
Comments
  • Development server fails due to wagmi config issue

    Development server fails due to wagmi config issue

    Issue

    Screenshot 2022-06-18 at 2 02 18 PM

    Steps to reproduce

    1. npx create-web3-frontend my-app
    2. cd my-app
    3. yarn dev

    Cause of issue

    This can happen while upgrading wagmi from 0.3 to 0.4. More reference can be found here

    opened by rajkharvar 2
  • Add support for absolute imports

    Add support for absolute imports

        "baseUrl": ".",
        "paths": {
          "@/*": ["*"]
        }
    

    ^ Adding this to the Typescript template's tsconfig.json will let you do import from '@/components instead of import from '../../components

    enhancement 
    opened by Dhaiwat10 0
Releases(v1.3.0)
  • v1.3.0(Aug 8, 2022)

    What's Changed

    • chore: Update wagmi to 0.6.1 and rainbowkit to 0.4.5 by @Dhaiwat10 in https://github.com/Dhaiwat10/create-web3-frontend/pull/17

    Full Changelog: https://github.com/Dhaiwat10/create-web3-frontend/compare/v1.2.0...v1.3.0

    Source code(tar.gz)
    Source code(zip)
  • v1.2.0(Jun 18, 2022)

  • v1.0.0(Apr 30, 2022)

  • v0.2.1(Apr 7, 2022)

    TLDR: wagmi is not compatible with React 18 yet so we have to use React 17 for now. The React version was not explicitly specified by the code before so stuff was breaking.

    What's Changed

    • fix: Specify React version as 17 by @Dhaiwat10 in https://github.com/Dhaiwat10/create-web3-frontend/pull/6

    Full Changelog: https://github.com/Dhaiwat10/create-web3-frontend/compare/v0.2.0...v0.2.1

    Source code(tar.gz)
    Source code(zip)
  • v0.2.0(Mar 26, 2022)

    What's Changed

    • Add support for absolute imports in the TS template by @Dhaiwat10 in https://github.com/Dhaiwat10/create-web3-frontend/pull/4

    Full Changelog: https://github.com/Dhaiwat10/create-web3-frontend/compare/v0.1.2...v0.2.0

    Source code(tar.gz)
    Source code(zip)
Owner
Dhaiwat Pandya
Software engineer. Building UIs & devtools for web3. Open Sourcer by heart.
Dhaiwat Pandya
A fully-fledged Hardhat project template based on TypeScript.

Fully-Fledged Hardhat Project Template Based on TypeScript Installation It is recommended to install Yarn through the npm package manager, which comes

Pascal Marco Caversaccio 75 Dec 21, 2022
🟢 Music player app with a modern homepage, fully-fledged music player, search, lyrics, song exploration features, search, popular music around you, worldwide top charts, and much more.

Music-player-app see the project here. 1. Key Features 2. Technologies I've used Key Features: ?? Fully responsive clean UI. ?? Entirely mobile respo

suraj ✨ 3 Nov 16, 2022
Fastest way to get financial data from Plaid into your Postgres database. Go from zero to live in 5 minutes without a single line of code.

Venice Venice is a the fastest way to get financial data from Plaid into your Postgres database. Zero to production in 5 minutes without a single line

Venice 93 Dec 12, 2022
A full fledged social media app for foodies :)

Foodzo Site is deployed on netlify : https://fooodzo.netlify.app/ and Server is deployed on heroku. This website is basically a social media for all t

Raunak Agarwal 12 Oct 1, 2022
The Omnibookmarks browser extension is the fastest way to open bookmarks

★ Omnibookmarks The Omnibookmarks browser extension is the fastest way to open bookmarks. Just type a keyword into the address bar to quickly open or

Nate Hill 16 Aug 20, 2022
An efficient (and the fastest!) way to search the web privately using Brave Search Engine

Brave Search An efficient (and the fastest) way to search the web privately using Brave Search Engine. Not affiliated with Brave Search. Tested on Chr

Jishan Shaikh 7 Jun 2, 2022
The fastest way ⚡️ to create sitemap in your Deno Fresh project 🍋

Fresh SEO ??     Quickly creating sitemaps for your Deno Fresh project. Getting Started Run the setup at the root of your project. deno run

Steven Yung 34 Dec 19, 2022
Functions Recipes is a library of examples to help you getting started with Salesforce Functions and get used to their main features.

Functions Recipes Introduction Salesforce Functions lets you use the Salesforce Platform for building event-driven, elastically scalable apps and expe

Trailhead Apps 172 Dec 29, 2022
Get started on Remix with TypeScript and Tailwind CSS in seconds

remix-typescript-tailwind-quickstart Get started on Remix with TypeScript and Tailwind CSS in seconds. This is an example setup of Remix building on t

Resi Respati 12 Mar 16, 2022
A simple template to get started with a non-profit website.

Next.js Non-Profit Website A non-profit website template powered by the Cosmic headless CMS. Uses Next.js, Tailwind CSS, and Stripe for donation payme

Cosmic 5 Sep 6, 2022