Développer un projet complet PHP Laravel / wordpress / woocommerce déployé sur Amazon AWS en utilisant forge.

échangeons
D'autres articles

Table of Contents

Nous allons présenter dans cette série d’articles comment développer un un projet Laravel intégrant WordPress et Woocomerce le tout déployé sur les infrastructure Amazon AWS. Cet article et la série est cours d’écriture

0 – présentation de l’architecture finale Laravel WordPress Woocomerce AWS

FORGE est le service qui facilite l’intégration et le déploiement de notre application sur un fournisseur de cloud, AWS, Digital Ocean etc.., dans notre cas nous avons choisis l’utilisation d’AWS.

AWS Route53 va nous servir à enregistrer notre domaine et à gérer les regles de routage de notre domaine

AWS EC2 va nous servir de serveur pour héberger notre application ainsi que nos serveurs de base de données, PostgreSQL, MariaDb et Redis.

AWS SES est le service d’API d’envoi et de réception d’email d’amazon. Sa force est son prix qui est absolument imbattable , son défaut, comme souvent avec AWS une prise en main rebutante mais au final efficace et simple.

AWS WORKMAIL est le service d’email et de calendrier qui vient su positionner au dessus de AWS SES pour permettre d’intégrer et de gérer ses emails dans n’importe quel client de messagerie et pas juste par le bias des API.

AWS S3 est le servis qui va nous permettre d’assurer le stockage de l’ensemble de nos media et assets statiques.

1 – Création du projet

Nous partons du principe que vous avez déjà un environnement php fonctionnel, comprenant php, nodejs et une base PGSQL ou MYSQL, sinon vous pouvez allez voir comment faire cela dans cet article.

Nous allons commencer par créer le projet par la commande composer suivante :

$ composer create-project laravel/laravel project-name

Voila le projet est initialisé vous n’avez plus qu’a vous mettre dans le répertoire nouvellement créé et faire un test de bon fonctionnement avec les commandes suivantes :

$ cd project-name
$ php artisan serve

Vous devriez voir l’écran suivant en vous connectant sur http://127.0.0.1:8000:

1.1 installation de wordpress intégré au projet Laravel

Pour une question d’approche pédagogique nous faisons le choix d’intégrer le wordpress à notre application Laravel, mais bien entendu nous pourrions tout à fait utiliser un wordpress totalement indépendant de notre application.

1.1.1 récupération et installation de l’utilitaire wp-cli

WP-CLI est un projet open source créé il y à maintenant plus de 10 ans et qui est principalement maintenu par Daniel Bachhuber depuis 2003. L’objectif principal de WP-CLI est d’aider  le flux de travail des développeurs WordPress.

curl -O https://raw.githubusercontent.com/wp-cli/builds/gh-pages/phar/wp-cli.phar
chmod +x wp-cli.phar
sudo mv wp-cli.phar /usr/local/bin/wp

1.1.2 Installation de MariaDB / Mysql si ce n’est pas déjà fait

sudo apt update
sudo apt upgrade 
sudo apt install mariadb-server
sudo systemctl status mariadb
1.1.2.1 Donnez les accès à votre utilisateur

nous prenons comme exemple un user nomé forge puisque c’est le use par defaut quand vous créez une instance AWS EC2 depuis Laravel Forge

sudo mysql -v
GRANT ALL ON *.* to forge@localhost IDENTIFIED BY 'password';
1.1.2.2 Sécuriser un minimum votre installation
$ sudo mysql_secure_installation

Maintenant nous pouvons nous connecter à la base de donnée MariaDB/Mysql pour créer la base de données qui servira à wordpress

$ mysql -u forge -p
create database wordpress;

1.1.3 Téléchargement de wordpress et configuration

Maintenant que la base de données wordpress est créée nous pouvons utiliser wp-cli pour installer wordpress. Tout d’abord nous allons nous positionner dans le répertoire public/ de notre application puis nous allons créer un répertoire que nous allons appeler wp.

