AI-Powered News API: A Full-Stack AI-Generated Application

A demonstration of AI-driven software development: From schema design to full-stack implementation, this project showcases how AI can collaboratively design, generate, and power an entire application.

🎯 Project Overview

This project is a template and demonstration, inviting you to replace the core logic with your own ideas. It provides a solid React/TypeScript + Spring/Kotlin foundation that uses LLMs for intelligent data mocking.

It demonstrates a revolutionary approach to software development where AI is involved at every stage:

1. 🤝 Collaborative Schema Design - Work with AI to define the API interface
2. ⚡ AI-Powered Backend - Use LLM proxies to implement business logic
3. 🤖 AI-Generated Code - Automatically generate server and client implementations
4. 🚀 Full-Stack Application - Deploy a complete, working application

The result is a Hacker News-style API that is entirely AI-generated and AI-powered.

🏗️ Architecture

graph TD
    Schema[Schema Definition<br/>NewsApiService Interface] --> AIProxy[AI Proxy<br/>Runtime]
    Schema --> CodeGen[Code Generation<br/>Build Time]
    
    AIProxy --> SpringBoot[Spring Boot<br/>REST Server]
    CodeGen --> SpringBoot
    CodeGen --> React[React Frontend<br/>TypeScript UI]
    
    React --> SpringBoot
    SpringBoot --> Claude[Claude 4.5<br/>Haiku LLM]

Loading

✨ Key Features

🎨 Schema-First Design

• Define your API as a Kotlin interface
• Use annotations to specify behavior
• Let AI understand and implement the contract

🧠 AI-Powered Backend

• No traditional database required
• LLM generates realistic, contextual data on-the-fly
• Intelligent search and filtering capabilities
• Consistent, believable responses

🔄 Automatic Code Generation

• Server endpoints generated from schema
• TypeScript client SDK auto-generated
• React UI components scaffolded
• Full type safety across the stack

🔌 Extensible Spring Foundation

• Easy Decoration: Use Spring to wrap AI proxies with caching and persistence
• Flexible Backend: Seamlessly transition from AI-mocked data to real database implementations

📊 Rich Data Model

• Stories: News articles with metadata, tags, and topics
• Comments: Threaded discussions with nested replies
• Users: Profiles with karma, submissions, and activity
• Search: Advanced filtering by tags, topics, location, and more

🚀 Getting Started

Prerequisites

• Node.js 18+ (for React frontend)
• Anthropic API Key (for Claude 4.5 Haiku)

1️⃣ Setup API Key

Create a file at webapp/src/main/resources/anthropic.key with your Anthropic API key:

echo "your-api-key-here" > webapp/src/main/resources/anthropic.key

💡 Get your API key from Anthropic Console

2️⃣ Build and Run Backend

# Build the project
./gradlew build

# Run the Spring Boot server
./gradlew bootRun

The API will be available at http://localhost:8080

3️⃣ Run Frontend

# Navigate to UI directory
cd ui

# Install dependencies
npm install

# Start development server
npm run dev

The UI will be available at http://localhost:3000.

📖 API Documentation

Comprehensive API documentation is available in api.md, including:

• Stories API: Top stories, new stories, search, and details
• Comments API: Threaded discussions and replies
• Users API: Profiles, submissions, and activity
• Data Models: Complete schema definitions
• Examples: Real-world usage patterns

Quick Example

# Get top stories
curl http://localhost:8080/api/stories/top?page=1&pageSize=10

# Search stories
curl -X POST http://localhost:8080/api/stories/search \
  -H "Content-Type: application/json" \
  -d '{"query": "AI", "minScore": 100, "sortOrder": "SCORE"}'

# Get user profile
curl http://localhost:8080/api/users/techuser

🔍 How It Works

1. Schema Definition (NewsApi.kt)

Define your API as a Kotlin interface with annotations:

interface NewsApi {
    @Description("Get the current top stories")
    fun getTopStoryIds(
        @Description("Pagination parameters")
        pagination: PaginationParams = PaginationParams()
    ): PaginatedStoryIds

    @Description("Get detailed information about a specific story")
    fun getStoryDetails(
        @Description("The unique identifier of the story")
        id: Long
    ): Story
}

2. AI Proxy Implementation (NewsServiceLoader.kt)

The ProxyAgent creates a runtime implementation powered by Claude:

val newsApi = ProxyAgent(
    clazz = NewsApiService::class.java,
    model = AnthropicModels.Claude45Haiku.instance(key = apiKey),
    temperature = 0.8,
    validation = true
).create()

What happens:

• Method calls are intercepted at runtime
• Request is converted to natural language prompt
• Claude generates appropriate response
• Response is validated and returned as typed object

3. Code Generation

The build process automatically generates:

• REST Controllers: Spring Boot endpoints matching the schema
• TypeScript Client: Type-safe API client for frontend
• React Components: UI scaffolding for data display

4. Full-Stack Integration

// Frontend TypeScript (auto-generated)
const stories = await newsApi.getTopStoryIds({ page: 1, pageSize: 30 });
const story = await newsApi.getStoryDetails(stories.ids[0]);

🎓 Learning Outcomes

This project demonstrates:

For Developers

• Schema-driven development with AI assistance
• LLM-powered backends without traditional databases
• Automatic code generation from interface definitions
• Type-safe full-stack development

For Architects

• AI as infrastructure - treating LLMs as compute resources
• Declarative APIs - define what, not how
• Rapid prototyping - from idea to working app in minutes
• Cost-effective MVPs - no database setup or data seeding

For Product Teams

• Instant realistic data - no need for fixtures or mocks
• Flexible schemas - easy to iterate and refine
• Natural language queries - powerful search without complex indexing
• Contextual responses - data that makes sense together

🛠️ Technology Stack

Backend

• Kotlin - Modern JVM language
• Spring Boot - Web framework
• Cognotik - AI proxy framework
• Anthropic Claude 4.5 Haiku - LLM provider

Frontend

• React 18 - UI framework
• TypeScript - Type safety
• Vite - Build tool
• React Router - Navigation

AI/ML

• Claude 4.5 Haiku - Fast, cost-effective LLM
• Structured outputs - Type-safe AI responses
• Validation - Automatic response verification

📊 Project Structure

newssite/
├── webapp/src/main/kotlin/com/example/news/
│   ├── api/
│   │   ├── NewsApiService.kt          # 📋 Core schema definition
│   │   ├── NewsServiceLoader.kt       # 🤖 AI proxy setup
│   │   ├── models/                    # 📦 Data models
│   └── server/
│       └── NewsApplication.kt         # 🚀 Spring Boot app
├── ui/
│   ├── src/
│   │   ├── api/                       # 🔌 Generated client
│   │   ├── components/                # 🎨 React components
│   │   └── App.tsx                    # 📱 Main application
│   └── package.json
├── api.md                             # 📖 API documentation
└── build.gradle.kts                   # 🔧 Build configuration

🎯 Use Cases

Rapid Prototyping

• Build MVPs without database setup
• Iterate on API design quickly
• Get realistic data immediately

API Design Workshops

• Collaborate with AI on schema design
• Test different API patterns
• Generate documentation automatically

Educational Projects

• Learn full-stack development
• Understand AI integration
• Practice API design

Proof of Concepts

• Demonstrate ideas quickly
• Test market fit
• Validate technical approaches

📝 License

This project is provided as-is for educational and demonstration purposes.