Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
121 changes: 47 additions & 74 deletions docs/02-developers/04-quickstart/dynamic.md
Original file line number Diff line number Diff line change
Expand Up @@ -126,47 +126,36 @@ Build a Next.js dApp on Rootstock with **Dynamic** embedded wallets and **Wagmi*
- Next.js, Wagmi, and Viem (included in starter kit)
- Rootstock Testnet configured (chain ID 31)

## **Getting Started**
## Getting Started

````mdx-code-block
<Steps>
<Step title=" Clone the Repository">
Clone the repository to use the starter kit locally.
Clone the starter kit, install dependencies, add your Dynamic Environment ID, then run the Next.js app.

### Clone the repository

Clone the repository to use the starter kit locally.

```bash
git clone https://github.com/rsksmart/rootstock-dynamic
cd rootstock-dynamic
```
</Step>
<Step title="Install Dependencies">
Install the necessary dependencies with either Bun or Yarn.
<Tabs>
<TabItem value="contribute" label="Using Bun" default>
```
bun install
```
</TabItem>
<TabItem value="contest" label="Using Yarn">
```
yarn install
```
</TabItem>

</Tabs>
### Install dependencies

Install the necessary dependencies with either Bun or Yarn (choose one).

</Step>
<Step title="Get Environment Variables from Dynamic">
bun install
# or
yarn install

