> For the complete documentation index, see [llms.txt](https://docs.jamaibase.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.jamaibase.com/developer-reference/framework-integration/nlux-frontend-only.md).

# NLUX (Frontend Only)

Want to get started quickly? Check out this frontend only example! They're the fastest way to see the SDK in action. However, these examples are meant for testing and exploration only. In a real application, it's important to protect your API key. We'll show you how to do that in our secure setup guide.

## 1. Create Chat Agent

* Create **Project**

<figure><img src="/files/5M9oiKI0E3n5r3G7VQS8" alt=""><figcaption></figcaption></figure>

* Create a **Chat Agent** at **Project >  Chat Table > New Agent**
* Configure your agent. You can define the following parameters.

| Parameter     | Description                                          |   |
| ------------- | ---------------------------------------------------- | - |
| Agent ID      | Name of Agent                                        |   |
| Model         | LLM model                                            |   |
| Temperature   |                                                      |   |
| Max tokens    |                                                      |   |
| Top-p         |                                                      |   |
| System Prompt | Define the persona of the model                      |   |
| User message  | Define the conversational opener between User and AI |   |
| AI response   | Define the conversational opener between User and AI |   |

<figure><img src="/files/O9sUNKzI0QIYkkAHWanv" alt=""><figcaption></figcaption></figure>

## 2. Get the following information to start using JamAIBase

* Get the **Agent ID.**
* Get the **Project ID**.

<figure><img src="/files/fCTA3D88NegoHPgQt4zk" alt=""><figcaption></figcaption></figure>

* Create **JamAI API Key** at **Organization > Secrets > Create API Key.**

<figure><img src="/files/00s4EbZhIkZer0XMsuoY" alt=""><figcaption></figcaption></figure>

## 3. Clone the Chatbot Example

```bash
git clone https://github.com/EmbeddedLLM/jamaibase-cookbook

# example is at https://github.com/EmbeddedLLM/jamaibase-cookbook/tree/main/quickstart/nlux/0001-chat-with-jamai-agent
```

## 4. Update the App.tsx

```typescript
...
const baseURL = "https://api.jamaibase.com";
const apiKey = "<jamaibase-api-key";
const projectId = "<jamaibase-project-id>";
const agentId = "<your-agent-id";
...

```

## 5. Start app

```bash
cd jamaibase-cookbook/quickstart/nlux/0001-chat-with-jamai-agent
npm install
npm run dev
```

* Open up your app at <http://localhost:5173> .&#x20;

## 6. Manage and View Conversation Histories in Chat Table

<figure><img src="/files/xATv5QkXuj23YO1Mggw1" alt=""><figcaption></figcaption></figure>


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.jamaibase.com/developer-reference/framework-integration/nlux-frontend-only.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.