Lucas-ZAKH Cargo : plateforme de transport et logistique Chine - Afrique de l'Ouest
Plateforme web installable pour un transitaire du corridor Chine - Bénin / Togo : présentation des offres aérienne et maritime, demande de devis, suivi de colis et espace client avec reçus PDF.
- Client
- Lucas-ZAKH CARGO
- Année
- 2026
- Domaine
- Site Web

Le contexte
Lucas-ZAKH CARGO opère sur le corridor commercial Chine - Afrique de l'Ouest et accompagne particuliers, commerçants et entreprises dans l'expédition de leurs marchandises vers le Bénin (Cotonou) et le Togo (Lomé). Sur ce marché, la relation client passe principalement par WhatsApp et par téléphone, ce qui rend les demandes de devis difficiles à tracer et le suivi des colis chronophage. L'entreprise avait besoin d'un point d'entrée public qui explique clairement les deux modes d'expédition, leurs délais et leur logique de coût, et qui permette au client de vérifier lui-même l'état de son envoi. Le site devait tenir compte d'usages très majoritairement mobiles et de connexions inégales. Le projet a donc été pensé comme une application web installable plutôt que comme une simple vitrine.
La mission
- 01Concevoir la direction visuelle et l'identité d'interface du site, réalisées par Biris Tech
- 02Structurer l'information : offres aérienne et maritime, destinations, délais et options
- 03Créer un parcours de demande de devis guidé par destination et type de marchandise
- 04Mettre en place un suivi de colis accessible par numéro de suivi
- 05Développer un espace client avec authentification par numéro de téléphone et via Google
- 06Intégrer le paiement en ligne et la génération de reçus PDF téléchargeables
- 07Rendre le site installable sur mobile sous forme d'application web progressive
- 08Connecter l'interface à une API métier dédiée pour les destinations, contacts et expéditions
Ce que nous avons fait
Notre premier travail a été de retracer le parcours réel d'un client du corridor Chine - Afrique : il cherche un tarif, il veut connaître un délai, puis il veut savoir où est son colis. Cette séquence a structuré la navigation en quatre pages publiques (accueil, à propos, destinations, contact) doublées d'un accès rapide vers le devis, le suivi et l'espace client. Biris Tech a réalisé le design : palette sombre, typographie Inter, cartes comparatives aérien / maritime et repères visuels par pays pour rendre l'offre lisible en un coup d'œil. Nous avons ensuite développé une application Vue 3 monopage, avec transitions courtes et navigation par onglets en bas d'écran sur mobile, afin de retrouver les codes d'usage d'une application native. L'espace client, les paiements et la génération de reçus PDF côté navigateur ont été branchés sur une API métier hébergée séparément. Enfin, le site a été publié en application web progressive, avec manifeste et service worker, pour permettre l'installation sur l'écran d'accueil et un fonctionnement plus tolérant aux connexions instables.
Les livrables
- Direction artistique et système d'interface complet (couleurs, typographie, composants)
- Site vitrine adapté à tous les écrans en quatre pages publiques
- Parcours de demande de devis avec destination, marchandise et options
- Module de suivi de colis par numéro de suivi
- Espace client avec authentification téléphone et connexion Google
- Application web progressive installable (manifeste, icônes, service worker)
- Génération de reçus PDF et intégration du paiement en ligne
Les résultats
- Une offre auparavant expliquée au cas par cas devient lisible en ligne : modes, délais et logique de coût sont présentés de façon comparable
- Les demandes de devis arrivent structurées, avec destination, type de marchandise et volume, au lieu de messages libres
- Le suivi en autonomie décharge l'équipe d'une partie des sollicitations de statut
- L'installation sur écran d'accueil donne au client un accès direct, sans passer par un navigateur
- Les reçus PDF fournissent une trace formelle immédiate après paiement
Les technologies utilisées
Ce qui a servi à mettre le projet en place, et pourquoi ces choix plutôt que d'autres.
Socle applicatif
- Vue 3 (3.5.32)
Application monopage réactive, adaptée aux parcours dynamiques de devis et de suivi
- Vue Router
Gère les onze routes du site, des pages publiques à l'espace client
- Pinia
Centralise l'état de session et les données client partagées entre les vues
- Vite
compilation moderne produisant un paquets de code unique versionné, servi avec un cache long
Interface et contenus
- Inter (Google Fonts)
Typographie neutre et très lisible sur petits écrans, préchargée via preconnect
- CSS à portée de composant
Styles isolés par composant et transitions de navigation cohérentes
Fonctions métier
- API dédiée api.lucaszakh.com
Sépare le métier (destinations, contacts, expéditions, comptes) de l'interface
- Axios
Client HTTP unifié vers l'API, avec gestion des sessions authentifiées
- jsPDF
Génère les reçus de paiement directement dans le navigateur, sans aller-retour serveur
- FedaPay
Paiement en ligne adapté au contexte ouest-africain, aux côtés du Mobile Money, du virement et des espèces
Diffusion et performance
- Application web progressive
Manifeste et service worker pour l'installation sur écran d'accueil et la résistance aux connexions faibles
- nginx 1.25.5 derrière Caddy
Service statique rapide du paquets de code, avec HTTP/3 annoncé via Alt-Svc
- En-têtes de sécurité sur l'API
HSTS, CSP et politique CORS restreinte protègent l'espace client
L'architecture mise en place
Application Vue 3 monopage servie en statique par nginx derrière Caddy, dialoguant avec une API métier hébergée sur un sous-domaine dédié (api.lucaszakh.com). Les pages publiques sont rendues côté client; le devis, le suivi, l'espace client et le paiement passent par l'API, tandis que les reçus PDF sont générés directement dans le navigateur. L'ensemble est distribué comme application web progressive installable.
Interface client
Rendu des pages publiques et des parcours interactifs sur bureau et mobile
- Vue 3
- Vue Router (11 routes)
- Pinia
- CSS à portée de composant
- Typographie Inter
Services métier
Données et opérations : destinations, contact, comptes, expéditions et paiements
- API api.lucaszakh.com
- Axios
- Authentification téléphone et Google
- FedaPay, Mobile Money, virement, espèces
- jsPDF pour les reçus
Diffusion et infrastructure
Publication, mise en cache et sécurité
- paquets de code Vite versionné
- nginx 1.25.5
- Caddy en frontal
- HTTP/3 annoncé (Alt-Svc)
- Manifeste et service worker
- HSTS et en-têtes de sécurité sur l'API
Le projet en images
Cliquez sur un visuel pour l'agrandir.
Sur mobile
La majorité des visites se fait au téléphone : voici le rendu tel que le voit un visiteur.
Démonstrations
Dans le même esprit
Réseau KNOSA Bénin
Plateforme nationale du réseau KNOSA Bénin, qui relie autorités publiques, scientifiques et partenaires instit…
Voir le casSite WebDr Marcos Doussoh
Le site de référence du Dr Marcos Doussoh : lieux et horaires de consultation, demande de suivi nutritionnel e…
Voir le casSite WebMaison Stella, résidence à Lomé
Site vitrine et de réservation directe pour une résidence de charme d'Avepozo, à Lomé. Design Biris Tech, appl…
Voir le cas