Skip to content

Commit

Permalink
chore(docs): Updates to readme w/ pnpm and fnet references.
Browse files Browse the repository at this point in the history
Changed ui readme to just refer to the gitbook docs page.
Removed old npx references in contracts/ui package.json files.
  • Loading branch information
pbennett committed Nov 13, 2024
1 parent de5e7c5 commit 51acab3
Show file tree
Hide file tree
Showing 5 changed files with 15 additions and 77 deletions.
16 changes: 8 additions & 8 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -35,41 +35,41 @@ This section provides instructions for running the protocol and UI in a local Al
pnpm install
```

- **Start the local network**
- **Start the local (fnet compatible) test network**

```bash
algokit localnet start
cd contracts; pnpm run localnet
```

- **Bootstrap the validator**

This command bootstraps a new master validator and funds two new test accounts. It also sets environment variables for LocalNet that will be used by the front-end.
```bash
pnpm run bootstrap
cd contracts/boostrap; pnpm run bootstrap
```

- **Launch the UI**

```bash
pnpm run dev
cd ui; pnpm run dev:localnet
```

## TestNet Development
## FNet Development

- **Navigate to the `ui` directory**

```bash
cd ui
```

- **Create a `.env.testnet` file**
- **Create a `.env.fnet` file**

Copy the TestNet variables from the [`.env.template`](./ui/.env.template) file into a new `.env.testnet` file. Check back often to make sure you're using the latest master validator app ID, set to `VITE_RETI_APP_ID`.
Copy the fnet variables from the [`.env.template`](./ui/.env.template) file into a new `.env.fnet` file. Check back often to make sure you're using the latest master validator app ID, set to `VITE_RETI_APP_ID`.

- **Launch the UI**

```bash
pnpm run dev:testnet
pnpm run dev:fnet
```

## Additional Resources
Expand Down
2 changes: 1 addition & 1 deletion contracts/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ The contracts themselves are written in Tealscript. See [Tealscript](https://tea

## Usage

### Algokit
### Algokit and Local sandbox

This repository assumes you have [AlgoKit](https://github.com/algorandfoundation/algokit-cli) installed and have a local network running on your machine. Run `pnpm run localnet` to start a specially configured trunk version of the node that supports the (still unreleased AVM 11) and that also configures a smaller amount of stake for tests. This special localnet sandbox is required for the system tests as they manipulate the block time offsets.

Expand Down
4 changes: 2 additions & 2 deletions contracts/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,8 @@
"localnet": "algokit localnet start --name master --config-dir ./localnet_config",
"lint": "eslint . --ext ts --max-warnings 0",
"lint:fix": "eslint . --ext ts --max-warnings 0 --fix",
"prettier": "npx prettier --check .",
"prettier:fix": "npx prettier --write ."
"prettier": "pnpx prettier --check .",
"prettier:fix": "pnpx prettier --write ."
},
"dependencies": {
"@algorandfoundation/algokit-utils": "7.0.0-beta.22",
Expand Down
66 changes: 2 additions & 64 deletions ui/README.md
Original file line number Diff line number Diff line change
@@ -1,65 +1,3 @@
# reti-ui
# Réti Open Pooling UI

This starter React project has been generated using AlgoKit. See below for default getting started instructions.

# Setup

### Initial setup

1. Clone this repository locally
2. Install pre-requisites:
- Make sure to have [Docker](https://www.docker.com/) installed and running on your machine.
- Install `AlgoKit` - [Link](https://github.com/algorandfoundation/algokit-cli#install): The minimum required version is `1.1`. Ensure you can execute `algokit --version` and get `1.1` or later.
- Bootstrap your local environment; run `algokit bootstrap all` within this folder, which will run `npm install` to install NPM packages and dependencies for your frontend component/webapp.
- Run `algokit localnet start` to start a local Algorand network in Docker. If you are using VS Code launch configurations provided by the template, this will be done automatically for you.
3. Open the project and start debugging / developing via:
- VS Code
1. Open the repository root in VS Code
2. Install recommended extensions
3. Hit F5 (or whatever you have debug mapped to) and it should start running with breakpoint debugging.
- JetBrains WebStorm
1. Open the repository root in WebStorm
2. Hit Shift+F10|Ctrl+R (or whatever you have debug mapped to). Then Shift+CMD|Ctrl+Click on the link in the console to open the browser with debugger attached.
- Other
1. Open the repository root in your text editor of choice
2. In a terminal run `npm run dev`

### Subsequently

1. If you update to the latest source code and there are new dependencies you will need to run `algokit bootstrap all` again
2. Follow step 3 above

> Please note, by default frontend is pre configured to run against Algorand LocalNet. If you want to run against TestNet or MainNet, comment out the current environment variable and uncomment the relevant one in [`.env`](.env) file that is created after running bootstrap command and based on [`.env.template`](.env.template).
# Algorand Wallet integrations

The template comes with [`use-wallet`](https://github.com/txnlab/use-wallet) integration, which provides a React hook for connecting to an Algorand wallet providers. The following wallet providers are included by default:

- LocalNet:
- - [KMD/Local Wallet](https://github.com/TxnLab/use-wallet#kmd-algorand-key-management-daemon) - Algorand's Key Management Daemon (KMD) is a service that manages Algorand private keys and signs transactions. Works best with AlgoKit LocalNet and allows you to easily test and interact with your dApps locally.
- TestNet and others:
- - [Pera Wallet](https://perawallet.app).
- - [Defly Wallet](https://defly.app).
- - [Exodus Wallet](https://www.exodus.com).
- - [Daffi Wallet](https://www.daffi.me).

Refer to official [`use-wallet`](https://github.com/txnlab/use-wallet) documentation for detailed guidelines on how to integrate with other wallet providers (such as WalletConnect v2). Too see implementation details on the use wallet hook and initialization of extra wallet providers refer to [`App.tsx`](./src/App.tsx).

# Tools

This project makes use of React and Tailwind to provider a base project configuration to develop frontends for your Algorand dApps and interactions with smart contracts. The following tools are in use:

- [AlgoKit Utils](https://github.com/algorandfoundation/algokit-utils-ts) - Various TypeScript utilities to simplify interactions with Algorand and AlgoKit.
- [React](https://reactjs.org/) - A JavaScript library for building user interfaces.
- [Tailwind CSS](https://tailwindcss.com/) - A utility-first CSS framework for rapidly building custom designs.
- [use-wallet](https://github.com/txnlab/use-wallet) - A React hook for connecting to an Algorand wallet providers.
- [npm](https://www.npmjs.com/): Node.js package manager
- [jest](https://jestjs.io/): JavaScript testing framework
- [playwright](https://playwright.dev/): Browser automation library
- [Prettier](https://prettier.io/): Opinionated code formatter
- [ESLint](https://eslint.org/): Tool for identifying and reporting on patterns in JavaScript
It has also been configured to have a productive dev experience out of the box in [VS Code](https://code.visualstudio.com/), see the [.vscode](./.vscode) folder.

# Integrating with smart contracts and application clients

Refer to the detailed guidance on [integrating with smart contracts and application clients](./src/contracts/README.md). In essence, for any smart contract codebase generated with AlgoKit or other tools that produce compile contracts into ARC34 compliant app specifications, you can use the `algokit generate` command to generate TypeScript or Python typed client. Once generated simply drag and drop the generated client into `./src/contracts` and import it into your React components as you see fit.
### Visit [txnlab.gitbook.io/reti-open-pooling](https://txnlab.gitbook.io/reti-open-pooling/) for full documentation
4 changes: 2 additions & 2 deletions ui/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -105,8 +105,8 @@
"playwright:test": "playwright test",
"lint": "eslint src --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
"lint:fix": "eslint src --ext ts,tsx --report-unused-disable-directives --max-warnings 0 --fix",
"prettier": "npx prettier --check .",
"prettier:fix": "npx prettier --write .",
"prettier": "pnpx prettier --check .",
"prettier:fix": "pnpx prettier --write .",
"typecheck": "tsc --noEmit",
"preview": "vite preview"
},
Expand Down

0 comments on commit 51acab3

Please sign in to comment.