Boilerplate statique pour développer des skins d’e-commerce coréens (HTMX + Vite + TypeScript)
(hebububu.github.io)Bonjour, je suis développeur backend dans le secteur de l’e-commerce !
Dans l’e-commerce coréen, le front est souvent construit sous forme de skins sur des plateformes comme cafe24, Godomall & Shopby, ou MakeShop.
Comme elles ne proposent le plus souvent qu’un serving statique, l’usage d’un framework SPA comme React a parfois été difficile pour des entreprises de taille petite ou moyenne.
Il arrive aussi que des stacks legacy basées sur jQuery ou Handlebars soient encore utilisées, et comme la structure des fichiers n’est parfois pas du tout organisée, on se retrouve souvent avec des dizaines de fichiers mêlés dans un dossier dans un grand désordre. La réutilisation des composants était souvent difficile aussi, hélas.
J’ai donc créé un boilerplate e-commerce proprement structuré qui fonctionne uniquement avec des fichiers HTML/JS/CSS.
Il est conçu pour être utilisé en y ajoutant simplement le code lié aux API !
Stack technique
- HTMX 2.0 — navigation SPA basée sur des fragments HTML
- Vite 7 — outil de build + serveur de développement HMR
- TypeScript — bundles indépendants par composant
- Embla Carousel — bannières parallax, carrousels de produits
- CSS pur — système de design tokens basé sur les custom properties CSS, sans Tailwind
Pages implémentées
- Accueil (carrousel de bannières, catégories, carrousel de produits, classement, avis, annonces)
- Liste de produits (barre latérale de catégories, filtres, mise en page en grille)
- Détail produit (galerie d’images, cascade d’options, réglage de quantité, onglets, lightbox d’avis)
- Forum (annonces, FAQ, détail d’article)
- Événements (liste d’événements, minuteur de compte à rebours, détail)
- Mon compte (niveau membre, statistiques de commande, coupons/points)
- Historique des commandes (filtre par date, liste de cartes de commande)
Démo & source
- Démo: https://hebububu.github.io/static-htmx-ecommerce/
- GitHub: https://github.com/Hebububu/static-htmx-ecommerce
Vous pouvez librement le cloner et l’utiliser sans licence !
Les retours et idées d’amélioration sont également les bienvenus !
Aucun commentaire pour le moment.