Saleor Commerce, l'alternative ultime open source à Shopify

Pour faire suite à notre série d’articles sur le e-commerce headless, voici une très bonne alternative open source aux plateformes existantes comme Shopify ou Big Commerce. Il est possible avec Saleor d’aller beaucoup plus loin dans les concepts du commerce en ligne et de pousser la personnalisation au maximum sans avoir de contraintes liées à la plateforme.

• Pourquoi utiliser Saleor commerce ?
• Version cloud et open source
• Proposition technique & architecture
• Apps et plugins
• Saleor + Next.js + Tailwind
• Les canaux sur Saleor
• Gestion facile des CDN

Avant de passer aux différents points techniques, il est important de comprendre pourquoi Saleor se positionne comme un futur leader dans le marché des solutions e-commerce headless (plus d'informations ici). Le projet est financé par des investisseurs comme Gillermo Rauch qui est le créateur et CEO de Vercel, l’entité qui possède Next.js et la solution d’hébergement Vercel.

D’autres investisseurs comme le CMO de Contenful ou le fondateur de Lookout indique clairement  que le projet est solide avec une roadmap publique très conséquente sont respectés pour le moment.

Saleor aide les marques comme Lush à créer des nouvelles expériences en éliminent les différentes barrières techniques tout en ayant une solution scalable et modulable.

Il existe deux offres si vous souhaitez travailler avec Saleor :

• La première dans le cloud, clé en main avec un starter à partir de 499$/mois, infrastructure garantie, pas de problème de montée de version, implémentation d’application à souhaits mais limité sur les plugins.
• La deuxième solution, en open source, entièrement évaluable, hébergeable dans votre infrastructure. C’est une alternative importante contrairement à Shopify par exemple qui n’apporte qu’une solution cloud, difficile à faire évoluer quand les besoins deviennent importants sur la partie métier.

Comme indiqué précédemment Saleor est pensé pour être très modulable en éliminent la partie monolithique que l’on retrouve souvent sur des solutions e-commerce open source comme Magento ou Prestashop.

Saleor Core: l’élément central de Saleor est qui possède toute la logique, en Python est basé sur PostgreSQL. Un choix technique pertinent pour optimiser les différents échanges avec le noyau de la solution. Saleor est GraphQL-first d’où l’utilisation de Python pour la partie backend.

Saleor Dashboard: le backoffice pour gérer l’ensemble des produits, utilisateurs, actions marketing, catégories ainsi que tout les paramètres du projet. Ecrit en React, Typescript. Entièrement personnalisable, assez facilement en ayant des connaissances en React.js/

Saleor StoreFront: la partie front-end (optionnel) de Saleor basée sur React et Typescript. Elle peut servir de base si vous n’avez pas envie de re-développer l’ensemble du front. Pour le moment pas d’intégration native de Next.js, à en croire le site cela devrait arriver prochainement avec une version développée en collaboration avec les équipes de Next.js. Ce qui devrait faire une grosse différence pour l’adoption par défaut du StoreFront.

Dans sa version 3 (en beta) il est possible d’étendre les fonctionnalités pour adapter finement vos besoins sans forcément devoir toucher au core, pour cela il existe deux solutions :

Les Apps: similaires à celles de Shopify, héberger chez vous, pour vos applications personnalisées. Vous pouvez séparer chaque App en fonction de vos besoins est d’avoir des micro-services en Node.js par exemple pour rajouter des fonctions métier ou connecter vos commandes, clients.. à d’autres outils en utilisant les webhooks pour déclencher les actions au bon moment.

Les plugins: pour le coup cela s’implémente dans le noyau en Python, ils permettent d’étendre les fonctionnalités directement dans le noyau pour basculer sur une logique différente que celle de Saleor ou rajouter des fonctions métiers non prévues à la base. Tout en restant un plugin identifiable, pratique pour les montées de version du noyau et la sous traitance des nouvelles fonctionnalités qui nécessite d’être dans le core.

Avec ces deux solutions il est possible d’aller très loin et de répondre à l’ensemble des besoins d’un e-commerçant, le tout structuré de façon à tenir dans le temps est scalable à souhait.

Voici une idée de stack avec un parfait combo pour gérer un premier commerce headless, en partant du principe que le store front de Saleor ne soit pas encore disponible avec Next.js.

Dans cette stack l’idée est d’aller vite pour déployer une première boutique en ligne, tout en ayant la possibilité de pouvoir personnaliser l’ensemble des éléments par la suite une fois que la boutique va grandir. Le plus compliqué est de la lancer la première version et d’avoir une version stable pour commencer à vendre.

Avec cette stack vous n’êtes coincer sur une plateforme comme Shopify ou Big Commerce, qu’il est difficile de migrer une fois votre projet lancé. D’autres problèmes se posent avec le temps et cela peut vous coûter très cher de rater votre migration, autant partir directement sur des bases solides en ayant en tête qu’il est possible de faire évoluer au besoin les fonctionnalités par la suite sans tout refaire et se passer d’une migration / refonte.

Next est aujourd’hui un incontournable pour répondre au problème du SSR et maîtriser son référencement sans avoir à réinventer la roue. Les dernières annonces pour la version 12 de Next.js sont incroyables est la boite à outils s’incréments de fonctionnalités qu’il est difficile de retrouver sur d’autre framework. Next.js étant sur une base de React, il est très facile de trouver des Freelance, agence ou collaborateur pour faire évoluer et maintenir votre commerce.

Quant à Tailwind, c’est une parfaite alternative pour développer rapidement la partie visuelle d’une boutique, en vous appuyant sur Tailwind UI (environ 250€) vous allez gagner un temps de fou. Un ensemble de composants est d’écrans prêts à l’usage, tout en restant malléable pour l’adapter à votre goût et à la charte graphique de votre marque.

L’un des principaux objectifs d’une approche headless est de pouvoir distribuer ses produits sur plusieurs canaux. Le tout en ayant une centralisation des clients et commandes. L’idée est de ne pas se limiter au site internet de la marque, mais de vendre aussi sur d’autres supports comme sur application mobile dédiée, des bornes en magasins, des tablettes vendeurs, Google Shopping…

Les canaux de Saleor ouvrent un tas de possibilités en ayant la main sur les produits disponibles sur chaque canal, le prix ainsi que les différents moyens de récupération des produits. De pouvoir jouer sur les stocks physiques et les stocks virtuels pour optimiser tout la chaine.

Cela permet également de vendre dans plusieurs pays, avec plusieurs devises et de gérer également les différents stocks en fonction de la zone géographique que vous voulez couvrir.

Saleor propose une gestion simplifier des CDN pour la partie open source, dans la version cloud cela sera inclûtes directement dans votre offre. Vous allez pouvoir configurer facilement le stockage des fichiers, typiquement sur Amazon S3 ou sur Google Cloud Storage.

Une configuration relativement simple mais qui permet de rendre votre boutique encore plus scalable et de séparer correctement le core de Saleor et vos différents fichiers que ce soit des images pour vos produits mais également le reste des assets qu’il vous faut pour habiller votre boutique.