El Cartel Auto

Website performant pentru un centru autorizat de reparații auto și constatări daune în România — convertind victimele accidentelor în clienți cu timpi de încărcare sub o secundă

Inapoi la Portofoliu Dezvoltare Web

Next.jsReactTypeScriptTailwind CSS

Provocarea

El Cartel Auto avea nevoie de o prezență web rapidă și modernă care să convertească vizitatorii în apeluri telefonice — țintind șoferii care tocmai au fost implicați într-un accident și au nevoie de ajutor imediat și de încredere. Site-ul trebuia să funcționeze și pe hosting shared cPanel, care nu este conceput pentru Node.js, făcând deployment-ul o provocare tehnică non-trivială.

Soluția Noastră

Am construit un site static-first cu Next.js App Router, cu detecție în timp real a statusului de business, un carusel drag-to-scroll și 7 pagini dinamice pentru parteneri de asigurări — toate deployate printr-un pipeline post-build personalizat care patchuiește căile de asset și configurează Apache pentru a servi o aplicație Node.js standalone pe hosting shared, fără server dedicat.

El Cartel Auto — Website & Digital Presence

El Cartel Auto is an authorized auto repair and insurance damage assessment center in Fălticeni, Romania. The client needed a fast, modern web presence that would convert visitors into phone calls — targeting drivers who've just been in an accident.

The result is a high-performance static-first website built with Next.js App Router, deployed as a standalone Node.js app on shared cPanel hosting — a technically non-trivial setup requiring custom build scripting, asset path patching, and Apache/.htaccess configuration.

Download Project Doc

Tech Stack

Layer	Technology
Frontend Framework	Next.js 15 (App Router)
Language	TypeScript
Styling	Tailwind CSS
Deployment	Standalone Node.js — cPanel/Passenger
Web Server	Apache + .htaccess rewrite rules
Build Pipeline	Custom post-build.mjs script
Version Control	Git-based deployment (git pull + Passenger restart)

Architecture

┌──────────────────────┐    git pull + restart    ┌──────────────────────┐
│                      │ ◄───────────────────── │                      │
│   Next.js 15         │                        │   cPanel / Passenger  │
│   (Standalone build) │                        │   (Shared Hosting)    │
│                      │                        │                      │
└──────────┬───────────┘                        └──────────┬───────────┘
           │                                               │
    post-build.mjs                                   Apache httpd
  (asset path patching,                          (HTTPS redirect via
   tilde char rename,                              .htaccess rewrite,
   cpSync to standalone)                          serves /assets/ dir)

The most interesting engineering challenge was deploying Next.js on shared cPanel hosting — an environment not designed for Node.js. A custom post-build script rewrites all asset references from /_next/ to /assets/, renames problematic tilde characters in chunk filenames, and syncs public/ and static assets into the standalone directory. Deployment is a single git pull followed by a Passenger restart.

Key Features

Pages Built

Homepage — hero with real-time open/closed status pill, animated gallery carousel, service showcase, location/map section, insurance partner grid
Despre Noi — company profile with service highlights and contact info
Informații Utile — step-by-step accident victim guide
7 dynamic insurance partner pages (Asirom, Axeria, Generali, Grawe, Groupama, Hellas, Omniasig) from a typed data config
Despre Proiect — EU-funded project disclosure page (FEDR/Regio Nord-Est, cod MySmis 313736)
Legal pages — cookie policy, privacy policy, terms & conditions

Key Features

Real-time business status — Open/Closed pill computed server-side from business hours config, no external dependency
Drag-to-scroll gallery carousel — infinite auto-scroll with pointer event drag (mouse + touch), momentum on release, auto-resumes after 1.5s idle
EU Logos Bar — shared component displaying 4 required grant logos in a responsive grid
WhatsApp & phone CTAs — persistent in navbar and throughout the page
HTTPS redirect enforced via .htaccess rewrite rules

Deployment Engineering

Static asset path conflict solved by post-build script rewriting all /_next/ references to /assets/
Tilde character renaming in chunk filenames to avoid Apache blocking
Next.js standalone output + manual cpSync of public/ and .next/static/ into standalone directory
Git-based deployment — full build output committed, deployed with git pull + Passenger restart

Design System

Bold automotive branding — black, white, and red (brand-primary)
Heavy italic uppercase headings with custom font-heading
Hazard stripe accents and dark/light section rhythm
Mobile-first responsive layout throughout

What This Project Demonstrates

Deployment engineering on constrained infrastructure — making Next.js work on shared cPanel hosting without a dedicated server
Custom post-build scripting — automated asset path patching and file sync after every build
Conversion-focused design — high-urgency CTAs, real-time business status, and direct call/WhatsApp integration
Dynamic route generation — single [partner] route producing 7 fully SEO-optimized pages from typed config data
Performance-first architecture — fully static HTML with no client-side data fetching, sub-second loads on mobile

Full project documentation with implementation details

Download .md File

Rezultatele

Timpi de încărcare sub o secundă pe mobil — HTML complet static, fără date fetched client-side
Toate cele 7 pagini de parteneri de asigurări indexate și în top pentru termeni de căutare locali
Pagini noi adăugate în mai puțin de o oră de la concept la live
Conformitate grant UE: pagină dedicată cu toate logo-urile și informațiile proiectului