:::note
Create a FREE account on Dynamic and login to your Dashboard. Then obtain your `ENVIRONMENT_ID` from the [Dynamic dashboard](https://app.dynamic.xyz/dashboard/overview).
### Get environment variables from Dynamic

:::
Create a free account on Dynamic and log in to your dashboard. Then obtain your `ENVIRONMENT_ID` from the [Dynamic dashboard](https://app.dynamic.xyz/dashboard/overview).

Follow these steps to locate and copy your Environment ID:

<img src="/img/developers/quickstart/dynamic-starter-kit/image1.png" alt="Dynamic.xyz dashobard"/>
<img src="/img/developers/quickstart/dynamic-starter-kit/image1.png" alt="Dynamic.xyz dashboard"/>

An Environment ID is needed to configure and secure your application. Here’s how to get it:
An Environment ID is needed to configure and secure your application.

* **Open the Developer Section**:
* Look at the menu on the left side of the screen. Find and click **Developers** to expand the options.
Expand All @@ -175,83 +164,67 @@ An Environment ID is needed to configure and secure your application. Here’s h
* **Copy the Environment ID**:
* Find the box labeled **Environment ID**. Click the copy icon next to the ID to copy it to your clipboard.

</Step>
### Set up environment variables

<Step title="Set Up Environment Variables">
Create a `.env.local` file in the project’s root directory to store environment variables.
Create a `.env.local` file in the project’s root directory to store environment variables.

```bash
mv .env.local.example .env.local
```

Setting up the `.env.local` file is critical for securely storing your environment ID. This ID is necessary for accessing Dynamic’s features and connecting to the Web3 backend.
Setting up the `.env.local` file stores your environment ID so the app can access Dynamic’s features and connect to the Web3 backend.

Open the `.env.local` file and add your environment ID for Dynamic.

```bash
NEXT_PUBLIC_DYNAMIC_ENVIRONMENT_ID=YOUR_ENVIRONMENT_ID
```
</Step>
<Step title="Run the Development Server">
Start the development server using Bun or Yarn.
<Tabs>
<TabItem value="contribute" label="Using Bun" default>
```
bun dev
```
</TabItem>
<TabItem value="contest" label="Using Yarn">
```
yarn dev
```
</TabItem>

</Tabs>

### Run the development server

Start the development server using Bun or Yarn.

```bash
bun dev
```

```bash
yarn dev
```

Visit [http://localhost:3000](http://localhost:3000) in your browser to view your project.

<img src="/img/developers/quickstart/dynamic-starter-kit/image2.png" alt="The homepage of the Rootstock Dynamic Starterkit"/>
</Step>

</Steps>
````
## Interacting with the Frontend

The starter kit includes React components for connecting a wallet, reading balances, sending tokens, and signing messages.

### Connect wallet

## **Interacting with the Frontend**
Use the `DynamicWidget` component to connect a wallet through MetaMask or WalletConnect. You can also offer social login.

````mdx-code-block
<Steps>
<Step title="Connect Wallet">
* Use the `DynamicWidget` component for connecting to a wallet through options like MetaMask or WalletConnect. You can also offer social login options for enhanced accessibility.
* Once logged in, you will see a similar image like this
Once logged in, you will see a similar image like this:

<img src="/img/developers/quickstart/dynamic-starter-kit/image3.png" alt="Connect wallet using DynamicWidget component"/>

</Step>
<Step title="Check Token Balances">
### Check token balances

The [`Balances`](https://github.com/rsksmart/rootstock-dynamic/blob/main/components/Balances.tsx) component fetches and displays the wallet's token balances, supporting multiple tokens like rBTC, tRIF, and DOC.
</Step>
<Step title="Send Tokens">
Through the [`Transfer`](https://github.com/rsksmart/rootstock-dynamic/blob/main/components/Transfer.tsx) component, users can transfer tokens directly within the dApp. It includes fields to specify the recipient address and token amount, along with secure hooks to initiate the transfer.
The [`Balances`](https://github.com/rsksmart/rootstock-dynamic/blob/main/components/Balances.tsx) component fetches and displays the wallet's token balances. It supports rBTC, tRIF, and DOC.

**Features:**
### Send tokens

* **Dropdown**: Select a token from available options (**rBTC, tRIF, and DOC**)
* **Input Fields**:
The [`Transfer`](https://github.com/rsksmart/rootstock-dynamic/blob/main/components/Transfer.tsx) component lets users transfer tokens in the dApp. It includes fields for the recipient address and token amount, plus hooks to initiate the transfer.

- **Amount:** Enter the amount to send.
Features:

- **Recipient Address:** Enter the address to send tokens to.
</Step>
* **Dropdown**: Select a token from available options (**rBTC, tRIF, and DOC**)
* **Amount**: Enter the amount to send.
* **Recipient Address**: Enter the address to send tokens to.

<Step title="Sign Messages">
The [`SignMessage`](https://github.com/rsksmart/rootstock-dynamic/blob/main/components/SignMessage.tsx) component enables the user to sign arbitrary messages using the connected wallet. This feature is useful for activities like authentication or data validation.
### Sign messages

</Step>
</Steps>
<br/>
````
The [`SignMessage`](https://github.com/rsksmart/rootstock-dynamic/blob/main/components/SignMessage.tsx) component lets the user sign arbitrary messages with the connected wallet. Use this for authentication or data validation.

By the end of this guide, we learned how to integrate Web3 features into a **Next.js** app using the **Dynamic Starter Kit for Rootstock**. With **wagmi hooks**, we can easily connect wallets, manage token balances, send tokens, and sign messages directly within your application.

Expand Down
94 changes: 36 additions & 58 deletions docs/02-developers/05-smart-contracts/06-rsk-cli/introduction.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,71 +6,49 @@ description: "The Rootstock CLI tool enables users to manage wallets, check bala
tags: [Rootstock CLI, developer tools, guides, rsk, rootstock, dApps, smart contracts, solidity, dev-environments]
---

The Rootstock CLI (rsk-cli) tool enables users to manage wallets, check balances, send transactions, verify smart contracts, and interact with smart contracts on the Rootstock blockchain—a Bitcoin sidechain designed for smart contracts.
The Rootstock CLI (rsk-cli) tool enables users to manage wallets, check balances, send transactions, verify smart contracts, and interact with smart contracts on Rootstock. Rootstock is a Bitcoin sidechain designed for smart contracts.

It supports both mainnet and testnet environments. Additionally, the tool provides bridge interaction features, allowing users to seamlessly transfer assets between Rootstock and Bitcoin (or other supported blockchains) via integrated bridge protocols.
It supports both mainnet and testnet environments. The tool also provides bridge interaction features so you can transfer assets between Rootstock and Bitcoin through integrated bridge protocols.

The CLI allows you to interact with your Rootstock wallet directly from the terminal, giving you control over creating, managing, and funding your wallet with rBTC (Smart Bitcoin).
The CLI lets you interact with your Rootstock wallet from the terminal. You can create, manage, and fund your wallet with rBTC.

In this guide, we will explore how to use the Rootstock CLI to create a wallet, manage it securely, and add funds to it.

## Key Features

````mdx-code-block
<Accordion>
<Accordion.Item eventKey="3">
<Accordion.Header as="h3">1. Wallet Management</Accordion.Header>
<Accordion.Body>
The wallet command lets you manage Ethereum-compatible wallets on Rootstock. You can:
<ul>
<li>Create, import, or use an existing wallet.</li>
<li>List saved wallets, switch wallets, update wallet names, and delete wallets.</li>
<li>Wallets are securely encrypted with AES-256-CBC, and private keys are stored in a JSON file.</li>
</ul>
</Accordion.Body>
</Accordion.Item>
<Accordion.Item eventKey="4">
<Accordion.Header as="h3">2. Checking Balance</Accordion.Header>
<Accordion.Body>
Use the <code>balance</code> command to view your wallet's current balance on the Rootstock blockchain.
This is supported on both mainnet and testnet.
</Accordion.Body>
</Accordion.Item>
<Accordion.Item eventKey="5">
<Accordion.Header as="h3">3. Sending rBTC</Accordion.Header>
<Accordion.Body>
The <code>transfer</code> command enables sending rBTC to another address.
Transactions can be initiated on both mainnet and testnet.
</Accordion.Body>
</Accordion.Item>
<Accordion.Item eventKey="6">
<Accordion.Header as="h3">4. View Transaction Status</Accordion.Header>
<Accordion.Body>
View the status of a transaction using the <code>tx</code> command by providing the transaction ID.
</Accordion.Body>
</Accordion.Item>
<Accordion.Item eventKey="7">
<Accordion.Header as="h3">5. Deploying Smart Contracts</Accordion.Header>
<Accordion.Body>
The <code>deploy</code> command allows users to deploy smart contracts on the blockchain by providing the ABI [Application Binary Interface](/concepts/glossary/) and bytecode files.
This is supported on both mainnet and testnet.
</Accordion.Body>
</Accordion.Item>
<Accordion.Item eventKey="8">
<Accordion.Header as="h3">6. Verifying Smart Contracts</Accordion.Header>
<Accordion.Body>
With the <code>verify</code> command, users can verify deployed smart contracts using Rootstock’s explorer API.
It supports both mainnet and testnet.
</Accordion.Body>
</Accordion.Item>
<Accordion.Item eventKey="9">
<Accordion.Header as="h3">7. Interacting with Verified Contracts</Accordion.Header>
<Accordion.Body>
The <code>contract</code> command lets users interact with read-only functions of a verified smart contract, listing the available methods for interaction.
</Accordion.Body>
</Accordion.Item>
</Accordion>
````
rsk-cli groups wallet, transfer, and contract commands behind a single CLI.

### Wallet Management

The `wallet` command lets you manage Ethereum-compatible wallets on Rootstock. You can:

- Create, import, or use an existing wallet.
- List saved wallets, switch wallets, update wallet names, and delete wallets.
- Wallets are encrypted with AES-256-CBC. Private keys are stored in a JSON file.

### Checking Balance

Use the `balance` command to view your wallet's current balance on the Rootstock blockchain. This is supported on both mainnet and testnet.

### Sending rBTC

The `transfer` command enables sending rBTC to another address. Transactions can be initiated on both mainnet and testnet.

### View Transaction Status

View the status of a transaction using the `tx` command by providing the transaction ID.

### Deploying Smart Contracts

The `deploy` command allows users to deploy smart contracts on the blockchain by providing the ABI ([Application Binary Interface](/concepts/glossary/)) and bytecode files. This is supported on both mainnet and testnet.

### Verifying Smart Contracts

With the `verify` command, users can verify deployed smart contracts using Rootstock’s explorer API. It supports both mainnet and testnet.

### Interacting with Verified Contracts

The `contract` command lets users interact with read-only functions of a verified smart contract, listing the available methods for interaction.

## Prerequisites

Expand Down
49 changes: 0 additions & 49 deletions docs/04-resources/06-guides/atlas/getting-started-atlas.md
Original file line number Diff line number Diff line change
Expand Up @@ -76,52 +76,3 @@ First wait for the estimated confirmation window. Then:
* 🟡 **Processing bridge transaction**
* 🟢 **Completed successfully**
* 🔴 **Action required / error**

<!-- The diagram below shows the full user flow from opening the bridge to receiving assets on the destination network. Each box is a step; you can complete the transaction with a connected wallet or via QR code (no wallet required). -->

<!-- ```text
┌──────────────┐
│ User │
│ (No wallet │
│ needed yet) │
└──────┬───────┘
┌────────────────────────────────────┐
│ atlas.rootstock.io │
│ 1. Select the desired pair │
│ (one side = Rootstock token) │
│ e.g. BTC ↔ rBTC, ETH → rBTC │
└──────┬─────────────────────────────┘
┌────────────────────────────────────┐
│ 2. Enter amount │
└──────┬─────────────────────────────┘
┌────────────────────────────────────┐
│ 3. Bridge lists available providers│
│ Compare rates & fees → pick one │
└──────┬─────────────────────────────┘
┌────────────────────────────────────┐
│ 4. Complete the transaction │
│ ┌─────────────────────────────┐ │
│ │ With wallet: connect & │ │
│ │ authorize in wallet │ │
│ └─────────────────────────────┘ │
│ ┌─────────────────────────────┐ │
│ │ Without wallet: scan QR │ │
│ │ and follow provider steps │ │
│ └─────────────────────────────┘ │
└──────┬─────────────────────────────┘
┌────────────────────────────────────┐
│ 5. Review & confirm │
│ Wait for confirmations │
│ Track status in bridge UI │
└────────────────────────────────────┘
``` -->
Loading
Loading