Skip to content

Commit

Permalink
Organize files (#360)
Browse files Browse the repository at this point in the history
  • Loading branch information
gianalarcon committed Apr 10, 2024
1 parent 6b0e2d8 commit 0a4c558
Show file tree
Hide file tree
Showing 4 changed files with 7 additions and 534 deletions.
3 changes: 1 addition & 2 deletions src/SUMMARY.md
Original file line number Diff line number Diff line change
Expand Up @@ -23,8 +23,7 @@
- [Example - Intermediate: Deployment Script](ch02-08-01-deployment-script.md)
- [Starknet-js: Javascript SDK](ch02-09-starknet-js.md)
- [Example - Beginner: Counter UI](ch02-09-01-counter-ui.md)
- [Example - Beginner: ERC-20 UI](ch02-09-02-erc20-ui.md)
- [Example - Beginner: ERC-20 UI with Apibara-react and StarknetKit](ch02-09-03-erc20-apibara.md)
- [Example - Beginner: ERC-20 UI with Apibara-react and StarknetKit](ch02-09-02-erc20-apibara.md)
- [Starknet-React: React Integration](ch02-10-starknet-react.md)
- [Example - Beginner: ERC-20 UI](ch02-10-01-erc20-ui.md)
- [Example - Intermediate: Million Dollar Homepage](ch02-10-02-million-dollar-homepage.md)
Expand Down
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
<img alt="ERC20 Apibara Main" src="img/ch02-apibara-erc20-main.png" class="center" style="width: 100%;" />

# ERC-20 UI with Apibara-react and StarknetKit
# ERC-20 UI with Starknet-react and StarknetKit

In this section, we will be exploring how to build a web3 application with [Apibara](https://github.com/apibara/starknet-react) react library, [StarknetKit](https://www.starknetkit.com/docs/getting-started), and an ERC-20 smart contract written in the [Cairo](https://book.cairo-lang.org/title-page.html) language. This tutorial is similar to [ERC-20 UI](ch02-10-01-erc20-ui.md) tutorial but with the addition of utilizing Apibara-react, StarknetKit and up to date versions of the tools and libraries.
In this section, we will be exploring how to build a web3 application with [Starknet-react](https://github.com/Starknet/starknet-react) react library, [StarknetKit](https://www.starknetkit.com/docs/getting-started), and an ERC-20 smart contract written in the [Cairo](https://book.cairo-lang.org/title-page.html) language. This tutorial is similar to [ERC-20 UI](ch02-10-01-erc20-ui.md) tutorial but with the addition of utilizing Starknet-react, StarknetKit and up to date versions of the tools and libraries.

## Prerequisites

Expand Down Expand Up @@ -30,7 +30,7 @@ Before we start, this guide assumes the reader is familiar in the following:

We will first start with building the contract.

**[IMPORTANT]** _Before we start building the contract, make sure that you have your environment setup by clicking [here](https://docs.starknet.io/documentation/quick_start/environment_setup/) and navigate to this github [**repo**](https://github.com/FriendlyLifeguard/starknet_erc20_example), clone it and follow the instruction on the README to setup the project._
**[IMPORTANT]** _Before we start building the contract, make sure that you have your environment setup by clicking [here](https://docs.starknet.io/documentation/quick_start/environment_setup/) and navigate to this github [**repo**](https://github.com/FriendlyLifeguard/starknet_erc20_example), clone it and follow the instruction on the README to setup the project. You also can fin this repo on our local [examples](https://github.com/starknet-edu/starknetbook/tree/main/examples/apibara-starknetkit)._

## Building/Deploying the Contract

Expand Down Expand Up @@ -124,7 +124,7 @@ Next, we will be constructing our frontend so that users can interact with the c

# Building the Frontend

For our frontend, we will be using NextJ, [Apibara-react](https://starknet-react.com/docs/getting-started), and [StarknetKit](https://www.starknetkit.com/docs/getting-started).
For our frontend, we will be using NextJ, [Starknet-react](https://starknet-react.com/docs/getting-started), and [StarknetKit](https://www.starknetkit.com/docs/getting-started).

## Configuring the repo for your contract

Expand Down Expand Up @@ -513,5 +513,5 @@ In this tutorial, we were able to accomplish the following tasks!

- **Initializing environment**: Setting up an environment for starknet and cairo development
- **Declaring and deploying the contract**: Declaring and deploying our ERC20 cairo contract on the sepolia testnet
- **Initializing the frontend**: Setting up the frontend with NextJS, Apibara-react, and Starknetkit to connect your Cairo contract with your wallet
- **Initializing the frontend**: Setting up the frontend with NextJS, Starknet-react, and Starknetkit to connect your Cairo contract with your wallet
- **Interacting with the frontend**: Connecting/disconnecting your wallet, viewing your deployed token balance, and transferring tokens to another wallet by sending transactions on the sepolia network

0 comments on commit 0a4c558

Please sign in to comment.