Tutorial part 4: Build an API and web app¶
In this tutorial, you wrap your Foundry agent in a FastAPI backend, build a React chat UI, run both locally, and deploy to Azure App Service.
Prerequisites: Tutorial part 3 completed, Python 3.10+, Node.js 18+
Skills¶
Run these skills in Copilot Chat:
| Skill | What it does |
|---|---|
/miq-4a-create-api |
Build a FastAPI backend with a streaming chat endpoint |
/miq-4b-create-webapp |
Build a React and TypeScript chat UI |
/miq-4c-run-locally |
Run the API and web app on your local machine |
/miq-4d-deploy-to-azure |
Deploy both services to Azure App Service |
What's happening in this module
Create API -- A FastAPI backend exposes a streaming /api/chat endpoint using Server-Sent Events.
Create web app -- A React and TypeScript chat UI consumes the streaming API.
Run locally -- Both services run on your machine so you can test end to end before deploying.
Deploy to Azure -- The API and web app are deployed to Azure App Service with managed identity for secure access to AI services.
Supporting documentation¶
- FastAPI documentation
- Server-Sent Events (MDN)
- React documentation
- Azure App Service overview
- Managed identity for App Service
- Deploy a Python web app to Azure
Next steps¶
Continue to Tutorial part 5: Add network isolation.