# sxbzqx/recardme architecture

> Architecture diagram of the GitHub repository sxbzqx/recardme, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-25). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/sxbzqx/recardme
- Repository: https://github.com/sxbzqx/recardme
- Video tour (about a minute): https://gitdiagram.com/sxbzqx/recardme/video

## Overview

Recardme is a Next.js frontend for an ads and services marketplace, with a profile analytics view. The visible user journey is opening the home page, seeing marketplace navigation and search, then the account analytics panel and footer. The analytics route composes a sidebar, top section, and card; their detailed behavior is not shown in the sampled source. Search, newsletter, navigation, and account actions are UI-only in the inspected code; no data service or persistence is evidenced.

Main entry points: [`app/page.tsx`](https://github.com/sxbzqx/recardme/blob/main/app/page.tsx) (Home page), [`app/analytics/page.tsx`](https://github.com/sxbzqx/recardme/blob/main/app/analytics/page.tsx) (Analytics page), [`components/header.tsx`](https://github.com/sxbzqx/recardme/blob/main/components/header.tsx) (Header), [`app/layout.tsx`](https://github.com/sxbzqx/recardme/blob/main/app/layout.tsx) (Root layout)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_shell["Page shell"]
  node_layout["Root layout<br/>[layout.tsx]"]
  node_home["Home page<br/>[page.tsx]"]
  node_footer["Footer<br/>[footer.tsx]"]
end

subgraph group_marketplace["Marketplace navigation"]
  node_header["Header<br/>[header.tsx]"]
  node_tabs["Marketplace tabs<br/>[tabs.tsx]"]
  node_search["Search bar<br/>[search.tsx]"]
end

subgraph group_account["Account analytics"]
  node_analytics_page["Analytics page<br/>[page.tsx]"]
  node_sidebar["Profile sidebar<br/>[sidebar.tsx]"]
  node_analytics_top["Analytics heading<br/>[AnalyticsTop.tsx]"]
  node_analytics_card["Analytics card<br/>[AnalyticsCard.tsx]"]
end

node_visitor(("Visitor"))

node_visitor -->|"opens"| node_home
node_layout -->|"wraps"| node_home
node_home -->|"renders"| node_header
node_home -->|"renders"| node_search
node_home -->|"renders"| node_analytics_page
node_home -->|"renders"| node_footer
node_header -->|"renders"| node_tabs
node_analytics_page -->|"renders"| node_sidebar
node_analytics_page -->|"renders"| node_analytics_top
node_analytics_page -->|"renders"| node_analytics_card

click node_layout "https://github.com/sxbzqx/recardme/blob/main/app/layout.tsx"
click node_home "https://github.com/sxbzqx/recardme/blob/main/app/page.tsx"
click node_footer "https://github.com/sxbzqx/recardme/blob/main/components/footer.tsx"
click node_header "https://github.com/sxbzqx/recardme/blob/main/components/header.tsx"
click node_tabs "https://github.com/sxbzqx/recardme/blob/main/components/tabs.tsx"
click node_search "https://github.com/sxbzqx/recardme/blob/main/components/search.tsx"
click node_analytics_page "https://github.com/sxbzqx/recardme/blob/main/app/analytics/page.tsx"
click node_sidebar "https://github.com/sxbzqx/recardme/blob/main/components/sidebar.tsx"
click node_analytics_top "https://github.com/sxbzqx/recardme/blob/main/components/AnalyticsTop.tsx"
click node_analytics_card "https://github.com/sxbzqx/recardme/blob/main/components/AnalyticsCard.tsx"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_layout,node_home,node_footer toneBlue
class node_header,node_tabs,node_search toneAmber
class node_analytics_page,node_sidebar,node_analytics_top,node_analytics_card toneMint
class node_visitor toneIndigo
```

## Components

### Page shell

- [Root layout](https://github.com/sxbzqx/recardme/blob/main/app/layout.tsx): `app/layout.tsx`
- [Home page](https://github.com/sxbzqx/recardme/blob/main/app/page.tsx): `app/page.tsx`
- [Footer](https://github.com/sxbzqx/recardme/blob/main/components/footer.tsx): `components/footer.tsx`

### Marketplace navigation

- [Header](https://github.com/sxbzqx/recardme/blob/main/components/header.tsx): `components/header.tsx`
- [Marketplace tabs](https://github.com/sxbzqx/recardme/blob/main/components/tabs.tsx): `components/tabs.tsx`
- [Search bar](https://github.com/sxbzqx/recardme/blob/main/components/search.tsx): `components/search.tsx`

### Account analytics

- [Analytics page](https://github.com/sxbzqx/recardme/blob/main/app/analytics/page.tsx): `app/analytics/page.tsx`
- [Profile sidebar](https://github.com/sxbzqx/recardme/blob/main/components/sidebar.tsx): `components/sidebar.tsx`
- [Analytics heading](https://github.com/sxbzqx/recardme/blob/main/components/AnalyticsTop.tsx): `components/AnalyticsTop.tsx`
- [Analytics card](https://github.com/sxbzqx/recardme/blob/main/components/AnalyticsCard.tsx): `components/AnalyticsCard.tsx`

### Other components

- **Visitor**

## Connections

- Visitor → Home page: opens
- Root layout → Home page: wraps
- Home page → Header: renders
- Home page → Search bar: renders
- Home page → Analytics page: renders
- Home page → Footer: renders
- Header → Marketplace tabs: renders
- Analytics page → Profile sidebar: renders
- Analytics page → Analytics heading: renders
- Analytics page → Analytics card: renders