Python Backend Deployment & Frontend API Integration

A portfolio project focused on backend API engineering, frontend integration, automated testing, configuration management, and cloud-deployment readiness.

What this project demonstrates

• Flask REST API design
• Frontend-to-backend API integration
• CORS configuration
• Environment-based configuration
• Input validation and error handling
• Automated backend tests with pytest
• Production server readiness with Gunicorn
• Separation between backend and frontend deployment targets

Architecture

Browser Frontend
      │
      │ HTTP / JSON
      ▼
   Flask API
      │
      ├── Validation
      ├── Error Handling
      └── Business Logic

Deployment model:
Frontend → Netlify
Backend  → Railway / Render-compatible service

Repository structure

backend/
  ├── Flask API
  ├── tests/
  ├── requirements.txt
  └── environment configuration

frontend/
  ├── responsive assessment UI
  └── API configuration

Backend engineering highlights

• API responses are separated from frontend presentation logic.
• Allowed frontend origins are configurable through environment variables rather than hard-coded deployment values.
• Validation and error handling are implemented server-side.
• The backend includes automated tests and a production-compatible start command.
• The frontend consumes the backend through a configurable public API URL.

Run locally

Backend

cd backend
python -m venv .venv
.venv\Scripts\activate
pip install -r requirements.txt
python main.py

Frontend

cd frontend
python -m http.server 5500

Open http://127.0.0.1:5500.

Tests

cd backend
pytest

Deployment workflow

1. Push the repository to GitHub.
2. Deploy backend/ to Railway, Render, or a compatible Python platform.
3. Configure ALLOWED_ORIGINS using environment variables.
4. Obtain the public backend URL.
5. Update the frontend API configuration with that URL.
6. Deploy frontend/ to Netlify or another static hosting provider.
7. Add the deployed frontend origin to the backend CORS configuration.
8. Run an end-to-end test of the complete flow.

Why this repository matters

This project intentionally focuses on the integration boundary between a browser client and a deployed backend service. It demonstrates the fundamentals needed for larger backend systems: API contracts, validation, configuration, testing, CORS, environment separation, and deployment planning.

Related projects

For larger backend/cloud-oriented systems, see:

• FlowGuard — Agentic Automation Control Plane
• TrustFlow Sentinel
• RepoRadar AI
• Ahmed Software Engineering Portfolio

Portfolio disclosure

This is a personal portfolio demonstration project and is not presented as paid client work.