Learn to build on Near with Figment Learn

Near 101

Near

1 hour

Beginner

JS/TS

React

Rust

Next.js

Time Commitment

Difficulty

Programming Language

Technology

{% hint style="info" %}
Feel Free to skip this section and [start the challenges](https://learn.figment.io/tutorials/setup-the-near-project)
{% endhint %}

------------------------

# What is NEAR?

NEAR is a decentralized application platform that makes blockchain accessible to everyday people who are excited for the future of the Open Web. A web that is more private, more secure, and puts people in control of their money, data, and identity. NEAR’s purpose is to enable community-driven innovation to benefit people around the world.

What makes NEAR special?

1. NEAR is the inevitable evolution of existing platforms 
   1. Bitcoin made digital currency a reality, a global transfer of value programmed on a blockchain. Ethereum took it a step further and made it possible to create basic applications leveraging digital currency on blockchains, but has faced issues with scaling and prohibitive fees.  
   2. NEAR solves these challenges and finally makes building the Open Web possible by introducing a breakthrough sharding design that creates opportunities for innovation never possible in blockchain before. 
2. NEAR is made for the real world 
   1. NEAR is the fastest path to market for builders to create blockchain applications that are as easy to use as they are to build. It uses common development patterns and programming languages that are immediately familiar to web developers. 
   2. NEAR was built with pragmatism of a Silicon Valley tech startup by engineers who have shipped scalable solutions for the world’s leading technology companies. 
   3. NEAR is secure enough for high value assets like Digital Currencies or Identities and performant enough to scale for DeFi or Gaming applications without prohibitively expensive fees or network latency. 
3. NEAR is designed to be interoperable 
   1. NEAR is designed to work with existing blockchain platforms and is easy for existing applications to migrate to. NEAR uses the Ethereum Virtual Machine and Web Assembly so that builders can seamlessly swap from Ethereum to NEAR (and back) on the NEAR Rainbow Bridge to leverage the performance, security, and favorable economics of NEAR without having to rebuild their applications or smart contracts. 
   2. With NEAR, you don’t have to choose between NEAR and Ethereum or commit to only one blockchain. Interoperability and usability across platforms will be key to the mass adoption of blockchain.

NEAR is the first blockchain platform truly built for the real world. It is a builder's fastest path to market to create blockchain applications that are as easy to use as they are to build.

# Why build on NEAR?

**NEAR is easy to learn**. It uses familiar development patterns and languages for portability and ease of access for any web developers.

* “Writing smart contracts on Rust is awesome. It allows you to code error-free and fault-free. It’s a big reason why we chose NEAR. Other blockchains require you to learn less popular programming languages.” - _Carolin Wend, Co-Founder of Mintbase_

**NEAR is versatile**. It's secure enough for high-value assets like money or identity, and performant enough to scale DeFi or Gaming apps. NEAR helps developers avoid high fees and slow speeds to deliver a delightful user experience.

* “Augur gets $1B in volume and users burn $63M in gas fees. Flux gets $1B in volume and users burn only $10k in gas fees.” _Peter Mitchell, CEO of Flux_

**NEAR is by builders for builders**. NEAR is built by a pragmatic team of engineers that have shipped scalable solutions for many of the world’s leading tech companies. They’ve earned the backing of leading investors including Coinbase Ventures, Andressen Horowitz, Pantera Capital and Naval Ravikant.

* “NEAR approached us with a developer-first attitude hellbent on helping creators create seamless and memorable user experiences. We intuitively felt that NEAR could be the silver bullet that ZEST needed.” _Geoff Wellman, Founding Partner, CTO VHS_

**NEAR works with existing blockchain platforms.** Builders can seamlessly swap from Ethereum to NEAR (and back) on the NEAR Rainbow Bridge to leverage the performance, security, and favorable economics of NEAR without having to rebuild their applications. With NEAR, there is no need to choose between chains. Builders and users get the best of both worlds.

**NEAR makes applications easy to use**. In some cases, users don’t realize they’re using a blockchain application. NEAR Accounts combine human-readable names and a flexible contract-based permission structure that enables business models like recurring, free to play, or freemium that were never before possible using blockchain applications.

**NEAR is fast and future proof**. The unique sharding techniques implemented to enable the NEAR protocol to maintain consensus while splitting the network into multiple pieces. This means that throughput and speed will increase exponentially as the number of nodes on the network increases. There is no theoretical limit on the NEAR network’s capacity. As the Open Web grows, NEAR scales to meet it.

# What can you build on NEAR?

1. Open (decentralized) Finance: NEAR provides both a synchronous environment for atomic transactions, which benefits fast-moving financial applications like decentralized exchanges, and an asynchronous environment which allows every other application to hook into these critical financial rails. This will be possible with the upcoming EVM support.  
2. Open Web: because NEAR is basically the “builder’s blockchain”, it has been optimized to provide substantial flexibility and performance for developers to build great experiences for their end users. This means that consumer-facing blockchain-backed apps are finally possible and the use cases of the Open Web can finally be realized: 
   1. Prediction markets -- markets like Augur have been handicapped by the difficulty of building smooth user experiences on Ethereum.  Apps like [Flux](https://flux.market) on NEAR provide much more user-friendly ways to set up programmatically enforceable bets with fast, easy payments. 
   2. NFT marketplaces -- marketplaces like [Mintbase](https://mintbase.io), which transferred from Ethereum, allow creators of unique digital assets to easily implement marketplaces to buy and sell them. On NEAR, they have access to reasonable costs plus intuitive end-user experiences. 
   3. Gaming -- because NEAR allows for performant and usable apps, developers can create gaming experiences that hook into the blockchain without forcing end-users to suffer through wallets or tokens.

[Take a look at these examples from a recent hackathon](https://near.org/blog/winners-of-hack-the-rainbow)

# Network Specifications

## Transaction Fees

First, transaction fees on NEAR are a tiny fraction of the amount of fees paid on other blockchains. 1000 times lower transaction fees than Ethereum for users and developers earn 30% of transaction fees.

NEAR keeps transaction fees low by dynamically resharding to optimize for performance and avoid congestion on the network. However, the most important feature of the NEAR token isn’t related to fees or rewards, it comes back to the usability and developer experience that truly sets NEAR apart.

Complicated blockchain concepts like tokens, rewards, and fees can be almost entirely hidden from end-users of NEAR applications because smart contracts can be configured to pay fees on their behalf. This allows developers to build experiences which feel more like today’s web to their end-users, but still take advantage of the underlying innovations of blockchain.

## Transaction Speed & Finality

The expected block time is around 1s and the expected time to finality is around 2s. 1,000 TPS benchmarked on a single shard for token transfers (contract ops are slower).

## Languages supported

* **Contracts**: Rust and AssemblyScript
* **Command line**: NEAR CLI
* **API**: JavaScript and JSON RPC API

## EVM compatibility

NEAR is fully compatible with the EVM and interoperable with Ethereum. NEAR does not want Ethereum developers to choose between the two networks and commit to only one. Developers can have the same asset on both blockchains and even have apps that seamlessly communicate across the boundary.

This is made possible by the [**Rainbow Bridge**](https://github.com/near/rainbow-bridge), which connects the Ethereum and NEAR blockchains by leveraging the Ethereum miners and NEAR validators. More info can be found [**here**](https://github.com/near/near-evm).

## Role of the NEAR token

The NEAR token is how people who use applications on the network pay to submit transactions to the nodes who actually run the network. The token is thus a utility — if you hold it, you can use applications hosted on the network.


Learn how NEAR works and what makes it special

Introduction

Our Contract is on-chain, and we're going to learn how to fetch the message stored on the contract.

{% hint style="working" %}
If you want to learn more about NEAR smart contracts, you can follow the tutorial [here](https://learn.figment.io/tutorials/write-and-deploy-a-smart-contract-on-near)
{% endhint %}

---

# Challenge

{% hint style="tip" %}
In`pages/api/near/getter.ts`, implement the default function. You must replace any instances of `undefined` with working code to accomplish this.
{% endhint %}

**Take a few minutes to figure this out.**

```tsx
//...
  try {
    const { NETWORK, ACCOUNT_ID  } = req.body;
    const config = configFromNetwork(NETWORK);
    const near = await connect(config);
    const account = await near.account(ACCOUNT_ID);
    // Using viewFunction, try to call the contract
    const response = undefined;
    return res.status(200).json(response)
  }
//...
```

**Need some help?** Check out this link!

- [Learn about `viewFunction`](https://near.github.io/near-api-js/classes/account.account-1.html#viewfunction)

{% hint style="info" %}
You can [**join us on Discord**](https://discord.gg/fszyM7K), if you have questions or want help completing the tutorial.
{% endhint %}

Still not sure how to do this? No problem! The solution is below so you don't get stuck.

---

# Solution

```tsx
// solution
//...
  try {
    const { NETWORK, ACCOUNT_ID  } = req.body;
    const config = configFromNetwork(NETWORK);
    const near = await connect(config);
    const account = await near.account(ACCOUNT_ID);
    const response = await account.viewFunction(
        ACCOUNT_ID,
        "get_greeting",
        {account_id: ACCOUNT_ID}
    );
    return res.status(200).json(response)
  }
//...
```

**What happened in the code above?**

- We're calling the `viewFunction` method of our account, passing to it:
  - The `contractId`, which is the same as our account name. This is because the contract has been deployed to our account!
  - The name of the method we want to call, here `get_greeting`
  - The name of the argument expected by `get_greeting`, which is `account_id`.
- Finally, we can send the `response` back to the client-side as JSON.

---

# Make sure it works

Once you have the code above saved, click the button and watch the magic happen:

![](../../../.gitbook/assets/pathways/near/near-getter.gif)

---

# Conclusion

Now, time for the last challenge! Time to modify the state of the contract and thus the state of the blockchain. Let's go!


Get the storage of a smart contract

We won't go through the process of reviewing the smart contract code base, compiling it or testing it. We will focus instead on how one can deploy a smart contract using the `near-js-api`. To do this, we're going to use a pre-compiled smart contract, you can find it under `./contract/near/out/main.wasm`.

Our contract will be pretty basic. It stores a string on the blockchain and implements two functions:

- The `get_greeting` function, which takes an **accountId** and returns the string stored for a specific account.
- The `set_greeting` function, which takes an **accountId** and stores the string for a specific account.

{% hint style="working" %}
If you want to learn more about NEAR smart contracts, you can follow the tutorial [here](https://learn.figment.io/tutorials/write-and-deploy-a-smart-contract-on-near)
{% endhint %}

---

# Challenge

{% hint style="tip" %}
In`pages/api/near/deploy.ts`, implement the default function. Deploy your first smart contract on the **NEAR** testnet. You must replace any instances of `undefined` with working code to accomplish this.
{% endhint %}

**Take a few minutes to figure this out.**

```tsx
//...
  try {
    const { NETWORK, ACCOUNT_ID, SECRET } = req.body;
    const config = configFromNetwork(NETWORK);
    const keypair = KeyPair.fromString(SECRET);

    // Again you will need to set your keystore
    config.keyStore?.undefined;

    const near = await connect(config);
    const account = await near.account(ACCOUNT_ID);

    // Time to deploy the Smart Contract
    const response = undefined;
    return res.status(200).json(response.transaction.hash)
  }
//...
```

**Need some help?**

- [Learn more about `deployContract`](https://near.github.io/near-api-js/classes/account.account-1.html#deploycontract)

{% hint style="info" %}
You can [**join us on Discord**](https://discord.gg/fszyM7K), if you have questions or want help completing the tutorial.
{% endhint %}

Still not sure how to do this? No problem! The solution is below so you don't get stuck.

---

# Solution

```tsx
// solution
//...
  try {
    const { NETWORK, ACCOUNT_ID, SECRET } = req.body;
    const config = configFromNetwork(NETWORK);
    const keypair = KeyPair.fromString(SECRET);
    config.keyStore?.setKey("testnet", ACCOUNT_ID, keypair);
    const near = await connect(config);
    const account = await near.account(ACCOUNT_ID);
    const response = await account.deployContract(fs.readFileSync(WASM_PATH));
    return res.status(200).json(response.transaction.hash);
  }
//...
```

**What happened in the code above?**

- First, we need to _rehydrate_ our `KeyPair` using our secret.
- Next, we're calling the `deployContract` method with the `WASM_PATH` pointing to the location of the compiled smart contract. In this example we are using the JavaScript `fs` core module and the `[readFileSync](https://nodejs.org/api/fs.html#fs_fs_readfilesync_path_options)` method, which is responsible for converting the file into a Buffer so it can be sent to NEAR in the correct format.
- Finally, we can send the transaction hash back to the client-side as JSON.

---

# Make sure it works

Once you have the code above saved, click on **Deploy Contract**

![](../../../.gitbook/assets/pathways/near/near-deploy.gif)

---

# Conclusion

Now that we have deployed a smart contract, let's interact with it. In the following tutorials, we will look at how to use both view and change functions.


Learn how to deploy a Smart Contract on NEAR blockchain

Deploy a smart contract

Our contract is on-chain, and we're going to learn how to modify the message stored in the state of the contract.

{% hint style="working" %}
If you want to learn more about NEAR smart contracts, you can follow the tutorial [here](https://learn.figment.io/tutorials/write-and-deploy-a-smart-contract-on-near)
{% endhint %}

---

# Challenge

{% hint style="tip" %}
In`pages/api/near/setter.ts`, implement the default function. You must replace any instances of `undefined` with working code to accomplish this.
{% endhint %}

**Take a few minutes to figure this out.**

```tsx
//...
  try {
    const { NETWORK, ACCOUNT_ID, SECRET, newMessage } = req.body;
    const config = configFromNetwork(NETWORK);
    const keypair = KeyPair.fromString(SECRET);
    config.keyStore?.setKey("testnet", ACCOUNT_ID, keypair);

    const near = await connect(config);
    const account = await near.account(ACCOUNT_ID);
    // Look at functionCall and pass the expected arguments
    // ... fill here
    return res.status(200).json(response.transaction.hash)
  }
//...
```

**Need some help?** Check out this link!

- [Learn about `functionCall`](https://near.github.io/near-api-js/classes/account.account-1.html#functioncall)

{% hint style="info" %}
You can [**join us on Discord**](https://discord.gg/fszyM7K), if you have questions or want help completing the tutorial.
{% endhint %}

Still not sure how to do this? No problem! The solution is below so you don't get stuck.

---

# Solution

```tsx
// solution
//...
  try {
    const { NETWORK, ACCOUNT_ID, SECRET, newMessage } = req.body;
    const config = configFromNetwork(NETWORK);
    const keypair = KeyPair.fromString(SECRET);
    config.keyStore?.setKey("testnet", ACCOUNT_ID, keypair);

    const near = await connect(config);
    const account = await near.account(ACCOUNT_ID);

    const optionsCall = {
        contractId: ACCOUNT_ID,
        methodName: 'set_greeting',
        args: { message: newMessage }
    }
    const response = await account.functionCall(optionsCall);
    console.log(response)
    return res.status(200).json(response.transaction.hash)
  }
//...
```

**What happened in the code above?**

- We're calling the `functionCall` method of our account, passing to it:
  - The `contractId` which is the same as our account name. This is because the contract has been deployed to our account.
  - The name of the method we want to call, `set_greeting`
  - The name of the argument expected by `get_greeting`, which is `message`.

---

# Make sure it works

Once you have the code above saved, click the button and watch the magic happen:

![](../../../.gitbook/assets/pathways/near/near-setter.gif)

---

# Conclusion

Congratulations! You have successfully created, deployed, and interacted with a smart contract on the NEAR Testnet using DataHub.

While we have only covered a very small area of contract development, you are more than welcome to continue exploration and experiments on your own! Feel free to check out the [**NEAR Developer site**](https://examples.near.org/) for more examples and tutorials.

If you had any difficulties following this tutorial or simply want to discuss NEAR with other developers you can join [our Discord](https://discord.gg/fszyM7K) or head over to our [community forums](https://community.figment.io).


Set Smart Contract's value

Unlike many other Web 3 protocols, NEAR uses a human readable account ID instead of a public key hash. You can link as many `keypairs` to a NEAR account as you want. Here, we're going to learn how to create an account on NEAR.

---

# Challenge

{% hint style="tip" %}
In `pages/api/near/create-account.ts`, implement the default function. You must replace any instances of `undefined` with working code to accomplish this.
{% endhint %}

**Take a few minutes to figure this out**

```typescript
try {
    const { freeAccountId, publicKey, NETWORK } = req.body;
    const config = configFromNetwork(NETWORK);
    const near = await connect(config);
    undefined;
    return res.status(200).json(freeAccountId);
}
```

**Need some help?**

- [`createAccount` method](https://near.github.io/near-api-js/classes/near.near-1.html#createaccount)

{% hint style="info" %}
You can [**join us on Discord**](https://discord.gg/fszyM7K), if you have questions or want help completing the tutorial.
{% endhint %}

Still not sure how to do this? No problem! The solution is below so you don't get stuck.

---

# Solution

```typescript
// solution
try {
    const { freeAccountId, publicKey, NETWORK }  = req.body;
    const config = configFromNetwork(NETWORK);
    const near = await connect(config);
    await near.createAccount(freeAccountId, publicKey);
    return res.status(200).json(freeAccountId);
}
```

**What happened in the code above?**

- First, we need to [destructure](https://dmitripavlutin.com/javascript-object-destructuring/) the values from the request body so that we can use them in our code. We are also specifying a TypeScript type of `AccountReq` here.
- Then we use `configFromNetwork`, passing the `network` from the request body - now we can create a connection, `near`.
- Next, we call the `createAccount` method passing the `freeAccountId` and the `publicKey` from the request body.
- Finally, we can return the name of the account to the client-side as JSON.

---

# Make sure it works

Once the code is complete and the file is saved, Next.js will rebuild the API route.

Now click on **Create Account** and you should see:

![](../../../.gitbook/assets/pathways/near/near-account.gif)

---

# Conclusion

Every new account created on the testnet is given a free **airdrop** of 200 NEAR tokens. So cool!
Ready to move on? Let's check the account balance in the next step.


Create a NEAR account

Unlike many other Web 3 protocols, NEAR uses a human readable account ID instead of a public key hash. You can link as many `keypairs` to a NEAR account as you want. Here, we're going to Learn how to check the availability of a NEAR account name. As you might expect, **figment.testnet** is already taken.

---

# Challenge

{% hint style="tip" %}
In `pages/api/near/check-account.ts`, implement the default function. You must replace any instances of `undefined` with working code to accomplish this.
{% endhint %}

**Take a few minutes to figure this out**

```typescript
  try {
    const { freeAccountId, NETWORK } = req.body
    const config = configFromNetwork(NETWORK);
    const near = await connect(config);
    // Query the account info of freeAccountId
    const accountInfo = undefined
    try {
        undefined;
        return res.status(200).json(false)
    } catch (error) {
        return res.status(200).json(true)
    }
  }
```

**Need some help?** Check out these links

- [The `Account` class](https://near.github.io/near-api-js/classes/account.account-1.html)
- [An explanation of `NEAR Accounts`](https://docs.near.org/docs/concepts/account)
- [RPC `view_account`](https://docs.near.org/docs/develop/front-end/rpc#view-account)

{% hint style="info" %}
You can [**join us on Discord**](https://discord.gg/fszyM7K), if you have questions or want help completing the tutorial.
{% endhint %}

Still not sure how to do this? No problem! The solution is below so you don't get stuck.

---

# Solution

```typescript
// solution
  try {
    const { freeAccountId, NETWORK } = req.body
    const config = configFromNetwork(NETWORK);
    const near = await connect(config);
    const accountInfo = await near.account(freeAccountId);
    try {
        await accountInfo.state();
        return res.status(200).json(false)
    } catch (error) {
        return res.status(200).json(true)
    }
  }
```

**What happened in the code above?**

- First, we create an `Account` object from the `freeAccountId` being passed in the request body.
- Next, we query the state of this object with the `state` method:
  - If it returns `true`, the account exists and we will return a `false` value to the client-side - indicating that the name is unavailable.
  - If `state` returns `false`, the account doesn't exist - so we pass a `true` value back to the client-side, indicating that the name is available. Phew! Little bit of programming logic there.

---

# Make sure it works

Once the code is complete and the file is saved, Next.js will rebuild the API route:

- Choose an account Id.
- Click on **Check it!**
  You should see:

![](../../../.gitbook/assets/pathways/near/near-account.gif)

---

# Conclusion

Great, now that you know how to test the availability of a chosen account name, it's time to create it. Let's do this in the next step!


Learn how to check the validity of a NEAR account

Check the account name

Like with most Web 3 protocols, transactions on NEAR happen between **accounts**. To create an account, one first need to generate a **keypair** which has a **public key** (or **address**, used to identify and lookup an account) and a **private key** used to sign transactions.

------------------------

# Challenge

{% hint style="tip" %}
In `pages/api/near/keypair.ts`, implement `keypair` and retrieve the string formatted representation of the keypair into the variable `secret`. You must replace any instances of `undefined` with working code to accomplish this.
{% endhint %}

**Take a few minutes to figure this out**

```typescript
  try {
    const keypair = undefined;
    const secret = undefined;
    return res.status(200).json(secret);
  } 
```

**Need some help?** Check out those two links
* [The `KeyPair` class](https://near.github.io/near-api-js/modules/utils_key_pair.html)  
* [Retrieve the `secret`](https://near.github.io/near-api-js/classes/utils_key_pair.keypaired25519.html#tostring)

{% hint style="info" %}
You can [**join us on Discord**](https://discord.gg/fszyM7K), if you have questions or want help completing the tutorial.
{% endhint %}

Still not sure how to do this? No problem! The solution is below so you don't get stuck.

------------------------

# Solution

```typescript
// solution
  try {
    const keypair = KeyPair.fromRandom('ed25519');
    const secret = keypair.toString();
    return res.status(200).json(secret);
  } 
```

**What happened in the code above?**

* First, we create a random `keypair` using the `ed25519` cryptographic curve.
* Next, we retrieve the string formatted representation of the `secret` key.

------------------------

# Make sure it works

Once the code is complete and the file is saved, Next.js will rebuild the API route. Now click on **Generate a Keypair** and you should see:

![](../../../.gitbook/assets/pathways/near/near-keypair.gif)

-----------------------------

# Conclusion

Now that we have a keypair, we're going to associate it to an account name. Unlike other blockchains, support for human-readable addresses "out of the box" is possible with NEAR. Before we register an account name however, we need to find out if the name we want is available. Let's go!


Learn how to create a keypair on the NEAR blockchain.

Generate a keypair

In order to transfer some value to another account, we need to sign a transaction to the **network**. **NEAR** provides an abstract class to help us with this: **KeyStore**.

In this tutorial you are going to learn how to set your keystore in order to sign your transfer of tokens.

---

# Challenge

{% hint style="tip" %}
In`pages/api/near/transfer.ts`, implement the function. You must replace any instances of `undefined` with working code to accomplish this. There is a lot to fill here, so be careful!
{% endhint %}

**Take a few minutes to figure this out.**

```tsx
  const {
    txSender,
    txAmount,
    txReceiver,
    NETWORK,
    SECRET,
  } = req.body;

  try {
    const config = configFromNetwork(NETWORK);

    // recreate the keypair from secret
    const keypair = undefined;

    // Set the keystore with the expected method and args
    config.keyStore?.undefined;

    // Here we convert the NEAR into yoctoNEAR using utilities from NEAR lib
    const yoctoAmount = parseNearAmount(txAmount) as string;
    const amount = new BN(yoctoAmount);

    // Fill the Gap: connect, create an Account Object and send some money
    const near = undefined;
    const account = undefined;
    const transaction = undefined;

    return res.status(200).json(transaction.transaction.hash);
  }
//...
```

**Need some help?** Check out these links

- [Manage a `KeyStore` in memory](https://near.github.io/near-api-js/classes/key_stores_in_memory_key_store.inmemorykeystore.html)
- [Check out the `sendMoney()` method](https://near.github.io/near-api-js/classes/account.account-1.html#sendmoney)

{% hint style="info" %}
You can [**join us on Discord**](https://discord.gg/fszyM7K), if you have questions or want help completing the tutorial.
{% endhint %}

Still not sure how to do this? No problem! The solution is below so you don't get stuck.

---

# Solution

```tsx
// solution
//...
  const {
    txSender,
    txAmount,
    txReceiver,
    NETWORK,
    SECRET,
  } = req.body

  try {
    const config = configFromNetwork(NETWORK)
    const keypair = KeyPair.fromString(SECRET)
    config.keyStore?.setKey("testnet", txSender, keypair)

    const yoctoAmount = parseNearAmount(txAmount) as string
    const amount = new BN(yoctoAmount)

    const near = await connect(config)
    const account = await near.account(txSender)
    const transaction = await account.sendMoney(txReceiver, amount)
    return res.status(200).json(transaction.transaction.hash)
  }
//...
```

**What happened in the code above?**

- First, we need to _rehydrate_ our `KeyPair` using our secret.
- Next, we convert the **NEAR** into **yoctoNEAR**, the smallest unit of money on the **NEAR** blockchain.
- Next, create our transaction using the `sendMoney` method, with a receiver and an amount as arguments. This submits the signed transaction to the network, and returns the transaction hash, which is accessible as the `transaction.hash` property of the `transaction` variable.

---

# Make sure it works

Once you have the code above saved:

- Fill in the amount of **NEAR** you want to send to `pizza.testnet`.
- Click on **Submit Transfer**.

![](../../../.gitbook/assets/pathways/near/near-transfer.gif)

---

# Conclusion

Now that we have funded our account and made a transfer, let's move on to deploying some code (known as a "smart contract") to the NEAR blockchain! Ready to take the plunge? Let's go...


Learn how to transfer NEAR from one account to another

Transfer NEAR tokens

# 🧩 DataHub API keys

To make use of the Pathway content, you will require a DataHub account and a valid API key to access NEAR via DataHub's infrastructure.
You will need to [sign up for a DataHub account](https://auth.figment.io/sign_up) and verify your email address.

To use your API key you must create a new file named `.env.local` in the project root directory `/learn-web3-dapp/`, copying the contents of the existing `.env.example` file. Your API key needs to be pasted into `.env.local` so that you can authenticate your connections with DataHub.

Your personal API key can be found on the [**DataHub Services Dashboard**](https://datahub.figment.io/). Click on the **NEAR** icon in the list of available protocols and then copy your key as shown below:

![](../../../.gitbook/assets/pathways/near/near-setup.gif)

You can then paste your personal API key into `.env.local`, as the value for the environment variable `DATAHUB_NEAR_API_KEY`. This will authenticate you and enable you to make JSON-RPC requests to NEAR via DataHub:

![API keys](https://user-images.githubusercontent.com/2707197/136941013-1aad4f17-8f7f-4816-9c7c-acfbe56f93de.png)

---------------------------

{% hint style="info" %}
[**Join us on Discord**](https://figment.io/devchat), if you encounter any issues with the tutorial or have any questions!
{% endhint %}


Let's setup the project to connect & interact with NEAR

Setup the project

After the creation of your account on the **NEAR** testnet, the **NEAR Helper** provides an automatic **airdrop** of 200 **NEAR** tokens. In this tutorial, we're going to check the balance of our account to make sure everything went alright.

---

# Challenge

{% hint style="tip" %}
In `pages/api/near/balance.ts`, implement the default function. You must replace any instances of `undefined` with working code to accomplish this.
{% endhint %}

**Take a few minutes to figure this out**

```typescript
  try {
      const { NETWORK, ACCOUNT_ID } = req.body;
      const config = configFromNetwork(NETWORK);
      const client = await connect(config);
      const account = undefined;
      const balance = undefined;
      console.log(balance)
      return res.status(200).json(balance.available)
  }
```

**Need some help?** Check out these links

- [Basic `NEAR` economics](https://docs.near.org/docs/concepts/gas)
- [The `Account` class](https://near.github.io/near-api-js/classes/account.account-1.html)

{% hint style="info" %}
You can [**join us on Discord**](https://discord.gg/fszyM7K), if you have questions or want help completing the tutorial.
{% endhint %}

Still not sure how to do this? No problem! The solution is below so you don't get stuck.

---

# Solution

```typescript
// solution
  try {
      const { NETWORK, ACCOUNT_ID } = req.body;
      const config = configFromNetwork(NETWORK);
      const client = await connect(config);
      const account = await client.account(ACCOUNT_ID);
      const balance = await account.getAccountBalance();
      return res.status(200).json(balance.available)
  }
```

**What happened in the code above?**

- First, we create an `account` object, representing our account. Pass the `ACCOUNT_ID` as the only argument.
- Next, we call the `getAccountBalance` method, which returns the calculated account balance. The `AccountBalance` type has four properties; `total`, `stateStaked`, `staked` and `available`. A calculated balance might contain some staked NEAR tokens, but right now we haven't got anything staked so don't worry about this.

{% hint style="tip" %}
The amount returned by `getAccountBalance` is denominated in **yoctoNEAR**, so to convert it to **NEAR** you'll need to divide it by 10\*\*24
{% endhint %}

---

# Make sure it works

Once the code is complete and the file is saved, Next.js will rebuild the API route. Click on **Check Balance** and you should see the balance displayed on the page:

![](../../../.gitbook/assets/pathways/near/near-balance.gif)

---

# Conclusion

200 **NEAR** available, hmmm ... More than enough to do our first transfer. In the next tutorial, we're going to buy an imaginary pizza with our testnet NEAR! Transferring tokens is generally done as an exchange for goods or services.


Check the account balance

The ability to establish a connection is the first step for anyone wanting to discover and travel through web3 space. Fasten your seat belt, it's time to take off 🚀!

Connecting to a node works pretty much the same as for a standard web server. There are two actors: Client & server, with a protocol managing how data is transferred from one to the other.

The main difference here is in the protocol. To connect to NEAR, we'll be using `json-rpc`:

- `json`, stands for **J**ava**S**cript **O**bject **N**otation, which is a [text format for transferring data](https://www.w3schools.com/js/js_json_intro.asp).
- `rpc`, stands for **R**emote **P**rocedure **C**all - a way to [call a server-side function](https://en.wikipedia.org/wiki/Remote_procedure_call) from the client-side.

---

# Challenge

{% hint style="tip" %}
In `pages/api/near/connect.ts`, implement `connection` by creating a `Connection` instance and getting the API version. You must replace any instances of `undefined` with working code to accomplish this.
{% endhint %}

**Take a few minutes to figure this out**

```typescript
// Do not forget we're in an "async" world,
// so you may need to "await" some results.
try {
  const config = configFromNetwork(NETWORK);
  const near = undefined;
  const provider = undefined
  const status = undefined;
  return res.status(200).json(status.version.version);
}
```

**Need some help?** Check out those two links

- [Creating a `Connection` instance](https://near.github.io/near-api-js/modules/connect.html)
- [Provider property of `Connection` Class](https://near.github.io/near-api-js/classes/connection.connection-1.html#provider)
- [Status method of `Provider` class](https://near.github.io/near-api-js/classes/providers_json_rpc_provider.jsonrpcprovider.html#status)

{% hint style="info" %}
You can [**join us on Discord**](https://discord.gg/fszyM7K), if you have questions or want help completing the tutorial.
{% endhint %}

Still not sure how to do this? No problem! The solution is below so you don't get stuck.

---

# Solution

```typescript
// solution
try {
  const config = configFromNetwork(NETWORK);
  const near = await connect(config);
  const provider = near.connection.provider;
  const status = await provider.status();
  return res.status(200).json(status.version.version);
}
```

**What happened in the code above?**

- `configFromNetwork` takes the network identifier such as _mainnet_ or _testnet_ and returns a `config` object containing the correct URLs.
- `connect` takes the `config` object and returns an instance of `Near`, which represents the connection.
- `near.connection.provider` returns a `JsonRpcProvider` object allowing us to make JSON-RPC calls to DataHub.
- The `status` method allows us to retrieve the desired information from the properties of the object that it returns.
- Finally, we can send back the `status.version.version` to the client-side as JSON.

---

# Make sure it works

Once the code is complete and the file has been saved, refresh the page to see it update & display the current version.

![](../../../.gitbook/assets/pathways/near/near-connect.gif)

---

# Conclusion

Well done! Your fluency in the NEAR dialect of Web 3 is growing. As a newcomer, building an identity is important so you can distinguish yourself from other users on the NEAR network. Ready to take the next step forward?
