create-permaweb-app

A boilerplate for creating projects ready to deploy to the Permaweb.

Quick Start Notes

1. To start install

npx create-permaweb-app APP_NAME

2. Run yarn or npm install to install all the dependencies
3. Once installation is complete, cd into your app's directory
4. Run yarn dev or npm run dev to start your dev environment

Technologies

This project is built with the following open source libraries, frameworks and languages. User choice of framework used, available in plain js or typescript.

| Tech | Description | | --------------------------------------------- | ------------------------------------------------------------------ | | ------ | ------ React Frontend Environment ------ | | Next JS | React Framework | | Vite JS | Next Generation Frontend Tooling | | Svelte | Next Generation Frontend Tooling | | ------ | ------ CSS Framework ------ | | none | Plain CSS | | Tailwind | A utility-first CSS framework | | Chakra | A simple, modular and accessible component library that gives you the building blocks you need to build your React applications. | | ------ | ------ Arweave Dependencies ------ | | Arkb | Arweave deployment tool. | | Bundlr | Scaling data layer for Arweave |

Deploy to Arweave

A funded Arweave wallet is a requirement to deploying applications using create-permaweb-app.

Drag and drop the wallet.json into the projects root directory. Ensure it is named wallet.json and detected by the .gitignore file.

** IMPORTANT - KEEP YOUR KEYS SAFE. DO NOT PUSH wallet.json TO GITHUB ** fundBundlr Funds the Bundlr node using the specified wallet and amount in AR.

Usage:
  npm run fundBundlr $AMOUNT
  yarn fundBundlr $AMOUNT

Options:
  $AMOUNT                Specify the amount, in AR, to fund the Bundlr node

Description:
  The 'fundBundlr' command is used to fund the Bundlr network by transferring a specified amount from the wallet file to the Bundlr node.

Example:
  npm run fundBundlr 0.1
  yarn fundBundlr 0.1

NOTE: Funds may take up to 30 minutes to become available to the specified node.

balance Checks balance of specified Bundlr node

Usage:
  npm run balance
  yarn balance

Description:
  The 'balance' command is used to check the balance of the Bundlr node.

Example:
  npm run balance
  yarn balance

deploy Generates static site and deploys it to Arweave

Usage:
  npm run deploy
  yarn deploy

Description:
  The 'deploy' command is used to statically generate an application and deploy it to Arweave. It returns the transaction ID pointing to your deployed application. 

Example:
  npm run deploy
  yarn deploy

Documentation

Full documentation coming soon

Discussions

If you have questions how to use, want to suggest a feature, or show off a project you created with create-permaweb-app, join discussions on GitHub. I would love to hear from you. 🙂

Issues

If you find a bug or would like to request a feature, please visit ISSUES