DevAI Learning Hub

An interactive learning website covering Docker, AI Agents, and MLOps — built as a full-stack project to demonstrate the very technologies it teaches.

---

What's inside

• 3 learning modules — Docker fundamentals, AI Agents (ReAct, tool use, MCP), and MLOps pipelines
• Interactive quiz — questions served from a FastAPI backend; correct answers never exposed in the frontend
• Progress tracker — bars update as you answer correctly
• Syntax-highlighted code examples — Dockerfile, compose.yaml, Python agent, MLflow training script
• Fully containerized — the project runs itself inside Docker, demonstrating the concepts it teaches

---

Tech stack

Layer	Technology
Frontend	Vanilla HTML, CSS, JavaScript
Web server	nginx:alpine
Backend API	Python 3.11 + FastAPI + uvicorn
Containerization	Docker + Docker Compose

---

Project structure

devai-learning-hub/
├── compose.yaml          # wires frontend + backend together
├── frontend/
│   ├── Dockerfile        # nginx serving the static site
│   ├── nginx.conf        # reverse-proxies /api/ to the backend
│   └── index.html        # the full learning hub (HTML/CSS/JS)
└── backend/
    ├── Dockerfile        # multi-stage Python build
    ├── requirements.txt
    └── app/
        ├── main.py       # FastAPI routes
        └── data.py       # quiz questions (answers stay server-side)

---

Getting started

Requirements

• Docker Desktop (includes Docker Compose)

Run

git clone https://github.com/eahg1/devai-learning-hub.git
cd devai-learning-hub
docker compose up --build

Open http://localhost:8080 in your browser.

Stop

docker compose down

---

API endpoints

The FastAPI backend is accessible through nginx at http://localhost:8080/api/.

Method	Endpoint	Description
GET	/api/health	Health check
GET	/api/quiz	All quiz questions (no correct answers)
POST	/api/quiz/check	Submit an answer, receive result + feedback

Interactive API docs available at http://localhost:8000/docs when running the backend natively (see below).

---

Running without Docker (development)

# Backend
cd backend
pip install -r requirements.txt
uvicorn app.main:app --reload --port 8000

# Frontend (separate terminal)
cd frontend
python -m http.server 8080

Note: the frontend quiz won't connect to the API via python -m http.server alone (no proxy). Use the FastAPI Swagger UI at http://localhost:8000/docs to test the API directly.

---

Design decisions

• Answers live on the backend — GET /api/quiz returns questions and options only. The correct answer is revealed by POST /api/quiz/check after submission, so it can never be found by inspecting the page source.
• Multi-stage Docker build — the backend Dockerfile uses a builder stage for pip installs and copies only the resulting packages into the lean runtime image, mirroring the best practice taught in Module 01.
• No database — quiz data is stored in backend/app/data.py. Simple to edit, zero infrastructure overhead for a learning project.
• Nginx as reverse proxy — all traffic enters on port 8080; /api/ requests are forwarded internally to the FastAPI container. No CORS configuration needed.

---

License

MIT — free to use, adapt, and share.