# Part 1: Prepare the frontend application · Asset management system with React and FT4 · Learn Chromia

> Work from the frontend application's root folder, the one that contains package.json.

Source: https://chromia.com/learn/ft4-demo-app/module-frontend-application/setup/

Asset management system with React and FT4Lesson 10 of 16

1. [01Create an asset management system using FT4](https://chromia.com/learn/ft4-demo-app/introduction/)

Module 1: Initialize the full-stack application

1. [02Overview](https://chromia.com/learn/ft4-demo-app/module-init/)
2. [03Prepare the full-stack application](https://chromia.com/learn/ft4-demo-app/module-init/setup-application/)

Module 2: The blockchain dapp

1. [04Overview](https://chromia.com/learn/ft4-demo-app/module-blockchain/)
2. [05Part 1: Set up the blockchain dapp](https://chromia.com/learn/ft4-demo-app/module-blockchain/setup/)
3. [06Account management](https://chromia.com/learn/ft4-demo-app/module-blockchain/account-management/)
4. [07Asset Registration and Minting](https://chromia.com/learn/ft4-demo-app/module-blockchain/asset-registration/)
5. [08Test the asset management system](https://chromia.com/learn/ft4-demo-app/module-blockchain/test/)

Module 3: The frontend application

1. [09Overview](https://chromia.com/learn/ft4-demo-app/module-frontend-application/)
2. [10Part 1: Prepare the frontend application](https://chromia.com/learn/ft4-demo-app/module-frontend-application/setup/)
3. [11Part 2: Tools for Chromia development](https://chromia.com/learn/ft4-demo-app/module-frontend-application/tools/)
4. [12Part 3: Registering accounts](https://chromia.com/learn/ft4-demo-app/module-frontend-application/account-regisration/)
5. [13Part 4: Registering and minting](https://chromia.com/learn/ft4-demo-app/module-frontend-application/register-and-mint/)
6. [14Part 5: Burning tokens](https://chromia.com/learn/ft4-demo-app/module-frontend-application/burn/)
7. [15Part 6: Transferring assets](https://chromia.com/learn/ft4-demo-app/module-frontend-application/transfer/)
8. [16Part 7: Deploying onchain](https://chromia.com/learn/ft4-demo-app/module-frontend-application/deploy-onchain/)

[Learn](https://chromia.com/learn/)[Asset management system with React and FT4](https://chromia.com/learn/ft4-demo-app/)

10 / 16Module 3: The frontend applicationIntermediate

# Part 1: Prepare the frontend application

Work from the frontend application's root folder, the one that contains `package.json`.

### Install dependencies

Install every required package with pnpm:

bash

```nolines
pnpm install
```

### Configure the environment

Copy `.env.example` to a new `.env` file, then set the correct values:

bash

```nolines
NEXT_PUBLIC_NODE_URL=http://localhost:7740
NEXT_PUBLIC_BRID=<Your_BRID_for_the_Dapp>
```

* `NEXT_PUBLIC_NODE_URL` – the address of the Chromia blockchain node.
* `NEXT_PUBLIC_BRID` – the BRID of your dapp, whether it runs locally or on a remote node.

#### Running the application

With the dependencies installed and `.env` configured, start the application locally:

bash

```nolines
pnpm dev
```

Open http://localhost:3000 to use the app.

Written for this site from Chromia’s public course. Code samples are the course’s own.

[← Previous**Module 3: The frontend application**](https://chromia.com/learn/ft4-demo-app/module-frontend-application/)[Next →**Part 2: Tools for Chromia development**](https://chromia.com/learn/ft4-demo-app/module-frontend-application/tools/)