Building APIs for Generative AI. Developer setup and best practices.
O'Reilly Super Stream | July 2024
Natalia Venditto
microfrontend.dev - @anfibiacreativa
Image credit DALLE3
Principal Owner JavaScript DX, Azure
Once upon a time, developers built APIs for the web.
© DallE 3
Today, developers build APIs for the web -and AI-.
ML/DATA PROFESSIONALS
WEB DEVELOPERS
Who understand AI and have been working with it and different models for a long time.
Backend and frontend developers that must integrate AI in their workloads.
!==
WEB DEVELOPERS
Backend and frontend developers that must integrate AI in their workloads.
Where to start
Application Design
microfrontend.dev - @anfibiacreativa
Lorem ipsum
Lorem ipsum
Lorem ipsum
Lorem ipsum
Lorem ipsum
EFFECTIVE APPLICATION DESIGN IS COMPOSABLE AND API-CENTRIC
A green field or brown field web application, will more likely succeed and demand more effort to integrate with AI -and other emerging technologies- when it's API-First at its core.
AI MODELS
USE-CASE
TECH STACK
DESIGN
Understanding the use-case in depth.
microfrontend.dev - @anfibiacreativa
Designing the user interface and the API specification on top of it.
Selecting the tech-stack including the frameworks and middleware and the database model
>>>
>>>
Web Development
USE-CASE
MODEL/PATTERN
DESIGN
Understanding the use-case in depth, is of higher priority than it ever was.
microfrontend.dev - @anfibiacreativa
Designing the user interface and the API specification on top of it.
Defines whether retrieval is based on text similarity or vector representation.
ORCHESTRATOR
Tech-stack and frameworks to orchestrate, offer the ability to reduce the effort in API development.
Web Development + AI
The process
Business Automation
Customer Support
Personalization
Analytics
Other...
High level use-cases
Customer Support
API/Model
Language/Framework
Pattern
CHAT BOT
COMPLETIONS/GPT 4O
RAG
TS/LANGCHAIN.JS
Building blocks*
excluding deployment infrastructure and pipelines
API/Model
COMPLETIONS/GPT 4O
Retrieval
Embeddings
Data Sources
The model in depth
Tools
eg: Function Calling
DATASET
Response
Retriever
SELECTS RELAVANT PASSAGES
FORMULATES RESPONSE
microfrontend.dev - @anfibiacreativa
DATASET
Response
Retriever
SELECTS RELAVANT PASSAGES
FORMULATES RESPONSE
microfrontend.dev - @anfibiacreativa
Message Processing API
User Interaction API
Model Interaction API
Knowledge Base Retrieval API
Embeddings API
User input and chatbot responses
Messages routing and preprocessing
Interactions with the GPT model deployed to a service
Information retrieval from a knowledge base
Embeddings generation and management
Custom APIs
Message Processing API
User Interaction API
Model Interaction API
Knowledge Base Retrieval API
Embeddings API
User input and chatbot responses
Messages routing and preprocessing
Interactions with the GPT model deployed to a service
Information retrieval from a knowledge base
Embeddings generation and management
SDK
Orchestrator
An API contracts helps us swap between
- local and remote models
- different languages and orchestrators
microfrontend.dev - @anfibiacreativa
microfrontend.dev - @anfibiacreativa
User Interaction API
User input and chatbot responses
The Chat App Protocol as example
A collection of types and functionality as a contract for Chat Applications.
Go to app code demo, swapping backends.
Patterns
Versioning
Spec authoring
Multiple protocols
Diagnostics
API challenges
Extensibility
Go to generating an API with TypeSpec demo.
TypeSpec
A framework to describe API shapes using declarations, interfaces, models, decorators, enums, unions, type literals, and other entities idiomatic to TypeScript developers, to emit contracts and specifications.
Thank you!
@anfibiacreativa - https://www.microfrontend.dev
Learn more
All images except those that credited to Unsplash and respective author, were generated with Bing Image Generator.