Introduction to AI Product Development

Picking the stack - Navigating JavaScript and Python

Designing a Hybrid Web Application Architecture with JavaScript and Python

Streaming events with Server-Sent Events and WebSockets

System Design for AI applications

Discovering the OpenAI Completion API

Handling Server-Sent Events with JavaScript

Building the useCompletion hook

Rendering Completion Output

Mocking Streams

Testing the useCompletion hook

Building the Front-End

Creating a FastAPI server

Exploring asynchronous programming in Python

Integrating Langchain with FastAPI for Asynchronous Streaming

Testing with PyTest and LangChain

Building the Backend

Building the useChat hook

Building the User Interface

Building a Chat

Discovering Retrieval Augmented Generation

Building a Semantic Search Engine with Chroma

Adding Retrieval-Augmented Generation to the chat

Implementing Retrieval Augmented Generation

Final words

Conclusion

Exploring AI Agents - Toward Autonomous Systems

Building an Asynchronous Event-Driven Service Using Context Variables

Adding Tools To The Chat

Building a Generative UI

Building an Agent

Join us as we dive into the world of AI-powered streaming text and chat UIs using TypeScript and Python. 

Large Language Models (LLMs) are revolutionizing various industries, but creating simple demos in notebooks or with tools like Gradio is not enough. To truly harness the potential of these models, we need to build sophisticated, real-world applications.

Our comprehensive course is structured into six detailed modules where you will:
- Develop a dynamic front-end with React.
- Integrate FastAPI with LangChain to create a robust backend.
- Utilize Server-Sent Events (SSE) for seamless real-time data streaming.

This comprehensive course comes packed with valuable extras:
- The complete source code under MIT licence
- Exclusive access to our community forum
- Detailed exploration of Retrieval-Augmented Generation (RAG) for enhancing model responses
- Hands-on experience with developing intelligent agents capable of maintaining context in conversations

