sui-dapp-starter

Sui dApp Starter - Full-Stack Sui Starter on Steroids

Won the 1st place in the Randomness category of the Sui Overflow 2024 hackathon

Motivation

Most of the Sui starters I found were either very basic or aimed for developing frontend-only apps. Thanks to my experience with various full-stack starters and templates, I knew how to do better, so I started this template with the goal of providing all basic tools and components for you to focus on your business logic from day one and not spend weeks on creating your app skeleton. // @kkomelin

Features

• Suibase: Painless work with the networks
• Local Sui Explorer: Browse your transactions and objects locally
• pnpm: More efficient package management for monorepos
• TypeScript: Less error-prone JavaScript
• React: Good old React for truly decentralized apps
• Tailwind CSS: Utility-first CSS for more efficient styling
• Vite + SWC: Faster app bundling and optimizing
• Radix UI: Accessible React components to prototype quicker
• Sui dApp Kit: All you need to work with Sui network on frontend
• Components and Hooks: useTransact, useNetworkType, NetworkType, useBalance, Balance, useFaucet, Faucet and more
• Frontend Deployment: Firebase, Walrus Sites, Arweave
• One-liner Install: Just pnpm create sui-dapp@latest
• Demo app: Illustrates the use of Sui On-Chain Randomness and Sui Object Display (NFT)

Prerequisites

Before you begin, install the following:

• Sui prerequisites (Sui prerequisites only)
• Suibase
• Node (>= 20)
• pnpm (>= 9)

Installation

Use this template ->

or

pnpm create sui-dapp@latest

Usage

1. Run the local Sui network:

pnpm localnet:start

Local Sui Explorer will be available on localhost:9001

2. Deploy the demo contract to the local network:

pnpm localnet:deploy

If you're having dependency version mismatch issues, try to update the localnet pnpm localnet:update or use pnpm localnet:deploy:no-dependency-check" instead of the regular deployment command.

3. Switch to the local network in your browser wallet settings.

4. Fund your localnet account/address:

You have a few options here:

a) Use the Faucet button integrated into your wallet (e.g. Sui Wallet).

b) Copy the localnet address from your wallet and run the following in your console:

pnpm localnet:faucet 0xYOURADDRESS

c) Run the app and use the Faucet button in the footer.

5. Run the app:

pnpm start

Find all commands in package.json

Test

Backend

pnpm test

Troubleshoot

Troubleshooting guide

Documentation

Project Documentation

Roadmap

Improvement Ideas

Community

Discord

Links

• Sui: Developers: Docs, tools and courses
• Sui: Code Conventions
• Move Book
• Suibase Docs
• @mysten/create-dapp - official starter

License & Copyright

Copyright (c) 2024 Konstantin Komelin and other contributors

Code licensed under the MIT License: http://opensource.org/licenses/MIT

SVG Graphics used for NFTs is licensed under CC-BY 4.0: https://creativecommons.org/licenses/by/4.0/