Créez Votre Appli
08
Mai

Introduction WordPress API – Gatsby : Formation developpeur web

, ,
0
La première chose que nous allons faire est de configurer un serveur local afin de pouvoir exécuter notre site Web WordPress et son API.
 
Nous allons utiliser MAMP dans ce cours. Il est disponible pour Mac et Windows.
Alors téléchargeons le maintenant, c’est un téléchargement gratuit.
 
Il est disponible pour Mac et Windows. Alors téléchargeons le pour Mac, et une fois que c’est téléchargé. 
 
Ouvrons l’installateur.
 
Le processus d’installation sera le même pour Windows et Mac.
Passons les étapes d’installation. Acceptez tous les configurations par défauts. Une fois que c’est installé, nous pouvons fermer la fenêtre.
 
Ensuite nous allons télécharger WordPress A partir de wordpress.org, et non pas le.com car c’est la plateforme gratuite pour la création de blog.
 
Tu peux aller sur l’autre lien où tu pourras télécharger WordPress Cliquez ici pour obtenir la version dernière version de WordPress.
Allons à l’emplacement de téléchargement de WordPress.
Décompresses le fichier.
Et maintenant ce que nous allons faire c’est copier le contenu de WordPress et ouvrir MAMP
 
Allons dans les préférences. Dans des paramètres du serveur  web qui utilisent Apache.
Et comme on peut le voir ici, le chemin du documents sur notre ordi.
 
Si tu utilises Windows, il y aura évidemment un chemin différent ici, mais Il devrait également s’agir des documents d’HTCDOCS
 
Ouvrons ce dossier. 
 
Pour cela on vas dans applications, MAMP, HTDOCS,  on va y créer simplement un nouveau dossier ici que nous allons appelez « yohannravino.com » 
 
Vous pouvez mettre ici le nom de votre choix. Nous pouvons aller dans ce dossier et collez le contenu du zip WordPress que nous avons téléchargé il y a quelques minutes. On va y coller le contenu  et fermons ces paramètres
 
Nous allons démarrer les serveurs en cliquant sur start server. Une page web de démarrage devrait s’ouvrir dans votre navigateur web.
 
Donc, à partir de là, nous voulons configurer notre base de données pour wordpress 
Une base de données MySQL.
 
Après localhost:8888 taper phpmyadmin
 
A partir d’ici nous voulons créer une nouvelle base de données pour notre site Web.
 
Cliquez sur l’onglet bases de données, créer une date une nouvelle base de données en remplissant le champs et enregistrée.
 
Généralement on l’appelle wordpress mais dans mon cas j’ai mis quelques de different.
 
Revenons ensuite sur le dossier de mon nouveau site web. Et nous voulons trouver un fichier appelé wp-config-sample.php. Copions le et renommons le  wp-config.php
 
Ouvrons cela dans ton IDE préféré. J’utilise Visual Studio Code
 

Right Alignment Of Call To Action

Far far away, behind the word mountains, far from the countries Vokalia.
Faire le test

Nous allons modifier quelques paramètre, pour le nom de la base de données c’est le nom de la database que nous venons de créer il y quelques minutes dans phpmyadmin.
 
Pour le nom d’utilisateur c’est Root. Et le mot de passe est aussi root.
 
Et ces trois derniers réglages peuvent rester tels quels.
 
Nous voulons remplacer authentification. Pour cela copier cette URL et collez-la dans notre navigateur 
Des valeurs apparaissent,  copies-les simplement et colle-les directement dans celles par défaut.
 
Et maintenant, nous devrions être prêts à configurer notre site WordPress.
 
Donc, si nous revenons au navigateur 
 
Aller sur localhost:8888/ le nom que vous avez donner avec fichier pour votre nouveau site web et cela nous présente la célèbre installation wordpress donc nous allons juste 
  • lui donner un titre 
  • Un nom d’utilisateur
  • Votre mots de passe
  • Votre email
Et nous pouvons cocher cette case pour éviter les moteurs de recherche d’indexer ce site. Comme je l’ai dit c’est de toute façon en local.
 
On peut cliquer sur installer Wordpress et nous connecter avec nos identifiants. A ce stade nous avons un site Web WordPress très basiques installés en local 
 
Avant de configurer Gatsby, je veux rapidement vous montrer que l’API WordPress est livrée avec Wordpress afin de récupérez les données en JSON.
 
Nous pouvons aller voir les pages d’exemple 
 
Pour interroger ces données, on écrit dans l’URL localhost:8888/nomdevotresite/ wp-json / wp / v2 / pages
 
Cela nous donnera une liste de pages dans un Format JSON. On peut comparer les données en allant dans l’admin  et nous avons la page d’exemple et on y voir à peu près toutes les données mappé JSON le titre, le contenu ect…
 
Lorsque nous commençerons à utiliser Gatsby et à interroger des données de WordPress à l’aide de GraphQL
Eh bien, nous n’avons pas besoin de connaître ces points car le plug-in Gatsby nous aidera pour interroger ses données.
 
Nous allons simplement construire des requêtes GraphQL depuis Gatsby et je vais vous montrer des chouettes outils GraphQL et cela nous donnera par exemple des informations sur les propriétés disponibles à interroger via l’API WordPress.
 
Mais pour l’instant je trouvais interessant de vous montrer Wordpress au format JSON

A propos de Yohann Ravino

https://www.linkedin.com/in/yohannatticot/

Yohann Ravino est un entrepreneur, auteur et conférencier international. Il travaille avec les cadres supérieurs pour mettre en œuvre son système de «maîtrise de l’organisation» afin d’améliorer considérablement l’efficacité et l’efficience de leurs organisations; leur permettant de devenir des leaders reconnus et hautement récompensés.

Sticky Post
mai 4, 2019

Lance ta première app Ionic 4 en 10 min : Formation developpeur web

Présentation de notre formation developpeur web paris par une introduction avec Ionic et Angular. Ionic est l'une des technologies du moment que vous puissiez apprendre à l'heure actuelle. Elle vous permet d'utiliser une base de code (écrite en HTML, JS et CSS) pour créer et envoyer des applications
Read More
, ,
juin 23, 2019

Formation developpeur web en ligne : Question et Réponse

Deviens développeur Web à part entière en 2019 et obtiens les compétences les plus recherchées! Il s’agit de cours sur les technologie qui connaissent une forte croissance et font désormais partie des languages de développement les plus cotés pour les développeurs. React Js - Angular - Vue JS
Read More
, ,
juin 22, 2019

Qu est ce que Gatsby ? : Formation developpeur web

Tu veux améliorer tes compétences React JS et augmenter ta valeur en tant que développeur front-end ? Mettez à niveau vos compétences de réaction en apprenant Gatsby.js avec un backend Wordpress! Gatsby
Read More
, ,

Leave a Reply