Hackathon II Phase I & II Completed | Introducing TaskFlow AI-Driven Full-Stack Todo Web App

I’m honored to share the complete demo of my Hackathon II – The Evolution of Todo: Mastering Spec-Driven Development & Cloud-Native AI., where I successfully completed Phase I and Phase II

This hackathon is not about writing code manually.
It’s about thinking like a Product Architect and building AI-native systems using Spec-Driven Development and modern cloud-ready architectures.
🔹 PHASE I — Todo In-Memory Console Application (Python)

Objective
Build a command-line Todo application using Spec-Driven Development, without writing manual code.

What was implemented
• Add, Update, Delete, and View Todos
• Mark tasks as Complete / Incomplete
• Clean and modular project structure
• Entire application generated using Claude Code from structured specs

Tech Stack (Phase I)
• Python 3.13+
• UV
• Claude Code
• Spec-Kit Plus
🔹 PHASE II — Full-Stack Multi-User Todo Web Application

Objective
Transform the console app into a production-ready full-stack web application with authentication and persistent storage — again, without manual coding.

Features Implemented
• Full CRUD operations via REST APIs
• Multi-user support with strict data isolation
• Secure authentication using JWT
• Persistent storage using serverless PostgreSQL
• Modern, responsive frontend UI

🔐 Authentication Challenge (Major Hurdle)
One of the most challenging parts was implementing secure authentication between:
• A Next.js frontend (TypeScript)
• A FastAPI backend (Python)

Solution
• JWT-based authentication using Better Auth
• Shared secret between frontend and backend
• FastAPI middleware to validate JWT tokens
• User-level authorization enforced on every API request

🧰 COMPLETE TECH STACK

Frontend
• Next.js 16+ (App Router)
• TypeScript
• Tailwind CSS

Backend
• FastAPI (Python)
• SQLModel (ORM)

Database
• Neon Serverless PostgreSQL

Authentication
• Better Auth
• JWT (JSON Web Tokens)

AI & Spec-Driven Tooling
• Claude Code
• Spec-Kit Plus

Architecture
• Monorepo (Frontend + Backend in a single codebase)

More phases are coming as this system evolves into a cloud-native, AI-powered distributed platform.

📢 Join My WhatsApp Channel

👉 Agentic AI With Sahir

On this channel, we will learn and explore:
• Agentic AI
• AI-Assisted Web Development
• Spec-Driven Development
• Full-Stack AI-Native Systems
• Real-world projects and demos

#Hackathon #SpecDrivenDevelopment #AgenticAI #AIEngineering #ClaudeCode #NextJS #FastAPI #JWTAuthentication #FullStackDevelopment #CloudNative #GIAIC #Panaversity #AIWebDevelopment

Видео Hackathon II Phase I & II Completed | Introducing TaskFlow AI-Driven Full-Stack Todo Web App канала Sahir Ahmed