create-polkadot-dapp

create-polkadot-dapp

Create Polkadot DApp in one command:

npx create-polkadot-dapp@latest

Templates

• react-papi-tailwind:
  React front-end app with PAPI ReactiveDOT + dotconnect for chain and wallet interactions.
  Tailwind CSS + Tailwind UI.
  Vite for dev tooling.
• react-solidity-hardhat modern smart contract + react app template, with:
  • OpenZeppelin smart contract library.
  • hardhat smart contract development tooling.
  • wagmi for smart contract interaction.
  • Tailwind CSS + Tailwind UI.
  • Vite for dev tooling.
• react-solidity-remix (deprecated) a monorepo for smart contracts for AssetHub and a React, Tailwind CSS and ethers

Planned templates

• papi-nodejs: pure server-side application with polkadot-api

Development

How to spawn template from local copy

cd <path-to-create-polkadot-dapp>
yarn install && yarn build
cd <path-where-to-spawn-the-app>
npx --yes --package=<path-to-create-polkadot-dapp>/dist create-polkadot-dapp

Adding new template

Add sources to templates/ directory. These will be copied to target directory.
Add new configuration to src/templateConfigs/ and export it from index.ts. The exported name must match the directory name in templates/.

Note on .gitignore

yarn pack doesn't include .gitignore files into the package, even if manually included into files section in package.json.
To circumvent this, we're placing gitignore (without the dot) files in the templates instead, and renaming the files after spawning.

Back sync

It can be more convenient to develop template code outside of create-polkadot-dapp.
Use yarn back-sync --source <spawned_repo_path> --template <template_name> to sync files from a spawned repo back into the template.
back-sync uses .gitignore to filter out files that need syncing.