WORDPRESS LILLEMeetup 24 juin 2015

WORKFLOW WORDPRESS POUR LES DÉVELOPPEURS

WORDPRESS LILLE Meetup 24 juin 2015 Workflow Wordpress

WORDPRESS A 12 ANS !Et il a bien évolué

SOUVENEZ-VOUS :C’est pour faire des blogs…

Ce n’est pas professionnel…

WORDPRESS LILLE Meetup 24 juin 2015 Workflow Wordpress

CA S’INSTALLE EN 5 MINUTES !

ALORS ENLÈVE UN 0 À TON DEVIS

L’install en 5 minutes ? un truc de cow-boy ninja

WORDPRESS LILLE Meetup 24 juin 2015 Workflow Wordpress

EVOLUTION DU WORKFLOW

DE FILEZILLA À DOCKER AVEC LES PETITS COPAINS

GIT, VAGRANT, GULP, BOWER…

WORDPRESS LILLE Meetup 24 juin 2015 Workflow Wordpress

3 TYPES D’UTILISATEURS

CELUI QUI RÉDIGE

- ne fait pas l’installation- utilise l’admin de WP

CELUI QUI IMPLÉMENTE CELUI QUI CODE

- install en 5 minutes- mieux install en 1 click- install de plugins- install de thèmes- éditeur intégré

- install en local- outils de dev- dev de plugins- dev de thèmes- site complet

WORDPRESS LILLE Meetup 24 juin 2015 Workflow Wordpress

A L’ANCIENNE

- Télécharger Wordpress depuis le site

- WP-config- Ouvrir un soft FTP et transférer

- Créer un bdd ( phpmyadmin )

- Utiliser WP depuis le backend

WORDPRESS LILLE Meetup 24 juin 2015 Workflow Wordpress

WAMP MAMP STYLE- Télécharger Wordpress depuis le site

- WP-config

- Ouvrir un soft FTP et transférer

- Créer une bdd locale ( phpmyadmin )- Démarrer un serveur local ( mamp )

- Développer le site en local

- Migrer la bdd- Croiser les doigts

WORDPRESS LILLE Meetup 24 juin 2015 Workflow Wordpress

SAVE MY GIT- Télécharger Wordpress

- Développer le site en local- Initialiser un dépôt git ( github bitbucket)- Setup Mamp Wamp

- Push sur master- Git-ftp + script bdd - Git-ftp + WP Migrate Pro- Wordmove push pull

WORDPRESS LILLE Meetup 24 juin 2015 Workflow Wordpress

PUSH ME I’M FAMOUS- Setup précédent

- Développer le site en local- 3 branches dev, staging, prod - Serveur (s)avec accès SSH

- Push en staging pour validation

- WP Migrate Pro pour la bdd- Wordmove

- Push en prod

- Grunt + WordPress Deploy

WORDPRESS LILLE Meetup 24 juin 2015 Workflow Wordpress

MAMP À L’EAU- Setup précédent

- Vagrant VVV en local- 3 branches dev, staging, prod - Serveur (s)avec accès SSH

- Staging sur machine local ou remote

- Wordmove- Cycle dev > staging > prod

- Grunt + WordPress Deploy

- DynDNS ou Ngrock pour le staging

WORDPRESS LILLE Meetup 24 juin 2015 Workflow Wordpress

NEW KIDS ON THE DOCK

- Wocker- Docker

- Dokku- DynDNS ou Ngrock pour le staging

WORDPRESS LILLE Meetup 24 juin 2015 Workflow Wordpress

PAREIL POUR LE DEV DE THEMESDES OUTILS POUR SE FACILITER LA VIE

WORDPRESS LILLE Meetup 24 juin 2015 Workflow Wordpress

A L’ANCIENNE- Télécharger Wordpress depuis le site- Créer un nouveau thème- Télécharger un framework css- Télécharger les dépendances- Copier/coller depuis twenty-x

- Tester le thème- Rager dans style.css

- Utiliser des plugins pour optimiser

WORDPRESS LILLE Meetup 24 juin 2015 Workflow Wordpress

AVEC DES STÉROÏDES- Automatiser le d/l de WordPress

( WP cli, curl, yeoman, vagrant )

- Bower pour les dépendances( modernizr, bootstrap, picturfill…)

- Créer un nouveau thème- Starter theme

( _s, bones, sage, _tk, le votre )

- Tasker type Grunt, Gulp(livereload, compilation css, minification,concaténation, linter, compression d’images…)

- Sass / Less

- Testing : PHPUnit Selenium

C’EST TROP LONG À METTRE EN PLACE !

WORDPRESS LILLE Meetup 24 juin 2015 Workflow Wordpress

LE WORKFLOW COMPLETVagrant Environnement de dev, création automatique d’une

nouvelle instance de WordPress.

Git Versionning, séparation du codebase en branches distinctes : dev - staging -prod et développement « sécurisé » de features ou hot fixes

Yeoman Installation automatique d’un starter thème, de dépendancesJS, de framework CSS…

Grunt Automatisation des tâches : Sass, minification, concaténation,compression des images, déploiement, migration bdd…

WORDPRESS LILLE Meetup 24 juin 2015 Workflow Wordpress

CA S’INSTALLE EN COMBIEN D’HEURES ?

BAH EN 5 MINUTES !Mais il faudra un paquet d’heure d’apprentissage avant d’y arriver :)