Cloud Development in Codespace

GitHub Codespaces is a cloud-based development environment that enables you to develop your code directly in the cloud. It's an excellent option for building your Nyra agent without the need to configure a local development setup. You don’t require a high-end machine or a strong network connection. This guide will walk you through the process of setting up a development environment for Nyra Agent using GitHub Codespaces.

Step 1: Create a Codespace with the Nyra-Agent repository

Navigate to the Nyra-Agent GitHub repository and click the "Code" button. Then, select "Open with Codespaces." GitHub will create a new Codespace for you in a separate browser tab. The initial setup of a Codespace may take a few minutes.

Step 2: Start working with Codespace

Once the Codespace is set up, the VSCode editor will appear in your browser, providing a seamless development environment for the Nyra-Agent repository. From there, you can open the terminal, create new files, and execute commands as you would in a local setup.

The process closely follows the steps outlined in the Quick Start guide. However, with Codespaces, there’s no need to run the docker-compose up command. You can begin building your agent directly using:

# Prepare .env file from .env.example and set your api keys inside it
cp ./env.example .env
# Build the agent after finish key configurations
task use

And once successfully built, you can run following command to start server,

task run

Step 3: Start Front-end UI

Since we’re not using Docker Compose with Codespaces, you'll need to start the front-end UI separately. To do this, simply run the following command in the terminal:

cd playground
pnpm install
pnpm dev

This will start the front-end UI at localhost:3000.

Step 4: Access your remote setup

This step is specific to Codespaces. Codespaces automatically generates a URL for each exposed port. To access the URL, click on the "Ports" tab in the bottom left corner of the Codespace window.

Ports

By default, all ports are set to private. To make a port public, right-click on it and select "Port Visibility." Once set to public, you can access the URL in your browser to view the front-end UI. For example, right-click on the visibility column for port 3000 and change its setting to public.

Change Visibility

You can now access the front-end UI using the URL generated by Codespaces. Locate the "Forwarded Address" column for port 3000, click on the URL, and your browser will open a new tab displaying the front-end UI.

Forwarded Access

Congratulations! You’ve now configured a cloud-based development environment for Nyra Agent using GitHub Codespaces. You can start developing and testing your agent directly in the cloud, with an experience that mirrors your local VSCode setup for debugging and development. This streamlined process eliminates the need for complex local configurations.