> ## Documentation Index
> Fetch the complete documentation index at: https://docs.trendteller.com.br/llms.txt
> Use this file to discover all available pages before exploring further.

# System Overview

> Understanding Trendteller's multi-part architecture and data flow

## Architecture Overview

Trendteller is built as a comprehensive multi-part system that aggregates e-commerce data from multiple platforms, transforms it through a data pipeline, and provides insights through a modern web interface and AI-powered analytics.

## System Components

<CardGroup cols={2}>
  <Card title="Platform Frontend" icon="browser" href="/components/platform-frontend">
    Nuxt 3 dashboard for analytics and insights
  </Card>

  <Card title="Data Pipeline" icon="diagram-project" href="/components/data-pipeline">
    Dataform transformations on BigQuery
  </Card>

  <Card title="Data Connectors" icon="plug" href="/components/data-connectors">
    Airbyte integrations for 9 e-commerce platforms
  </Card>

  <Card title="AI Workflows" icon="robot" href="/components/ai-workflows">
    Kestra scripts for insights and forecasting
  </Card>
</CardGroup>

## Data Flow Diagram

```
┌─────────────────────────────────────────────────────────────────┐
│                     E-Commerce Platforms                        │
│  (Bling, VNDA, Shoppub, Tiny, Microvix, Braavo, JetERP, etc.) │
└────────────────┬────────────────────────────────────────────────┘
                 │
                 ▼
┌─────────────────────────────────────────────────────────────────┐
│              Airbyte (Custom Connectors)                        │
│          15 Sources + 2 Destinations (TypeScript)               │
└────────────────┬────────────────────────────────────────────────┘
                 │
                 ▼
┌─────────────────────────────────────────────────────────────────┐
│                 BigQuery Data Lake                              │
│                  (Bronze Layer - Raw Data)                      │
└────────────────┬────────────────────────────────────────────────┘
                 │
                 ▼
┌─────────────────────────────────────────────────────────────────┐
│                    Dataform Transformations                     │
│    Bronze → Silver (Standardized) → Gold (Analytics-Ready)     │
└────────────────┬────────────────────────────────────────────────┘
                 │
                 ▼
┌─────────────────────────────────────────────────────────────────┐
│                         Hasura V2                               │
│       GraphQL API Engine (Postgres/NeonDB + BigQuery)          │
└────────────────┬────────────────────────────────────────────────┘
                 │
                 ▼
┌─────────────────────────────────────────────────────────────────┐
│                  Platform Front (Nuxt 3)                        │
│          Analytics Dashboard + Forecasting UI                   │
│                    (Auth0 + Netlify)                            │
└─────────────────────────────────────────────────────────────────┘

              ┌──────────────────────┐
              │  Kestra Scripts      │
              │  (AI Insights,       │
              │   Forecasting,       │
              │   Web Crawling)      │
              └──────────────────────┘
```

## Data Flow Process

<Steps>
  <Step title="Data Ingestion">
    Airbyte connectors extract data from 9 e-commerce platforms (11 brands) including Bling, VNDA, Shoppub, Tiny, Microvix, and others.
  </Step>

  <Step title="Raw Storage">
    Raw data lands in BigQuery's Bronze layer, maintaining source format and structure for full traceability.
  </Step>

  <Step title="Data Transformation">
    Dataform processes data through Silver (standardized) and Gold (analytics-ready) layers using SQLX templates.
  </Step>

  <Step title="API Exposure">
    Hasura V2 exposes transformed data via a type-safe GraphQL API, combining BigQuery analytics data with Postgres operational data.
  </Step>

  <Step title="Data Consumption">
    Frontend dashboard displays analytics and visualizations. AI scripts generate insights, forecasts, and automated reports.
  </Step>
</Steps>

## Technology Stack

### Frontend Stack

* **Framework**: Nuxt 3 (v3.16.2) with TypeScript
* **UI Library**: Vuetify 3 component library
* **State Management**: Pinia with persistence
* **Authentication**: Auth0
* **API Client**: GraphQL with Genql (type-safe)
* **Hosting**: Netlify

### Data Stack

* **Data Warehouse**: Google BigQuery
* **Transformation**: Dataform Core 3.0.0
* **Integration**: Airbyte CDK (TypeScript)
* **Orchestration**: Kestra workflows
* **API Layer**: Hasura V2 GraphQL Engine

### AI & Analytics

* **AI Providers**: OpenAI, Google Gemini AI
* **Automation**: Puppeteer for web crawling
* **Database**: PostgreSQL (NeonDB) for operational data

## Infrastructure

<Tabs>
  <Tab title="Cloud Services">
    * **Google Cloud Platform**: BigQuery data warehouse
    * **AWS**: Additional cloud services
    * **Neon**: Managed PostgreSQL database
  </Tab>

  <Tab title="Authentication & Hosting">
    * **Auth0**: User authentication and authorization
    * **Netlify**: Frontend hosting and deployment
    * **Hasura Cloud**: GraphQL API hosting
  </Tab>

  <Tab title="Development & CI/CD">
    * **GitHub**: Source control
    * **Lerna**: Monorepo management
    * **Jest**: Testing framework
  </Tab>
</Tabs>

## Key Features

<CardGroup cols={2}>
  <Card title="Multi-Brand Support" icon="building">
    Consolidates data from 11 brands across 9 e-commerce platforms into unified analytics
  </Card>

  <Card title="Real-time GraphQL API" icon="bolt">
    Type-safe API powered by Hasura V2 with automatic schema generation
  </Card>

  <Card title="AI-Powered Insights" icon="brain">
    Leverages OpenAI and Gemini AI for forecasting and trend analysis
  </Card>

  <Card title="Scalable Data Pipeline" icon="chart-line">
    Medallion architecture on BigQuery ensures data quality and performance
  </Card>
</CardGroup>

## Scale & Metrics

<Info>
  * **Brands**: 11 supported brands
  * **Integrations**: 9 e-commerce platforms
  * **Connectors**: 15 source + 2 destination connectors
  * **Frontend Pages**: 23 pages
  * **UI Components**: 29 reusable components
  * **Data Tables**: 20+ analytics tables
</Info>

## Next Steps

<CardGroup cols={2}>
  <Card title="Key Concepts" icon="lightbulb" href="/key-concepts">
    Learn about medallion architecture and multi-brand analytics
  </Card>

  <Card title="API Reference" icon="code" href="/api-reference/introduction">
    Explore the Trendteller API
  </Card>

  <Card title="Architecture Deep Dive" icon="sitemap" href="/architecture/overview">
    Explore detailed system architecture
  </Card>

  <Card title="API Reference" icon="code" href="/api-reference/introduction">
    Integrate with Trendteller's GraphQL API
  </Card>
</CardGroup>
