Softsite | Agence Web Design Roumanie
Softsite | Agence Web Design Roumanie
Contact

El Cartel Auto

Site web haute performance pour un centre agréé de réparation automobile et d'évaluation des dommages en Roumanie

El Cartel Auto
[FR] Back to Portfolio[FR] Web Development
Next.jsReactTypeScriptTailwind CSS

Le Défi

El Cartel Auto avait besoin d'une présence web rapide et moderne pour convertir les visiteurs en appels téléphoniques — ciblant les conducteurs impliqués dans un accident qui ont besoin d'aide immédiate.

Notre Solution

Nous avons créé un site statique Next.js App Router avec détection du statut commercial en temps réel, un carrousel drag-to-scroll et 7 pages dynamiques de partenaires d'assurance — déployé via un pipeline post-build personnalisé pour hébergement cPanel.

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

LayerTechnology
Frontend FrameworkNext.js 15 (App Router)
LanguageTypeScript
StylingTailwind CSS
DeploymentStandalone Node.js — cPanel/Passenger
Web ServerApache + .htaccess rewrite rules
Build PipelineCustom post-build.mjs script
Version ControlGit-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

Les Résultats

  • Temps de chargement inférieurs à une seconde sur mobile
  • Les 7 pages partenaires d'assurance indexées et bien classées localement
  • Nouvelles pages ajoutées en moins d'une heure
  • Conformité aux subventions UE avec page de divulgation dédiée

[FR] Ready to build something that converts?

[FR] No obligations. Let's discuss your project and find the best solution together.