Taught by [Louis Sanna](https://www.linkedin.com/in/louis-sanna-0168363a/), a seasoned Tech Lead with expertise in GenAI applications and digital transformation projects for major organizations like UNESCO and Renault. His deep industry insights and practical experience will guide you from basics to advanced implementations.

**Preview the Application:**
Experience the power of what you'll build firsthand. Try out the demo app we will develop during the course:
[The Demo App](https://build-ai-driven-web-applications.vercel.app/)

Enroll now and start building transformative AI-powered applications that streamline communication and enhance user engagement!

Streamline AI Communication with TypeScript and Python

Large Language Models are reshaping industries, yet integrating them into real-time, streaming UIs presents unique challenges. In this course we build AI-powered streaming text and chat UIs with TypeScript and Python. Go step-by-step through building a full-stack AI application with quality code and very flexible implementation.

It includes:
- a completion use-case (english to emojis)
- a Chat
- a Retrieval Augmented Generation use-case
- Agent Use-Cases (code execution, data-Analyste agent)

This app can be used as a starting point in most projects, saving a huge amount of time, and its flexibilty allows new tools to be added as needed.

Building AI-Powered Streaming Text and Chat UIs

An interactive AI-powered chat application with real-time responses

A Retrieval Augmented Generation (RAG) system to enhance AI responses with external knowledge

An AI agent capable of using tools to solve a tasks

An AI-assisted code generation and explanation system

An assistant capable of performing data analysis tasks

How to stream the answer of a Large Language Model

Differences between Server-Sent Events and WebSockets

What problems Retrieval Augmented Generation can solve

In this lesson, you will understand how to implement a semantic search engine using the Chroma vector database, focusing on loading, processing, vectorizing, and retrieving documents.

Chroma is a vector database optimized for edge AI applications. It allows for storing not just documents but their associated vector representations, facilitating rapid and scalable semantic searches.

There are many different vector databases available. Here are three notable examples:

 Chroma operates directly in-memory, ideal for fast development and simple deployment. See 

 A fully managed solution that handles scalability and maintenance automatically, making it an excellent choice for businesses that prefer not to manage their infrastructure. See 

 Open source vector database written in Rust. It the flexibility to deploy your own instance, making it a good option for those who need custom configurations or want to maintain control over their deployment environment. See 

In the following script we will realize the following task:

 The script starts by retrieving PDF files, from which text is extracted. The text is then divided into smaller segments or "chunks" that are manageable for processing. This chunking is necessary because processing large text files in one go can exceed the memory limits of the model used for generating embeddings.

---
title: Building a Semantic Search Engine with Chroma
isPublicLesson: true
privateVideoUrl: https://stream.mux.com/WoBLhq7z5Xc3WIImVcjDasUHmSngozCVNRFb013BL3YA.m3u8
---

# Building a Semantic Search Engine with Chroma

In this lesson, you will understand how to implement a semantic search engine using the Chroma vector database, focusing on loading, processing, vectorizing, and retrieving documents.

### Building the index

Chroma is a vector database optimized for edge AI applications. It allows for storing not just documents but their associated vector representations, facilitating rapid and scalable semantic searches.

:::info Vector Databases

There are many different vector databases available. Here are three notable examples:

**Chroma:** Chroma operates directly in-memory, ideal for fast development and simple deployment. See <https://www.trychroma.com/>

**Pinecone:** A fully managed solution that handles scalability and maintenance automatically, making it an excellent choice for businesses that prefer not to manage their infrastructure. See <https://www.pinecone.io/>

**Qdrant:** Open source vector database written in Rust. It the flexibility to deploy your own instance, making it a good option for those who need custom configurations or want to maintain control over their deployment environment. See <https://qdrant.tech/>
:::

In the following script we will realize the following task:

**Document Loading and Parsing:** The script starts by retrieving PDF files, from which text is extracted. The text is then divided into smaller segments or "chunks" that are manageable for processing. This chunking is necessary because processing large text files in one go can exceed the memory limits of the model used for generating embeddings.

**Adding Metadata:** As the documents are parsed, relevant metadata is attached to each chunk. This metadata includes details such as the name of the document, the specific page numbers, and any available URLs. This enriches the data chunks with contextual information that can be useful during retrieval and analysis.

**Index Building:** Finally, the chunks, now converted into vectors through an embedding function, are stored in a vector database. The vectors represent the semantic content of the text chunks, enabling efficient and accurate retrieval based on semantic similarity rather than just keyword matching. This database can then be queried to find the most relevant document chunks in response to search queries.

```python
import os
import shutil

from langchain_text_splitters import RecursiveCharacterTextSplitter
from langchain_community.vectorstores import Chroma
from langchain_openai import OpenAIEmbeddings
from langchain_community.document_loaders import PyPDFLoader
from langchain_community.vectorstores import Chroma

PERSIST_DIRECTORY = "./chroma_db"

from .vectorstore import PERSIST_DIRECTORY, get_vectorstore

MIN_CHUNK_SIZE = 100


def load_data():
    print("Loading data...")
    docs = parse_data()
    print("Documents loaded")
    embedding_function = OpenAIEmbeddings()
    print("Building index...")
    vectorstore = get_vectorstore(embedding_function)

    assert isinstance(vectorstore, Chroma)
    vectorstore.from_documents(
        docs, embedding_function, persist_directory=PERSIST_DIRECTORY
    )
    print("Index built")
    return vectorstore

Learn

The newline Guide to Building Your First GraphQL Server with Node and TypeScript

Teach

Amelia Wattenberger

Author of Fullstack D3

Community

Building AI-Powered Streaming Text and Chat UIs

Module 1: System Design for AI applications

Introduction:

Start Here

Introduction: (3:47)

Introduction to AI Product Development

Lesson 1: (6:09)

Picking the stack - Navigating JavaScript and Python

Lesson 2: (5:07)

Designing a Hybrid Web Application Architecture with JavaScript and Python

Lesson 3: (6:30)

Streaming events with Server-Sent Events and WebSockets

Module 2: Building the Front-End

Lesson 1: (6:29)

Discovering the OpenAI Completion API

Lesson 2: (6:13)

Handling Server-Sent Events with JavaScript

Lesson 3: (7:00)

Building the useCompletion hook

Lesson 4: (1:25)

Rendering Completion Output

Lesson 5: (3:28)

Mocking Streams

Lesson 6: (3:10)

Testing the useCompletion hook

Module 3: Building the Backend

Lesson 1: (1:54)

Creating a FastAPI server

Lesson 2: (3:41)

Exploring asynchronous programming in Python

Lesson 3: (4:33)

Integrating Langchain with FastAPI for Asynchronous Streaming

Lesson 4: (1:01)

Testing with PyTest and LangChain

Module 4: Building a Chat

Lesson 1: (5:11)

Building the useChat hook

Lesson 2: (1:52)

Building the User Interface

Module 5: Implementing Retrieval Augmented Generation

Lesson 1: (3:18)

Discovering Retrieval Augmented Generation

Lesson 2: (3:36)

Building a Semantic Search Engine with Chroma

Lesson 3: (2:13)

Adding Retrieval-Augmented Generation to the chat

Module 6: Conclusion

Lesson 1: (1:21)

Final words

Module 7: Building an Agent

Lesson 1: (3:22)

Exploring AI Agents - Toward Autonomous Systems

Lesson 2: (5:24)

Building an Asynchronous Event-Driven Service Using Context Variables

Lesson 3: (5:38)

Adding Tools To The Chat

Lesson 4: (4:04)

Building a Generative UI

Building a Semantic Search Engine with Chroma