# gokulskr/car-care-realtime-node architecture

> Architecture diagram of the GitHub repository gokulskr/car-care-realtime-node, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-14). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/gokulskr/car-care-realtime-node
- Repository: https://github.com/gokulskr/car-care-realtime-node

## Overview

This is a small appointment-booking web app: a visitor opens the appointment form, submits booking details, and the server emails them to the configured Gmail account. The sampled code shows the browser interaction, POST request, server handler, and email dispatch. The HTML and CSS are present in the tree but were not excerpted, so their wiring and presentation details are not inferred.

Main entry points: [`script.js`](https://github.com/gokulskr/car-care-realtime-node/blob/main/script.js) (Form interaction), [`server.js`](https://github.com/gokulskr/car-care-realtime-node/blob/main/server.js) (Booking handler)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_browser["Browser interface"]
  node_page["Appointment page<br/>[index.html]"]
  node_interaction["Form interaction<br/>[script.js]"]
end

subgraph group_booking["Booking service"]
  node_booking_handler["Booking handler<br/>[server.js]"]
end

subgraph group_delivery["Email delivery"]
  node_gmail["Gmail SMTP"]
end

node_visitor(("Visitor"))

node_visitor -->|"submits form"| node_interaction
node_interaction -->|"POSTs booking"| node_booking_handler
node_booking_handler -->|"sends email"| node_gmail

click node_page "https://github.com/gokulskr/car-care-realtime-node/blob/main/index.html"
click node_interaction "https://github.com/gokulskr/car-care-realtime-node/blob/main/script.js"
click node_booking_handler "https://github.com/gokulskr/car-care-realtime-node/blob/main/server.js"

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_page,node_interaction toneBlue
class node_booking_handler toneAmber
class node_gmail toneMint
class node_visitor toneIndigo
```

## Components

### Browser interface

- [Appointment page](https://github.com/gokulskr/car-care-realtime-node/blob/main/index.html): `index.html`
- [Form interaction](https://github.com/gokulskr/car-care-realtime-node/blob/main/script.js): `script.js`

### Booking service

- [Booking handler](https://github.com/gokulskr/car-care-realtime-node/blob/main/server.js): `server.js`

### Email delivery

- **Gmail SMTP**

### Other components

- **Visitor**

## Connections

- Visitor → Form interaction: submits form (evidence: `script.js`)
- Form interaction → Booking handler: POSTs booking (evidence: `script.js`)
- Booking handler → Gmail SMTP: sends email (evidence: `server.js`)