cd public/
mkdir wp
cd wp

vérifier que vous etes dans le bon répertoire avec la commande pwd si tel est le cas alors vous pouvez lancer le download de wordpress avec la commande suivante :

$ wp core download

Une fois le télchargement de wordpress dans le répertoire de votre application Laravel terminé nous pouvons configurer wordpress avec wp-cli

$ wp core config --dbname=wordpress --dbuser=forge --dbpass=motdepasse --dbhost=localhost --dbprefix=wp_

Maintenant nous pouvons passer à l’installation de wordpress dans notre projet laravel avec la commande wp-cli suivante, bien entendu il faudra adapter la ligne de commande à votre contexte.

$ wp core install --url="localhost:8000/wp" --title="Titre du Site" --admin_user="admin" --admin_password="admin" --admin_email="your-email@mail.com"

Si jamais vous vous trompez dans l’url du site ou autre, vous pouvez utiliser la commande wp-cli suivante qui assurera la recherche et le remplacement

$ wp search-replace 'localhost' 'localhost:8000/wp'

1.1.4 Installation des extensions/plugins wordpress nécessaire au projet

Bien entendu nous continuons notre installation et configuration de wordpress dans notre application Laravel avec ce superbe utilitaire wp-cli

1.1.4.1 vérifier les plugins wordpress installés avec wp-cli

$ wp plugin list
+---------+----------+-----------+---------+
| name    | status   | update    | version |
+---------+----------+-----------+---------+
| akismet | inactive | available | 4.1.7   |
| hello   | inactive | none      | 1.7.2   |
+---------+----------+-----------+---------+

Nous pouvons constater que nous n’avons que les deux plugins de base. Pour notre projet nous souhaitons utiliser la facilité d’usage du moteur e-commerce woocommerce, nous allons donc l’ajouter à notre installation de wordpress.

1.1.4.2 rechercher notre plugin woocommerce

$ wp plugin search "woocommerce"
+----------------------------------------------------------+---------------------------------------------+--------+
| name                                                     | slug                                        | rating |
+----------------------------------------------------------+---------------------------------------------+--------+
| WooCommerce                                              | woocommerce                                 | 90     |
| Facebook for WooCommerce                                 | facebook-for-woocommerce                    | 50     |
| WooCommerce Stripe Payment Gateway                       | woocommerce-gateway-stripe                  | 62     |
| WooCommerce PDF Invoices & Packing Slips             | woocommerce-pdf-invoices-packing-slips      | 100    |
| YITH WooCommerce Wishlist                                | yith-woocommerce-wishlist                   | 86     |
| Germanized for WooCommerce                               | woocommerce-germanized                      | 96     |
| Mailchimp for WooCommerce                                | mailchimp-for-woocommerce                   | 76     |
| Product Feed PRO for WooCommerce                         | woo-product-feed-pro                        | 96     |
| WooCommerce PayPal Checkout Payment Gateway              | woocommerce-gateway-paypal-express-checkout | 48     |
| Checkout Field Editor (Checkout Manager) for WooCommerce | woo-checkout-field-editor-pro               | 96     |
+----------------------------------------------------------+---------------------------------------------+--------+

1.1.4.3 installer et activer le plugin woocommerce avec wp-cli

$ wp plugin install woocommerce --activate
Installing WooCommerce (4.8.0)
Downloading installation package from https://downloads.wordpress.org/plugin/woocommerce.4.8.0.zip...
Unpacking the package...
Installing the plugin...
Plugin installed successfully.
Activating 'woocommerce'...
Plugin 'woocommerce' activated.
Success: Installed 1 of 1 plugins

1.1.4.4 installer et activer le plugin Advanced Custom Field avec wp-cli

