This project template gives you everything you need to build a Web3 application on the Internet Computer.
For an example of a real-world dapp built using this template, check out the source code for DFINITY's Developer Experience Feedback Board.
Make sure that Node.js >= 16.x
and dfx
>= 0.12.x
are installed on your system.
Run the following commands in a new, empty project directory:
npx degit krpeacock/vite-react-motoko # Download this starter project
dfx start --clean --background # Run dfx in the background
npm run setup # Install packages, deploy canisters, and generate type bindings
npm start # Start the development server
When ready, run dfx deploy
to build and deploy your application.
- Vite: high-performance tooling for front-end web development
- React: a component-based UI library
- TypeScript: JavaScript extended with syntax for types
- Sass: an extended syntax for CSS stylesheets
- Prettier: code formatting for a wide range of supported languages
- Motoko: a safe and simple programming language for the Internet Computer
- mo-dev: a live reload development server for Motoko
- MOPS: an on-chain community package manager for Motoko
- Vite developer docs
- React quick start guide
- Internet Computer docs
- Motoko developer docs
- MOPS usage instructions
dfx.json
reference schema
- Customize your project's code style by editing the
.prettierrc
file and then runningnpm run format
. - Reduce the latency of update calls by passing the
--emulator
flag todfx start
. - Install a Motoko package by running
npx ic-mops add <package-name>
. Here is a list of available packages. - Split your frontend and backend console output by running
npm run frontend
andnpm run backend
in separate terminals.