# Site de restaurant avec commande en ligne et réservations

Ember & Rye — un site de restaurant avec menu filtrable, panier pour emporter avec taxes du Manitoba, réservations et cartes-cadeaux, en environ 11,5 Ko de code compressé et sans commission de plateforme.

> hospitality · 2026-09-29T15:05:08.549Z

Project overview

Ember & Rye est un restaurant de quartier fictif, cuisine au feu de bois, conçu comme vitrine pour les restaurants indépendants. Tout ce qu’un client fait sur un site de restaurant — horaires du soir, menu, commande pour emporter, réservation, carte-cadeau — se fait sur une seule page, sans plateforme tierce qui prélève une commission.

[Ouvrir la démo Ember & Rye en ligne](/demos/ember-rye/index.html)

Client context

  - Industry: Restauration

  - Client size / environment: Restaurant indépendant — build vitrine, marque fictive

  - Primary stakeholders: Propriétaires, service en salle, clients sur mobile

Challenge

Les restaurants indépendants jonglent souvent entre un menu PDF, un module de réservation et une application de livraison à commission. Le site devait refléter la salle — chaleureuse, tamisée, centrée sur la cuisine — tout en gérant filtres alimentaires, vrai panier avec taxes et réservations sur mobile.

Scope delivered

  - Menu à onglets avec filtres combinables végétarien / sans gluten / sans lactose

  - Panier pour emporter : quantités, créneaux de 15 minutes, TPS + TVP calculées (cartes-cadeaux non taxées), numéro de commande

  - Réservation : nombre de personnes, date, préférence de place, disponibilités et validation

  - Cartes-cadeaux avec aperçu en direct, ajoutées au même panier

  - Bandeau « Ce soir » — statut d’ouverture, fermeture de la cuisine et plat du jour

  - Salon privé, horaires du jour, polices auto-hébergées et compatibilité CSP

Before / after

  - Avant: Un menu PDF, un numéro pour réserver et une application de livraison qui prend environ 20 à 30 % de chaque commande.

  - Après: Le client filtre le menu, commande pour emporter avec les bonnes taxes, réserve une table et achète une carte-cadeau directement sur le site du restaurant. Environ 11,5 Ko de HTML, CSS et JavaScript compressés.

Mobile — mise en page 390 px et menu ouvert
Bureau — photo de salle avec appels à réserver et commander

Visual proof placeholders

  - 17 tests navigateur automatisés — filtres, onglets, totaux et taxes, exemption des cartes-cadeaux, créneaux, validation de réservation, menu mobile

  - Aucun débordement horizontal à 390 px ; zéro erreur JavaScript

  - Fonctionne sous la même CSP stricte que ce site

Delivery timeline

  - Phase 1 : Direction artistique, structure du menu et photos

  - Phase 2 : Filtres, panier et taxes, réservations et cartes-cadeaux

  - Phase 3 : Mobile, accessibilité, tests automatisés et captures

Outcome

Un site qui ressemble au restaurant et prend les commandes sans commission. Panier et réservation sont prêts à être reliés à un PDV, un fournisseur de paiement ou une notification cuisine.

Technology stack

HTML5, CSS Grid/Flexbox, JavaScript natif, polices auto-hébergées, images WebP, tests navigateur automatisés Playwright.

Visual evidence

Menu — onglets, filtres alimentaires et ajout au panier
Réservation — personnes, place et vraies disponibilités
Cartes-cadeaux — montant, nom et message avec aperçu
Salon privé — capacités, minimums et demande par courriel
Nous trouver — adresse et horaires du jour

---
Source page: https://amensecurity.ca/fr/projects/restaurant-website-online-ordering
Markdown version for AI agents · Amen Security
Email: info@amensecurity.ca
Phone: +1 (204) 514-3536