$ wp plugin search "advanced custom field"
Success: Showing 10 of 2058 plugins.
+-------------------------------------------------------+-------------------------------------+--------+
| name                                                  | slug                                | rating |
+-------------------------------------------------------+-------------------------------------+--------+
| Advanced Custom Fields: Extended                      | acf-extended                        | 98     |
| Advanced Custom Fields                                | advanced-custom-fields              | 98     |
| Advanced Custom Fields: Table Field                   | advanced-custom-fields-table-field  | 98     |
| Advanced Custom Fields: Image Aspect Ratio Crop Field | acf-image-aspect-ratio-crop         | 98     |
| ACF Theme Code for Advanced Custom Fields             | acf-theme-code                      | 100    |
| Pods – Custom Content Types and Fields          | pods                                | 98     |
| Yoast SEO                                             | wordpress-seo                       | 98     |
| Advanced Custom Fields: Font Awesome Field            | advanced-custom-fields-font-awesome | 98     |
| Flexible Content Preview for Advanced Custom Fields   | acf-flexible-content-preview        | 100    |
| Advanced Woo Search                                   | advanced-woo-search                 | 96     |
+-------------------------------------------------------+-------------------------------------+--------+
$ wp plugin install advanced-custom-fields --activate
Installing Advanced Custom Fields (5.9.3)
Downloading installation package from https://downloads.wordpress.org/plugin/advanced-custom-fields.5.9.3.zip...
Unpacking the package...
Installing the plugin...
Plugin installed successfully.
Activating 'advanced-custom-fields'...
Plugin 'advanced-custom-fields' activated.
Success: Installed 1 of 1 plugins.

1.1.5 Accéder aux fonctions wordpress dans votre application Laravel

Pour ce faire nous allons utiliser le loader de wordpress en le déclarant dans notre fichier public/index.php de notre application laravel. Il est important de le déclarer avant l’autoload pour que les fonctions wordpress ne puissent pas redéclarer les fonctions laravel

<?php
use Illuminate\Contracts\Http\Kernel;
use Illuminate\Http\Request;
define('LARAVEL_START', microtime(true));
/*
|--------------------------------------------------------------------------
| Check If Application Is Under Maintenance
|--------------------------------------------------------------------------
|
| If the application is maintenance / demo mode via the "down" command we
| will require this file so that any prerendered template can be shown
| instead of starting the framework, which could cause an exception.
|
*/
if (file_exists(__DIR__.'/../storage/framework/maintenance.php')) {
    require __DIR__.'/../storage/framework/maintenance.php';
}
/*
|--------------------------------------------------------------------------
| Register The loader for wordpress integration
|--------------------------------------------------------------------------
|
| This loader provide us the capabilities to use all wordpress functions and also all plugins loaded
| so please be careful with your application security 
|
*/
if (file_exists(__DIR__.'/../public/wp/wp-load.php')) {
    require_once __DIR__.'/../public/wp/wp-load.php';
}
/*
|--------------------------------------------------------------------------
| Register The Auto Loader
|--------------------------------------------------------------------------
|
| Composer provides a convenient, automatically generated class loader for
| this application. We just need to utilize it! We'll simply require it
| into the script here so we don't need to manually load our classes.
|
*/
require __DIR__.'/../vendor/autoload.php';
/*
|--------------------------------------------------------------------------
| Run The Application
|--------------------------------------------------------------------------
|
| Once we have the application, we can handle the incoming request using
| the application's HTTP kernel. Then, we will send the response back
| to this client's browser, allowing them to enjoy our application.
|
*/
$app = require_once __DIR__.'/../bootstrap/app.php';
$kernel = $app->make(Kernel::class);
$response = tap($kernel->handle(
    $request = Request::capture()
))->send();
$kernel->terminate($request, $response);

2 – Installation des dépendances Laravel

Maintenant que vous avez validé que votre installation laravel etait fonctionnelle, nous pouvons passer à l’installation des dépendances pour notre projet

2.1 JetStream

Laravel Jetstream est un framework d’application magnifiquement conçu pour Laravel. Jetstream fournit le point de départ idéal pour votre prochaine application Laravel et comprend la connexion, l’enregistrement, la vérification des e-mails, l’authentification à deux facteurs, la gestion de session, le support API via Laravel Sanctum et la gestion d’équipe en option.

