# Part 3: Registering accounts · Asset management system with React and FT4 · Learn Chromia

> Managing assets requires an account. This lesson walks through how the asset management template handles account creation.

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

Asset management system with React and FT4Lesson 12 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/)

12 / 16Module 3: The frontend applicationIntermediate

# Part 3: Registering accounts

Managing assets requires an account. This lesson walks through how the asset management template handles account creation.

To create an account, FT4 provides `registerAccount`.

asset\_management/src/hooks/chromia-hooks.ts

```
import { useCallback, useState } from "react";

import {
  AuthFlag,
  createSingleSigAuthDescriptorRegistration,
  registerAccount,
  registrationStrategy,
} from "@chromia/ft4";
import {
  useEvmKeyStore,
  useFtAccounts,
  usePostchainClient,
} from "@chromia/react";
import { IClient } from "postchain-client";
import { useAccount } from "wagmi";

import { publicClientConfig as clientConfig } from "@/utils/generate-client-config";


export const useChromiaAccount = ({
  onAccountCreated,
}: {
  onAccountCreated?: () => void;
} = {}) => {
  const [isLoading, setIsLoading] = useState(false);
  const [tried, setTried] = useState(false);
  const { address: ethAddress } = useAccount();
  const { data: client } = usePostchainClient({ config: clientConfig });
  const { data: keyStore } = useEvmKeyStore();
  const { mutate, data: ftAccounts } = useFtAccounts({ clientConfig });

  const createAccount = useCallback(async () => {
    try {
      setIsLoading(true);

      if (!ethAddress || !keyStore || !client) return;

      const ad = createSingleSigAuthDescriptorRegistration(
        [AuthFlag.Account, AuthFlag.Transfer],
        keyStore.id,
      );

      await registerAccount(
        client as IClient,
        keyStore,
        registrationStrategy.open(ad),
      );

      await mutate();

      onAccountCreated?.();
    } catch (e) {
      console.error(e);
    } finally {
      setIsLoading(false);
      setTried(true);
    }
  }, [client, ethAddress, keyStore, mutate, onAccountCreated]);

  return {
    createAccount,
    isLoading,
    tried,
    account: ftAccounts?.[0],
    hasAccount: !!ftAccounts?.length,
  };
};
```

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

[← Previous**Part 2: Tools for Chromia development**](https://chromia.com/learn/ft4-demo-app/module-frontend-application/tools/)[Next →**Part 4: Registering and minting**](https://chromia.com/learn/ft4-demo-app/module-frontend-application/register-and-mint/)
