Agentica Guide Documents

Introduction

This tutorial explains how to create an Agent using Agentica in React Native to check battery status.

Examples

Prerequisites

Node.js (>=18)
iOS/Android development environment setup (Simulator)
- JDK Version (= 17)

Project Setup

First, create a React Native project. We’ll use the Agentica CLI to get started.


npx agentica@latest start

During the project creation process, you’ll need to configure the following:

Project name
Package Manager selection (npm, yarn, or pnpm)
Project Type: Select React Native
OpenAI API key setup

Generated Code Overview

The generated code is as follows:

App.tsx

App.tsx is the main file containing Agentica configuration.

shim.ts

The shim.ts file is a polyfill file required for using OpenAI and Agentica. It must always be imported first.

controller/battery.ts


import {IAgenticaController} from '@agentica/core';
import * as Battery from 'expo-battery';
import typia from 'typia';
 
export const BatteryController: IAgenticaController = {
  protocol: 'class',
  name: 'battery',
  execute: async props =>
    (Battery as any)[props.function.name](props.arguments),
  application: typia.llm.application<
    Pick<
      typeof Battery,
      'getBatteryLevelAsync' | 'getBatteryStateAsync' | 'getPowerStateAsync'
    >
  >(),
};

Provides battery-related information retrieval functionality
Implemented using the expo-battery package
Can retrieve battery level, status, power state, and other information

Use Case Example

Imagine asking the agent:

“What is the battery level of my phone?”

The agent will process your query by retrieving the battery level of your phone.

Controller Development Guide

With Agentica, you can easily add any functionality you can think of! (Even if it’s only available in Native). To add your own functionality to Agentica, follow these steps:

First, define the function for the functionality you want to implement. When writing functions, they must follow this format:

Functions must have exactly one parameter
The parameter must be an Object type
Detailed JS Doc must be written. This JS Doc is used by the AI to select and execute functions
Function parameters can only use basic JSON types (Native Classes like Date, Error are not supported)
Using typia.tag to structure Parameter Types can provide more detailed information to the LLM

Here’s an example code. You can include any code that can run in a React Native environment.


/**
 * A basic calculator that performs addition and subtraction operations.
 */
namespace Calculator {
  /**
   * Parameters for addition operation
   */
  interface AddProps {
    /**
     * First number to add
     */
    a: number;
    /**
     * Second number to add
     */
    b: number;
  }
 
  /**
   * Parameters for subtraction operation
   */
  interface SubProps {
    /**
     * Number to subtract from
     */
    a: number;
    /**
     * Number to subtract
     */
    b: number;
  }
 
  /**
   * Adds two numbers together.
   * @returns The sum of two numbers
   */
  export function add(props: AddProps): number {
    return props.a + props.b;
  }
 
  /**
   * Subtracts the second number from the first number.
   * @returns The result of subtracting the second number from the first number
   */
  export function sub(props: SubProps): number {
    return props.a - props.b;
  }
}

You need to declare the Controller to apply it to Agentica.


export const CalculatorController: IAgenticaController = {
  protocol: 'class',
  name: 'calculator',
  execute: async props =>
    (Calculator as any)[props.function.name](props.arguments),
  application: typia.llm.application<typeof Calculator>(),
};

Finally, go to App.tsx and apply your created Controller. That’s it!


new MicroAgentica({
  vendor: {
    /**
     * @warning
     * This template is a proof-of-concept template created to demonstrate whether Agentica can call native features.
     * To use this in a production environment, architectural modifications are required to properly secure the OpenAI Key.
     */
    api: new OpenAI({
      apiKey: process.env.OPENAI_API_KEY,
      dangerouslyAllowBrowser: true,
    }),
    model: 'gpt-4o',
  },
  controllers: [CalculatorController], // Insert CalculatorController. 
});

Start the development server and try chatting with Agentica! Agentica will call your created Controller based on the situation.