# News Writing Solution Architecture (Revised)

## System Overview

```mermaid
graph TD
    A[Data Collection] --> B[Database]
    B --> C[NestJS API]
    C --> D[React Frontend]
    D --> E[User Browsers]
    C --> F[Social Media APIs]
```

## Tech Stack

### Backend Services

- **Framework**: NestJS (Node.js)
- **Database**: PostgreSQL + Prisma ORM
- **Search**: ElasticSearch
- **Queue**: BullMQ
- **Caching**: Redis

### Frontend Application

- **Core**: React 18 + Vite
- **State**: TanStack Store
- **Routing**: TanStack Router
- **Data**: TanStack Query
- **Styling**: TailwindCSS + shadcn

## Key Components

### Data Collection Layer

- RSS feed processor (rss-parser)
- Web scraping (Puppeteer)
- Data normalization pipeline
- Scheduled jobs (BullMQ)

### API Services

- Articles module
- Search module
- User authentication
- Social integration
- Rate limiting

### Frontend Features

- Article browsing interface
- Advanced search with filters
- WYSIWYG editor (Tiptap)
- Social sharing
- User profiles

## Implementation Phases

1. **Core Infrastructure**
   - VPS setup with Docker
   - Database deployment
   - CI/CD pipeline

2. **API Development**
   - NestJS modules
   - Prisma schema
   - Authentication

3. **Frontend Implementation**
   - Core layout
   - Article components
   - Search interface

4. **Data Pipeline**
   - RSS integration
   - Scraping services
   - Queue system

## Scalability Considerations

- Database read replicas
- Horizontal API scaling
- Caching strategy
- Monitoring (Prometheus + Grafana)