aramesh-backend/frontend

Aramesh Construction Group — Frontend

A React + Vite + Tailwind CSS application. All text content and assets are fetched dynamically from the backend API (GET /api/site).

Typography

The Pinar font is installed and served locally. The application no longer relies on any external servers or CDNs for font rendering.

Development Setup

npm install
npm run dev

In development mode, Vite proxies /api and /media requests to Traefik (port 5173). Therefore, the Docker stack must be running. The backend API URL is read from the VITE_API_URL environment variable in src/config.ts; an empty default implies same-origin requests.

Build & Production

The build process runs on the host machine. The Docker container only serves the generated static files in the dist/ directory using Caddy:

npm run build

Note: The backend reads the dist/ directory (mounted at /srv/frontend in Docker Compose) to inject SEO metadata into the /blog and /projects pages. After making any frontend changes, running npm run build and restarting the backend is sufficient.

Key Modules & Architecture

• src/api.tsx — Handles site data loading and draft article merging for the admin view.
• src/admin/ — Live editing layer (Digital Twin): includes the admin toolbar, entity drawers, and the article editor.
• src/seo.ts — Manages page-level SEO tags (Title, Description, Open Graph, Canonical, JSON-LD).
• src/data/site.ts — Shared TypeScript data models and interfaces.