Jetstream est conçu à l’aide de Tailwind CSS et offre votre choix d’échafaudages Livewire ou Inertia.

nous commencons par délclarer la dépendance avec composer

$ composer require laravel/jetstream

Puis nous faisons l’installation de jetstrream avec le framework livewire et la pris en charge des “teams” ce qui nous permettra de pouvoir gérer des groupes d’uilisateurs

$ php artisan jetstream:install livewire --teams

Maintenant que l’ensemble des éléments de jetstream sont déclarés nous pouvons finaliser l’installation en installant les dépendancesNPM et en réalisation la migration de la base de données

$ npm instal
$ npm run dev
$ php artisan migrate

il possible que vous ayez une erreur lors de la commande php artisan migrate car nous n’avons pas paramétré notre base de donnée dans notre fichier .env

donc si vous avez l’erreur suivante :

SQLSTATE[HY000] [2002] Connection refused (SQL: select * from information_schema.tables where table_schema = laravel and table_name = migrations and table_type = 'BASE TABLE')
  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:678
    674▕         // If an exception occurs when attempting to run a query, we'll format the error
    675▕         // message to include the bindings with SQL, which will make this exception a
    676▕         // lot more helpful to the developer instead of just the database's errors.
    677▕         catch (Exception $e) {
  ➜ 678▕             throw new QueryException(
    679▕                 $query, $this->prepareBindings($bindings), $e
    680▕             );
    681▕         }
    682▕
      +36 vendor frames
  37  artisan:37
      Illuminate\Foundation\Console\Kernel::handle(Object(Symfony\Component\Console\Input\ArgvInput), Object(Symfony\Component\Console\Output\ConsoleOutput))

il suffit de renseigner notre fichier .env de la manière suivante :

DB_CONNECTION=mysql or pgsql
DB_HOST=your-host
DB_PORT=your-port
DB_DATABASE=your-database-name
DB_USERNAME=your-username
DB_PASSWORD=your-password

2.2 League\Flysystem\AwsS3v3

Flysystem est une bibliothèque d’abstraction de système de fichiers pour PHP. En fournissant une interface unifiée pour de nombreux systèmes de fichiers différents, vous pouvez échanger des systèmes de fichiers sans réécriture à l’échelle de l’application.

L’utilisation de Flysystem peut éliminer le blocage du fournisseur, réduire la dette technique et améliorer la testabilité de votre code.

Laravel fournit une puissante abstraction de système de fichiers grâce au merveilleux package PHP Flysystem de Frank de Jonge. L’intégration Laravel Flysystem fournit des pilotes simples pour travailler avec les systèmes de fichiers locaux, SFTP et Amazon S3.

Pour pouvoir utiliser AWS S3 avec notre projet Laravel il faut installer le package correspondant avec la commande composer suivante :

$ composer require league/flysystem-aws-s3-v3

Puis de paramétrer dans notre fichier .env que nous souhaitons travailler par defaut avec le système de stockage de AWS S3 en intégrant les lignes suivantes :

FILESYSTEM_DRIVER=s3
AWS_ACCESS_KEY_ID=YOUR-AWS-ACCESS-KEY
AWS_SECRET_ACCESS_KEY=YOUR-SECRET-KEY
AWS_DEFAULT_REGION=YOU RREGION ex : eu-west-3
AWS_BUCKET=YOUR BUCKET NAME ex : mybucket-eu-west-3
AWS_URL=YOUR BUCKET URL ex https://mybuckete-eu-west-3.s3.eu-west-3.amazonaws.com
AWS_REGION=YOUR DEFAULT REGION ex eu-west-"

Bien entendu cela ne vous empechera pas d’utiliser d’autre système de stockage, nous avons juste pour des question de simplicité paramétrer par default le systeme de stockage S3 pour Laravel.

2.3 Corcel

Corcel est une collection de classes PHP construites sur Eloquent ORM (du framework Laravel), qui fournit une interface fluide pour se connecter et obtenir des données directement à partir d’une base de données WordPress.

