README.md

AI PDF Inquire Fullstack

React Frontend with LLamaIndex Integration - Retrieval-augmented generation (RAG) App for AIPlanet Assignment.

https://aipdfinquire.netlify.app/ - Online Hosted

Frontend Hosted on Netlify and backend on Keyobe. Allows almost all functionallity.

Keyobe Branch altered for hosting, Main branch for local hosting and development.

Hosted FastAPI endpoints found here :

https://occasional-tandi-faustogenga-29fab5df.koyeb.app/docs

Video Demostration : https://drive.google.com/file/d/1jCAzgZMkt0bYi8UMVkz5jwiH5wbIRXw-/view?usp=sharing

This project demonstrates the integration of a React frontend with a backend server built with FastAPI. It includes features such as uploading PDF files, querying text from PDFs using AI, and managing chat interactions.

Table of Contents

• Overview
• Features
• Setup
  • Frontend Setup
  • Backend Setup
• Usage
• File Structure
• Project Outline
  • Backend Specification
  • Frontend Specification
• Contributing
• License

Overview

Developed the AI PDF Inquire Fullstack application, integrating a React frontend with a FastAPI backend to enable AI-driven PDF querying. Leveraged LLamaIndex for Retrieval-Augmented Generation (RAG) and natural language processing, allowing users to upload PDFs and interact with the content through AI. The project features a user-friendly chat interface and robust error handling. Hosted the frontend on Netlify and the backend on Koyeb, demonstrating expertise in full-stack development, RESTful APIs, and AI integration.

Features

• Upload PDF files
• Extract text content from uploaded PDFs
• Chat interface with a chatbot
• Clear uploaded PDFs and chat messages

Setup

Frontend Setup

1. Clone this repository.
2. Navigate to the react_frontend directory.
3. Install dependencies:

   npm install

4. Start the development server:

   npm start

Backend Setup

1. Navigate to the backend directory.
2. Create a virtual environment:

   python -m venv venv

3. Activate the virtual environment:
   • On Windows:

     venv\Scripts\activate

   • On macOS and Linux:

     source venv/bin/activate

4. Install dependencies:

   pip install -r requirements.txt

5. Start the FastAPI server:

   uvicorn main:app --reload

Usage

• Access the React frontend at http://localhost:XXXX.
• Access the FastAPI backend at http://localhost:8000.
• Access the FastAPI docs at http://localhost:8000/docs.

Change the origins in the main.py, adding your localhost from Vite.

origins = [ "http://localhost:5173", # Your frontend local development URL from Vite # Add more origins as needed ]

File Structure

react_frontend/    # React frontend directory
  ├── public/       # Public assets and index.html
  ├── src/          # React source files
  └── ...

my_app/           # FastAPI backend directory
  ├── main.py      # FastAPI application
  └── ...

Project Outline

Backend Specification

FastAPI Endpoints

• Upload PDF Endpoint: An endpoint for uploading PDF documents.
• Query Endpoint: An endpoint for receiving questions and returning answers based on the uploaded PDFs.

PDF Processing

• Text Extraction: Extract text from uploaded PDFs using a suitable library
• NLP Processing: Use the LLamaIndex to process natural language questions and generate answers based on the PDF content.

Data Management

• Metadata Storage: Store information about uploaded documents (e.g., filename, upload date) in a database.

Frontend Specification

User Interface

• Upload PDF: A page for uploading PDF documents.
• Question Interface: A feature for asking questions on uploaded documents and viewing answers.

Interactivity

• Feedback Mechanisms: Implement feedback mechanisms while uploading documents and processing questions.
• Error Handling: Display error messages for unsupported file types or processing errors.
• Clear Chats: Allows users to delete indexes and documents uploaded in the backend from the interface.