svelte-tailwind-box Svelte Themes

Svelte Tailwind Box

Truffle box with svelte, tailwind, and rollup

Svelte Truffle Box

A Truffle box using SvelteJS, TailwindCSS, and Rollup.

This box contains everything you need to start building a DApp. However, you may want to replace the svelte-web3 package due to unknown maintenance status (See Web3).

Truffle Box

A truffle box is a seed project for building a truffle DApp.

Setting up

  1. Install truffle and an ethereum client. For local development, try Ethereum TestRPC.

    npm install -g truffle
    
  2. Download box.

    truffle unbox maxwellfortney/svelte-tailwind-box
    
  3. Run an Ethereum RPC. For simplicity and development we will be using Ganache.

  4. Compile and migrate the contracts after authenticating your account on the blockchain (i.e. restoring from seed in MetaMask).

    truffle compile
    truffle migrate
    

You're ready to go!

Usage

Truffle and Svelte files are in their usual place according to the docs

Ensure your Ethereum testnet is running, then deploy your contracts:

truffle deploy

Log in to metamask by importing any of the Ganache Wallet's private keys. Then, run the dev task to have the code updated in realtime as you develop:

truffle compile
npm run dev

Publishing

To produce your production dApp, run the build task:

npm run build

This will publish your completed DApp to the folder ./public/build

Testing

Be sure you've compiled your contracts before running the tests, or you'll get file not found errors.

truffle test

Releasing

To build the application for production, use the build command. A production build will be in the ./dist folder.

npm run build

Web3

This project is comes with svelte-web3, however I'm unsure of the maintainability of the package. If anyone would like to implement a better Web3 implementation please feel free to submit a PR!

Contributions

Feel free to submit a PR, or an issue, and I will try my best to address it.

Credits

Inspiration, images, and most of the readme is from here svelte-box

Basic svelte project svelte-template

Top categories

Loading Svelte Themes