Vous pouvez utiliser WordPress comme backend (panneau d’administration) ou CMS, pour insérer des articles, des types personnalisés, etc., et toute autre application PHP de l’autre côté interrogeant ces données (en tant que couche de modèle).

Nous avons tout d’abord besoin d’installer le package correspondant :

$ composer require jgrossi/corcel

Maintenant que le package Corcel est installé nous pouvons passer à son paramétrage en puubliant son fichier de configuration avec la commande suivante :

$ php artisan vendor:publish --provider="Corcel\Laravel\CorcelServiceProvider"

Maintenant nous avons accès au fichier de configuration qui se trouve dans config/corcel.php. Lorque l’on ouvre ce fichier nous voyons que la connexion à la base est configuré avec le com ‘corcel’

'connection' => 'corcel',

Il nous suffit donc de créer une configuration de connnections nommée comme telle dans le fichier de configuration config/database.php

        'corcel' => [ // for WordPress database (used by Corcel)
            'driver'    => 'mysql',
            'host'      => env('WORDPRESS_HOST', ''),
            'database'  => env('WORDPRESS_DATABASE', ''),
            'port'      => env('WORDPRESS_PORT', ''),
            'username'  => env('WORDPRESS_USERNAME', ''),
            'password'  => env('WORDPRESS_PASSWORD', ''),
            'charset'   => 'utf8',
            'collation' => 'utf8_unicode_ci',
            'prefix'    => 'wp_',
            'strict'    => false,
            'engine'    => null,
        ],

Et de rajouter nos variables d’environnements à notre fichier .env

WORDPRESS_HOST=127.0.0.1
WORDPRESS_DATABASE=databasename
WORDPRESS_PORT=8889
WORDPRESS_USERNAME=UserName
WORDPRESS_PASSWORD=ThePassword!

2.4 Corcel ACF

Ce plugin Larval Corcel ACF vous permet de récupérer les champs personnalisés WordPress créés par le plugin ACF en utilisant la même syntaxe d’Eloquent, à partir du Framework Laravel. Vous pouvez utiliser des modèles et des collections Eloquent pour améliorer votre développement, en utilisant le backend WordPress avec n’importe quelle application PHP.

$ composer require corcel/acf

2.5 Corcel WooCommerce

Laravel Corcel WooCommerce est une collection de modèles Laravel pour WooCommerce.

Ce plugin étend le package Corcel de base et permet de récupérer les données WooCommerce à partir de la base de données WordPress. Actuellement, ce plugin implémente les modèles suivants:

  • Client – wrapper pour le modèle utilisateur
  • Commande – emballage pour modèle Post
  • Produit – wrapper pour modèle Post
  • Article
  • Catégorie de produit – wrapper pour le modèle de taxonomie
  • Balise de produit – wrapper pour le modèle de taxonomie
  • Attribut de produit – modèle d’aide pour obtenir les attributs de produit (ne doit pas être utilisé directement)
  • Type de produit – modèle d’aide pour obtenir les types de produits (ne doit pas être utilisé directement)

Certaines méta valeurs sont collectées dans des classes d’assistance:

BillingAddress – aide pour le client et l’adresse de facturation de la commande
ShippingAddress – aide pour le client et adresse de livraison de la commande
Paiement – Aide au paiement de la commande

$ composer require corcel/woocommerce

3 – Paramétrage des modules Amazon AWS

3.1 creation d’un compte AWS ou connexion à votre compte

3.2 configuration des droits IAM

3.3 AWS Route53

3.4 AWS S3

3.5 AWS SES

3.6 AWS WorkMail

4 – Paramétrage de Forge

4.1 creation du compte ou connexion à votre compte

4.2 parametrage des credentials AWS

Coordonnées
Phone: 07 83 40 31 76
Email: me@karlverger.com
Lieux de travail

Sophia Antipolis – Paris – Bordeaux – Lyon – Full Remote