system-prompts-and-models-o.../README.md
google-labs-jules[bot] 53eb589c46 feat: Create full-stack AI coding agent
This commit introduces a new full-stack AI coding agent application.

The application is built with a monorepo structure, containing both the frontend user interface and the backend logic.

Key features:
- Frontend: A modern, responsive chat interface that provides real-time streaming responses.
- Backend: The core logic that allows me to process your requests and formulate my responses.
- Persona: The initial programming that establishes my identity as "Jules," your expert AI pair programmer.
- Configuration: The project is fully configured for local development and easy deployment.
- Documentation: A comprehensive README.md provides instructions for setup, configuration, and deployment.
2025-08-02 13:43:22 +00:00

2.6 KiB

Full Stack AI Coding Agent

This project is a full-stack AI coding agent built with the following technologies:

  • Frontend: Vite, React, TypeScript, Tailwind CSS
  • Backend: Serverless Functions (for Vercel), TypeScript
  • AI: Google Gemini Pro

This agent is inspired by the collection of system prompts and tool definitions found in this repository.

Project Structure

This project is a monorepo using npm workspaces.

  • packages/frontend: The Vite/React frontend application.
  • packages/backend: The serverless backend.
    • packages/backend/api: Contains the serverless function for Vercel.

Getting Started

Prerequisites

  • Node.js (v18 or later)
  • npm (v8 or later)
  • A Google Gemini API Key

1. Get a Gemini API Key

  1. Go to the Google AI Studio.
  2. Sign in with your Google account.
  3. Click on "Get API key".
  4. Create a new API key.
  5. Copy the key and keep it safe.

2. Clone the Repository

git clone https://github.com/your-username/your-repo-name.git
cd your-repo-name

3. Install Dependencies

npm install

4. Set Up Environment Variables

When deploying to Vercel, you will need to set this environment variable in the Vercel project settings. You do not need a .env file for local development, as the frontend and backend are served from the same origin.

5. Running the Development Server

This command will start the Vite development server for the frontend.

npm run dev

The frontend will be available at http://localhost:5173. The backend serverless function will be available at http://localhost:5173/api.

Deployment to Vercel

  1. Push to GitHub: Create a new repository on GitHub and push your code.

  2. Import to Vercel:

    • Go to your Vercel dashboard.
    • Click on "Add New... > Project".
    • Import your GitHub repository.
  3. Configure the Project:

    • Framework Preset: Vercel should automatically detect that this is a Vite project.
    • Root Directory: Make sure the root directory is set to packages/frontend.
    • Build and Output Settings: These should be configured automatically by the Vite preset.
    • Environment Variables:
      • Go to the "Settings" tab of your new Vercel project.
      • Click on "Environment Variables".
      • Add a new variable with the name GEMINI_API_KEY and the value of your API key.
  4. Deploy: Click the "Deploy" button.

Vercel will build and deploy your application. The serverless function in packages/backend/api will be automatically deployed as well.

This README was generated by Jules, an AI assistant.