Hero en

Moderniser votre storefront Shopware : le frontend visuel pour Shopware 6

Shopware 6 s'est imposé comme moteur commerce, la question du frontend reste ouverte. Quand votre thème Twig atteint ses limites sur des configurations multi-marques, sur les Core Web Vitals ou sur la vitesse marketing, vous n'avez pas besoin d'un nouveau backend, mais d'un frontend visuel et découplé, directement branché sur votre Store API Shopware existante. C'est exactement ce que fait Laioutr : Shopware 6 reste votre backend, le storefront est mis en ligne plus vite, sans build sur mesure d'agence qui dure des mois.

Que veut dire "moderniser le storefront" sur Shopware 6, concrètement ?

Shopware 6 fournit un moteur commerce solide : Store API, Admin API, groupes clients, logique de TVA, conformité DACH nativement. Ce que Shopware 6 ne résout pas automatiquement, c'est la question du frontend. Le storefront par défaut fonctionne avec le templating Twig et l'héritage de thèmes Bootstrap, chaque landing page, chaque campagne, chaque déclinaison multi-marque demande du code de thème. Moderniser le storefront signifie concrètement : le backend (Store API, données produit, prix, groupes clients) reste Shopware 6, tandis que le frontend devient une couche composable à part, construite visuellement dans un éditeur plutôt que dans le code du thème.

Le problème : les limites du thème Twig et le build sur mesure d'agence

La plupart des marchands Shopware connaissent ce choix : continuer à maintenir le thème Twig, ou construire toute une stack PWA. Les deux options sont inconfortables. Les thèmes Twig passent mal à l'échelle sur les configurations multi-marques et multi-pays, chaque nouvelle landing page passe par une revue de thème, le marketing attend un ticket développeur. Construire sa propre couche PWA (typiquement sur base Vue Storefront) est techniquement propre, mais prend généralement quatre à six mois et nécessite une équipe frontend dédiée, souvent sourcée via une agence. S'ajoute la réalité de la performance : les storefronts Twig par défaut se situent souvent entre 2,5 et 4 secondes de Largest Contentful Paint, alors que le seuil "bon" de Google se situe sous 2,5 secondes (web.dev, seuils LCP). Ajoutez une mise en conformité accessibilité (BFSG), et c'est un sprint d'audit supplémentaire.

Nous avons déjà détaillé le chemin de migration Shopware 5 vers 6 et la décision frontend : si vous devez migrer de toute façon, découplez le frontend en premier, pas en dernier.

Backend Shopware 6, frontend visuel plutôt qu'un build sur mesure

La troisième option, entre "maintenir le thème" et "construire son propre PWA", est une couche Frontend Management Platform (FMP) qui se connecte directement à la Store API Shopware. Pas de connecteur sur mesure, pas d'équipe parallèle.

  • Dimension: Time-to-market landing page · Thème Twig: revue de thème, jours à semaines · Build PWA sur mesure d'agence: planification de sprint, semaines · Laioutr sur Shopware 6: éditeur Studio, quelques heures
  • Dimension: Performance (LCP) · Thème Twig: typiquement 2,5 à 4 secondes · Build PWA sur mesure d'agence: dépend de l'équipe, souvent instable · Laioutr sur Shopware 6: sous 2,5 secondes nativement
  • Dimension: Effort d'équipe · Thème Twig: développeur thème mobilisé en continu · Build PWA sur mesure d'agence: équipe frontend dédiée ou agence · Laioutr sur Shopware 6: le marketing travaille directement dans l'éditeur
  • Dimension: Multi-marque · Thème Twig: une déclinaison de thème par marque · Build PWA sur mesure d'agence: travail sur mesure supplémentaire par marque · Laioutr sur Shopware 6: une librairie de composants, un bus de tokens par marque
  • Dimension: BFSG / WCAG · Thème Twig: sprint d'audit séparé · Build PWA sur mesure d'agence: sprint d'audit séparé · Laioutr sur Shopware 6: conforme nativement

