# Ds Starter Theme
digital-swing/sage Sur Github.
Le DS Starter Theme est un fork de Roots/Sage 10, un starter thème offrant un workflow moderne et un système de templates inspiré du modèle MVP.
# Installation et configuration
Une fois le provisionnement du nouveau site terminé, aller dans le répertoire du thème à
VVV/www/nouveau-site/public_html/web/app/themes/nouveau-site-theme
et entrez la commande
yarn
qui va se charger d'installer les modules node adéquat pré-définis dans package.json.
Puis indiquer l'adresse du site dans le fichier webpack.mix.js à la racine du thème.
# Compilation
Le DS Starter Theme utilise le bundler webpack qui va se charger de compiler automatiquement le code css, js, et les images.
Laravel Mix est une API qui permet de simplifier la configuration de webpack.
Lancer
yarn start
qui va démarrer webpack en mode watch et ouvrir automatiquement un navigateur à l'adresse https://localhost:3000
En mode watch, webpack va détécter tout changement dans les fichiers css, js, php du thème et lancer automatiquement la compilation.
# Browsersync
BrowserSync est un outil qui permet de visualiser en temps réel dans le navigateur les modifications que tu fais sur les fichiers du thème.
Il permet aussi de synchroniser l'affichage (le scroll) entre tous les navigateur qui ouvrent la page http://localhost:3000
Il est lancé automatiquement avec webpack et la commande yarn start et va se charger de mettre à jour l'affichage du site en temps réel dans le navigateur, en injectant les changements.
BrowserSync va détécter automatiquement les modifications sur les fichiers du thème et mettre à jour l'affichage du site en temps réel
Il offre également une page de configuration qui peut s'avérer bien pratique pour certain besoins spécifiques, accessible à cette adresse : https://localhost:3001
Ainsi qu'une adresse sur le réseau local pour que les autres membre de l'équipe sur le même réseau puisse facilement accéder au site.
# Styleguide
Le Starter Theme intègre une page de Styleguide basée sur Bootstrap 4 accessible à l'adresse : http://nouveau-site.test/styleguide ou http://localhost:3000/styleguide si webpack est lancé. Les changements apportés aux éléments fondamentaux du design du site se verront dans une vue d'ensemble sur cette page.
# Templates
Laravel Blade est le moteur de templates qui remplace celui natif de Wordpress.