Skip to content

Commit 9de6837

Browse files
Genesis3800Genesis3800
authored
Merge pull request #340 from availproject/staging
build section refactor by Robin & Naruto
2 parents 23f2d52 + 13b0b82 commit 9de6837

10 files changed

+326
-9
lines changed

‎pages/docs/_meta.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
"learn-about-avail": "Learn more about Avail",
99
"end-user-guide": "End User Guide",
1010
"stake-on-avail": "Stake on Avail",
11-
"build-with-avail": "Build on Avail",
11+
"build-with-avail": "Build with Avail",
1212
"operate-a-node": "Run a Node on Avail",
1313
"glossary": "Glossary",
1414
"faqs": "FAQs",

‎pages/docs/build-with-avail/_meta.json

+1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
{
22
"overview": "Overview",
33
"quickstart": "Quickstart",
4+
"interacting-with-Avail": "Interact with Avail",
45
"Optimium": "Optimium",
56
"Validium": "Validium",
67
"sovereign-rollups": "Sovereign Rollups"

‎pages/docs/build-with-avail/interacting-with-Avail.mdx

+179
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,179 @@
1+
---
2+
id: interacting-with-Avail
3+
title: How to interact with Avail
4+
sidebar_label: Interact
5+
description: 'Discover how to interact with Avail as a data availability layer.'
6+
keywords:
7+
- documentation
8+
- avail
9+
- develop
10+
- build
11+
- data availability
12+
- da
13+
image: https://docs.availproject.org/img/avail/AvailDocs.png
14+
---
15+
import { Callout } from 'nextra/components'
16+
17+
# How to get started interacting with Avail
18+
19+
## Overview
20+
21+
Interaction with Avail Network is the most important thing that developers can start doing to get started in this great journey of modularism. There are multiple ways to start interacting and in this tutorial, we will check out all of them. We will be running a Turing testnet and will be ineracting with tools like Avail-js, Avail-Subxt and similar.
22+
23+
First thing to do is to run an Avail Node. To learn more on how to run a node, check out the documentation [<ins>here</ins>](/docs/operate-a-node/run-a-full-node/full-node).
24+
25+
## Generating an AppId
26+
27+
### What is an AppId?
28+
29+
As a general-purpose base layer, Avail is designed to support many modular chains at the same time, providing consensus and data availability to all of them simultaneously. Avail headers contain an index that allows a given modular chain (or "application" in Avail terminology) to determine and download only the sections of a block that have data for that particular application.
30+
31+
### How to generate a new AppId
32+
33+
1. **Access the Website**: Open your web browser and go to the [<ins>Generator web application</ins>](https://app-id-gen.vercel.app/).
34+
35+
1. **Account Detection / Selection**:
36+
- The website will automatically detect any accounts linked via browser extensions.
37+
- Ensure you have the relevant extension installed and are logged in.
38+
- Select the account you wish to use for the AppId creation.
39+
40+
1. **Input Application Name**: In the provided field, enter the name of your application. Make sure the name is unique and identifies your app.
41+
42+
1. **Send Transaction**: Submit the transaction after entering the application name. This will involve a confirmation step through your browser extension.
43+
44+
1. **Receive Your Application Id:**
45+
- Upon successful transaction completion, your AppId will be displayed.
46+
- Note down the Id for future reference.
47+
48+
For more information on AppId, check out the documentation [<ins>here</ins>](/docs/end-user-guide/app-id).
49+
50+
## Tools and Libraries to interact with Avail
51+
52+
There are multiple tools and libraries that can be used to interact with Avail. We will cover each one of them in depth here.
53+
54+
#### Avail-js
55+
56+
Avail-js is a JavaScript library that can be used to interact with Avail. It is a wrapper around the Substrate API and provides a simple interface to interact with Avail. To learn more about Avail-js from the github repo, checkout the repository [<ins>here</ins>](https://github.com/availproject/avail/tree/main/avail-js). We will get into some quick examples and tutorials on how to use Avail-js here.
57+
58+
Pre-requisites for Avail-js:
59+
[Node.js](https://nodejs.org/en/download/)
60+
61+
Now, you can install the latest stable version of the avail-js library by running the following command:
62+
63+
```bash
64+
npm install avail-js-sdk
65+
```
66+
67+
##### Examples
68+
69+
There are a lot of examples already in the repository. We will be looking at how some of these work. To do so, we will be running a Turing testnet and will be interacting with the network using Avail-js. You can choose to run a local node as well if you wish.
70+
71+
Once you fully run the node, you also need to populate `config.ts` file with seed and endpoint details. You can choose to change other things as well, but we will be focusing on these two for now.
72+
73+
###### How to connect
74+
75+
For the starters, we will run `connect.ts`. This is also located in the [examples](https://github.com/availproject/avail/blob/main/avail-js/examples/node-examples/src/connect.ts) folder. <br />
76+
77+
78+
```typescript
79+
import { initialize } from "avail-js-sdk" // Global import
80+
import { isConnected, disconnect } from "avail-js-sdk/chain" // Modular import
81+
import config from "../../config"
82+
83+
/**
84+
* Example to connect to a chain and get the ApiPromise.
85+
*/
86+
const main = async () => {
87+
const api = await initialize(config.endpoint)
88+
const [chain, nodeName, nodeVersion] = await Promise.all([
89+
api.rpc.system.chain(),
90+
api.rpc.system.name(),
91+
api.rpc.system.version(),
92+
])
93+
94+
console.log(
95+
`Connected to chain ${chain} using ${nodeName} and node version ${nodeVersion} - is connected: ${isConnected()}`,
96+
)
97+
await disconnect()
98+
process.exit(0)
99+
}
100+
main()
101+
```
102+
103+
104+
###### How to transfer funds
105+
106+
To transfer funds, you can use the following code in TypeScript. Please make sure that the funds that you are sending is specified in the `config.ts` file.
107+
108+
```typescript
109+
import { getDecimals, initialize, formatNumberToBalance, getKeyringFromSeed, isValidAddress } from "avail-js-sdk"
110+
import { ISubmittableResult } from "@polkadot/types/types/extrinsic"
111+
import { H256 } from "@polkadot/types/interfaces/runtime"
112+
113+
import config from "../../config"
114+
115+
const main = async () => {
116+
try {
117+
if (!isValidAddress(config.recipient)) throw new Error("Invalid Recipient")
118+
119+
const api = await initialize(config.endpoint)
120+
const keyring = getKeyringFromSeed(config.seed)
121+
const options = { app_id: 0, nonce: -1 }
122+
const decimals = getDecimals(api)
123+
const amount = formatNumberToBalance(config.amount, decimals)
124+
125+
const oldBalance: any = await api.query.system.account(config.recipient)
126+
console.log(`Balance before the transfer call: ${oldBalance["data"]["free"].toHuman()}`)
127+
128+
// Transaction call
129+
const txResult = await new Promise<ISubmittableResult>((res) => {
130+
api.tx.balances
131+
.transferKeepAlive(config.recipient, amount)
132+
.signAndSend(keyring, options, (result: ISubmittableResult) => {
133+
console.log(`Tx status: ${result.status}`)
134+
if (result.isFinalized || result.isError) {
135+
res(result)
136+
}
137+
})
138+
})
139+
console.log(`Tx Hash: ${txResult.txHash as H256}, Block Hash: ${txResult.status.asFinalized as H256}`)
140+
141+
// Error handling
142+
const error = txResult.dispatchError
143+
if (txResult.isError) {
144+
console.log(`Transaction was not executed`)
145+
} else if (error != undefined) {
146+
if (error.isModule) {
147+
const decoded = api.registry.findMetaError(error.asModule)
148+
const { docs, name, section } = decoded
149+
console.log(`${section}.${name}: ${docs.join(" ")}`)
150+
} else {
151+
console.log(error.toString())
152+
}
153+
process.exit(1)
154+
}
155+
156+
const newBalance: any = await api.query.system.account(config.recipient)
157+
console.log(`Balance after the transfer call: ${newBalance["data"]["free"].toHuman()}`)
158+
159+
process.exit(0)
160+
} catch (err) {
161+
console.error(err)
162+
process.exit(1)
163+
}
164+
}
165+
main()
166+
```
167+
168+
These two examples are just the starters on what can be achieved by using avail-js. There are a lot of other [examples](https://github.com/availproject/avail/tree/main/avail-js/examples/node-examples) in the repository that you can check out.
169+
170+
171+
#### Avail-SubXt
172+
173+
SubXt is a library for interacting with Substrate based nodes in Rust and WebAssembly. We have built Avail-SubXt to interact with Avail nodes. To learn more about Avail-SubXt from the github repo, checkout the repository [<ins>here</ins>](https://github.com/availproject/avail/tree/main/avail-subxt). We will get into some quick examples and tutorials on how to use Avail-SubXt here.
174+
175+
176+
177+
178+
import { sortAndDeduplicateDiagnostics } from "typescript"
179+

‎pages/docs/build-with-avail/overview.mdx

+132-7
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,154 @@
11
---
2-
id: overview
3-
title: Build a Rollup With Avail
4-
sidebar_label: Overview
5-
description: 'Discover how to utilize Avail as a data availability layer.'
2+
id: getting-started
3+
title: Getting Started
4+
sidebar_label: Getting Started
5+
description: 'Get Started on how to utilize Avail as a data availability layer.'
66
keywords:
77
- documentation
88
- avail
99
- develop
1010
- build
1111
- data availability
1212
- da
13+
- raas
14+
- getting started
1315
image: https://docs.availproject.org/img/avail/AvailDocs.png
1416
---
15-
import { Callout } from 'nextra/components'
17+
import { Callout, Cards, Card } from 'nextra/components'
18+
import { LinkIcon,FilesIcon } from '@components/icons'
1619

17-
# Build a Rollup With Avail
20+
21+
22+
# Build with Avail
1823

1924
## Overview
2025

21-
Integrating with Avail enhances transaction processing by keeping data off-chain while ensuring its availability and validity. Avail's role as an optimized blockchain for data availability is central to this adaptation, offering a robust and modular design for diverse use cases.
26+
Avail is the permissionless unification layer of Web3. By building on Avail DA you unlock enhanced transaction processing by keeping data off-chain while ensuring its availability and validity. Avail DA's role as an optimized blockchain for data availability is central to this adaptation, offering a robust and modular design for diverse use cases.
27+
28+
Avail DA has been integrated with all of your favourite rollup stacks and frameworks. You can find various guides to help you get started with the stack of your choice.
2229

2330
<Callout type="info">
2431
If you are looking to build with Avail at a hackathon, you can check out a curated list of ideas on this [Notion doc](https://www.notion.so/avail-project/Avail-DA-Dev-Onboard-Hackathon-Edition-6ce01faa760b41b79b3ea7758a6265e5).
2532
</Callout>
2633

34+
35+
## Getting Started
36+
37+
The first step to building a rollup with Avail DA is choosing the framework or platform on which you'll be building on.
38+
39+
### Optimium
40+
41+
Optimiums are optimistic L2s that use external DA providers such as Avail DA for data availability. More information about optimiums [here](/docs/build-with-avail/Optimium).
42+
<Cards>
43+
<Card title="OP Stack" href="/docs/build-with-avail/Optimium/op-stack" />
44+
<Card title="Arbitrum Nitro" href="/docs/build-with-avail/Optimium/arbitrum-nitro" />
45+
</Cards>
46+
47+
### Validium
48+
49+
Validiums are validity-proven L2s that use external DA providers such as Avail DA for data availability. More information about validiums [here](/docs/build-with-avail/Validium).
50+
<Cards>
51+
<Card title="Polygon zkEVM" href="/docs/build-with-avail/Validium/zkevm" />
52+
<Card title="Polygon CDK" href="/docs/build-with-avail/Validium/zkevm" />
53+
<Card title="Madara Starknet" href="/docs/build-with-avail/Validium/madara" />
54+
</Cards>
55+
56+
57+
### Sovereign Rollups or Appchains
58+
59+
Sovereign rollups use DA providers like Avail DA for transaction ordering and data availability but typically handle settlement themselves. Appchains on the other hand may or may not be sovereign by design, but are built to do one specific thing - like an application - unlike a conventional general purpose chain.
60+
61+
<Cards>
62+
<Card icon={<LinkIcon />} title="Stackr SDK - Appchain" href="https://docs.stf.xyz/" target="_blank" rel="noopener noreferrer" />
63+
<Card icon={<LinkIcon />} title="Sovereign SDK - Sovereign" href="https://github.com/availproject/sovereign-sdk/tree/main" target="_blank" rel="noopener noreferrer"/>
64+
<Card icon={<LinkIcon />} title="Rollkit - Sovereign" href="https://github.com/rollkit/avail-da" target="_blank" rel="noopener noreferrer"/>
65+
<Card icon={<LinkIcon />} title="OpEVM - Sovereign" href="https://github.com/availproject/op-evm" target="_blank" rel="noopener noreferrer"/>
66+
<Card icon={<LinkIcon />} title="Dymension - Sovereign" href="https://docs.dymension.xyz/build/roller/production/run" target="_blank" rel="noopener noreferrer"/>
67+
</Cards>
68+
69+
### Rollup-as-a-Service (RaaS)
70+
71+
Rollup-as-a-Service partners of Avail allow you to easily spin up a rollup with configurations of your choice at a click of a button.
72+
73+
<Cards>
74+
<Card icon={<LinkIcon />} title="Altlayer" href="https://altlayer.io/" target="_blank" rel="noopener noreferrer"/>
75+
<Card icon={<LinkIcon />} title="Ankr" href="https://www.ankr.com/" target="_blank" rel="noopener noreferrer"/>
76+
<Card icon={<LinkIcon />} title="Conduit" href="https://conduit.xyz/" target="_blank" rel="noopener noreferrer"/>
77+
<Card icon={<LinkIcon />} title="gateway.fm" href="https://gateway.fm/" target="_blank" rel="noopener noreferrer"/>
78+
<Card icon={<LinkIcon />} title="Gelato" href="https://www.gelato.network/" target="_blank" rel="noopener noreferrer"/>
79+
<Card icon={<LinkIcon />} title="Orbitron" href="https://docs.orbitron.sh/" target="_blank" rel="noopener noreferrer"/>
80+
<Card icon={<LinkIcon />} title="PineX" href="https://www.pinex.it/" target="_blank" rel="noopener noreferrer"/>
81+
<Card icon={<LinkIcon />} title="Snapchain" href="https://www.snapchain.dev/" target="_blank" rel="noopener noreferrer"/>
82+
<Card icon={<LinkIcon />} title="TrueZK" href="https://www.truezk.com/" target="_blank" rel="noopener noreferrer"/>
83+
<Card icon={<LinkIcon />} title="QuickNode" href="https://www.quicknode.com/" target="_blank" rel="noopener noreferrer"/>
84+
85+
</Cards>
86+
87+
### Network Information & Tooling
88+
89+
<Cards>
90+
<Card title="Network Information" href="/docs/networks" />
91+
</Cards>
92+
93+
Avail's Developer toolkit is going to be your best friend as you build on Avail DA. Avail supports a number of SDKs and Libraries to directly interact with the network.
94+
95+
| Tool | |
96+
| -------- | -------- |
97+
| [`avail-js-sdk`](https://github.com/availproject/avail/tree/main/avail-js) | A simple JS/TS SDK to help you interact with the Avail network. It's a wrapper on top of [PolkadotJS](https://polkadot.js.org/) |
98+
| [`avail-subxt`](https://github.com/availproject/avail/tree/main/avail-subxt) | A Rust-based subXt Library for interacting with the Avail network easily |
99+
| [`avail-gsrpc`](https://github.com/availproject/avail/tree/main/examples/go) | Interact with the Avail network with Go |
100+
| [`txwrapper`](https://github.com/availproject/txwrapper) | Tool to generate, sign, and publish offline transactions |
101+
| [`app-id` gen](https://app-id-gen.vercel.app/) | Easy to use UI for generating an `app-id` for your rollup |
102+
| [Faucet](https://faucet.avail.tools/) | Faucet for receiving test AVAIL tokens |
103+
104+
### Demo Rollup Testnets
105+
106+
Check out our demo rollups powered by Avail
107+
108+
<Cards>
109+
<Card icon="🔴 " title="Altlayer OP Avail Testnet (EVM)" href="https://docs.altlayer.io/altlayer-documentation/public-testnets/op-avail-testnet" target="_blank" rel="noopener noreferrer"/>
110+
</Cards>
111+
OP Avail testnet is an OP stack powered L2 that uses Avail as its data availability layer.
112+
113+
In OP Avail, L2 transaction data are written to Avail instead of Ethereum. The unique blob reference is then written to Ethereum calldata. By doing this, we reduce the cost of publishing data to Ethereum and make it relatively inexpensive and cost-efficient, even if the actual transaction data can be of MBs in size. The rollup node will then be able to retrieve the data commitments from the calldata on Ethereum, and then retrieve the transaction data from Avail.
114+
115+
## Benefits of building on Avail
116+
117+
Avail’s modular blockchain has been designed to provide affordable, decentralized, scalable and secure data availability services for other blockchains built on top. Through Avail's unique combination of features, the Avail network is able to effectively and efficiently solve the [data availability problem](https://blog.availproject.org/data-availability-what-is-it/).
118+
119+
### Validity proofs
120+
<br/>
121+
<img src="/img/avail/avail-validity-proofs.png" width="100%" height="100%" />
122+
123+
Blockchain nodes need data availability guarantees when committing new blocks to a blockchain. Avail use KZG commitments so that developers and users don’t need to trust Avail that data is available, they can verify it for themselves.
124+
125+
### Erasure coding
126+
<br/>
127+
<img src="/img/avail/avail-erasure-coding.png" width="100%" height="100%" />
128+
129+
Erasure coding is a method for protecting data. It’s widely used across computer systems and is the reason why you can still use a CD with scratches on it. Data that’s sent to Avail is made redundant, and separated into chunks (cells) which is stored in an extended data matrix. This helps make the data on Avail more tamper proof and resilient, making it much harder for malicious nodes to suppress any data within the system.
130+
131+
By using erasure coding, in conjunction with the validity proofs mentioned above, Avail provides blockchain developers, and their users, with high data integrity guarantees and added redundancy to ensure the data they send to Avail remains safe and secure. If you’re considering using the Avail network for something other than data availability, it’s important to note that [data availability is not data storage](https://blog.availproject.org/data-availability-is-not-data-storage/). While they share some similarities, the two use cases are very different.
132+
133+
### Light Clients and Data Availability Sampling (DAS)
134+
<br/>
135+
<img src="/img/avail/avail-das.png" width="100%" height="100%" />
136+
137+
Avail’s light client is a light piece of software that enables you to interact with the Avail blockchain easily without requiring a full-node. Avail light clients can run almost anywhere providing data availability guarantees to blockchain nodes and users, improving network decentralization and end-user verification.
138+
139+
Data Availability Sampling leverages light clients, validity proofs and erasure coding to randomly sample data from the Avail blockchain and generate a confidence score. The light client can quickly generate data availability guarantees very close to 100% with 8-30 samples.
140+
141+
In its final form, Avail will have a P2P network made up of multiple light clients which it can sample data from. Avail is the only DA layer that can sample from its light client P2P network instead of relying on full nodes. This sets Avail apart from all current and planned data availability solutions, adding an additional layer of resilience to the network and improving decentralization.
142+
143+
Light Clients can also be done in a more targeted way. If you enable `application-mode` in your light clients, which is as simple as setting an `app-id > 0` then, you can use the light client to sample and fetch data for just your application.
144+
145+
### Expandable Blockspace
146+
<br/>
147+
<img src="/img/avail/avail-blockspace.png" width="100%" height="100%" />
148+
149+
150+
Avail’s DA layer can scale blockspace with demand, future-proofing your appchain or rollup. Although Avail's block size is initally at 2MB, it can scale and expand as per demand and has been successfully benchmarked to be able to handle blocksizes of upto 128MB without sacrificing network liveness or propagation.
151+
27152
## System Operations
28153

29154
- **Transaction Processing and Sequencing**: In the rollup framework, transactions are processed, sequenced, and readied for submission to Avail.

0 commit comments

Comments
 (0)