C'est aussi ce qui différencie cet article de notre page existante Frontend headless pour Shopware : cette page couvre l'histoire architecturale complète par backend. Cet article se concentre sur le mouvement concret de modernisation du storefront, avec l'angle agence pour celles et ceux qui cadrent actuellement un build sur mesure.

À quoi ressemble la mise en oeuvre concrètement

  1. Discovery. Audit du thème Twig existant, de la stack de plugins et de l'inventaire multi-marque/locale.
  2. Connexion Store API. Laioutr se connecte à la Store API Shopware comme intégration standard, sans connecteur sur mesure.
  3. Mapping thème vers composants. Les tokens de marque existants migrent dans la librairie UI, la conformité BFSG devient une propriété de la plateforme, pas un sprint séparé.
  4. Édition visuelle pour le marketing. Landing pages, campagnes et variantes A/B se construisent dans l'éditeur Studio, sans ticket développeur.
  5. Lancement progressif. Une marque ou un marché d'abord en parallèle, puis bascule complète.

Pour les agences qui cadrent actuellement un build sur mesure pour leurs clients : la couche Laioutr remplace la partie construction frontend du projet, le conseil backend et le paramétrage Shopware restent de votre ressort. Nous avons détaillé avec des chiffres pourquoi Shopware Headless devance les thèmes Twig dans un article séparé.

Ce que cela signifie pour les marchands Shopware et les agences

Pour les marchands : vous gardez Shopware 6 comme moteur commerce, mais regagnez de la vitesse marketing et de la performance Core Web Vitals, sans risque de replatforming. Pour les agences : vous n'avez plus à construire la couche frontend depuis zéro, et pouvez vous concentrer sur le conseil, la modélisation des données et l'accompagnement de migration, pendant que le storefront tourne sur une plateforme gérée.

FAQ

Dois-je changer de backend Shopware ?

Non. Shopware 6 reste votre backend, Laioutr se connecte via la Store API. Il s'agit d'un changement de frontend, pas d'un projet de replatforming.

Que deviennent mes plugins existants ?

Les plugins côté backend (logique de prix, moyens de paiement, connexion ERP) restent inchangés. Les extensions de thème côté frontend sont remplacées par des composants dans la librairie UI.

Combien de temps prend la mise en oeuvre ?

Pour une configuration mono-marque DACH, typiquement moins de deux semaines jusqu'au premier lancement progressif, avec une montée linéaire pour les configurations multi-marques.

Ai-je encore besoin d'une agence ?

Pour le conseil, la modélisation des données et les intégrations sur mesure, oui. Pour la seule construction frontend, non, la plateforme s'en charge.

Combien coûte le passage à Laioutr ?

Le détail des plans et du périmètre se trouve sur notre page tarifs, le plus rapide reste une démo de 30 minutes pour voir ce qui convient à votre boutique Shopware.

Prochaines étapes

Si votre thème Twig, ou le build sur mesure d'agence que vous envisagez, atteint l'une de ces limites en ce moment : réservez une démo, nous vous montrons Shopware 6 avec un frontend visuel et découplé, en direct.

Autres sujets de la plateforme Laioutr

À propos de l'auteur : Marcel Thiesies est Co-Founder & CEO de Laioutr. Il accompagne les boutiques du mid-market DACH sur l'adoption d'une architecture frontend composable sans risque de replatforming.

D'autres articles intéressants

Un savoir-faire concret pour le développement frontend, les agents intelligents et le headless

Book a demo mobile
Entretien stratégique

Prêt à faire de votre frontend une véritable couche de pilotage ?

Montrez-nous votre stack, votre roadmap, votre scénario de replatforming, et nous vous montrerons comment Laioutr s'intègre, ce que cela coûte et à quelle vitesse vous passez en production.

« Après 30 minutes, nous savions que Laioutr rendait notre replatforming réalisable. » - Daniel B., CEO, hygibox.de