One place for hosting & domains

      starting at only

      $3.96/Month

      Comment développer une API REST avec Prisma et PostgreSQL


      L’auteur a choisi le Diversity in Tech Fund​​​​​ pour recevoir un don dans le cadre du programme Write for DOnations.

      Introduction

      Prisma est une boîte à outils de base de données open source. Il se compose de trois outils principaux :

      • Prisma Client : un constructeur de requêtes automatisé de type sécurisé pour Node.js et TypeScript.
      • Prisma Migrate : un système déclaratif de modélisation et de migration de données.
      • Prisma Studio : une interface graphique permettant de visualiser et de modifier les données de votre base de données.

      Ces outils sont conçus pour optimiser la productivité d’un développeur d’applications dans les flux de travail de ses bases de données. L’un des principaux avantages de Prisma réside dans le niveau d’abstraction qu’il offre : Au lieu de trouver des requêtes SQL complexes ou des migrations de schéma, en utilisant Prisma, les développeurs d’applications peuvent travailler avec leur base de données en réfléchissant de manière plus intuitive sur leurs données.

      Dans ce tutoriel, vous allez créer une API REST pour une petite application de blogs dans TypeScript à l’aide de Prisma et d’une base de données PostgreSQL. Vous allez configurer votre base de données PostgreSQL localement avec Docker et implémenter des itinéraires API REST en utilisant Express. À la fin du tutoriel, vous disposerez d’un serveur web qui fonctionne localement sur votre machine, capable de répondre aux diverses demandes HTTP et de lire et écrire des données dans la base de données.

      Conditions préalables

      Ce tutoriel suppose que :

      Il vous sera utile d’avoir des connaissances de base sur les API TypeScript et REST, mais pas nécessaire pour suivre ce tutoriel.

      Étape 1 — Création de votre projet TypeScript

      Au cours de cette étape, vous allez configurer un projet TypeScript simple en utilisant npm. Ce projet constituera la base de l’API REST que vous allez développer tout au long de ce tutoriel.

      Tout d’abord, créez un nouveau répertoire pour votre projet :

      Ensuite, naviguez dans le répertoire et initialisez un projet npm vide. Notez que l’option -y signifie ici signifie que vous ignorez les invites interactives de la commande. Pour parcourir les invites, supprimez -y de la commande :

      Pour plus d’informations sur ces invites, vous pouvez suivre l’étape 1 dans Comment utiliser les modules Node.js avec npm et package.json.

      Vous obtiendrez un résultat similaire à ce qui suit, avec les réponses par défaut en place :

      Output

      Wrote to /.../my-blog/package.json: { "name": "my-blog", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo "Error: no test specified" && exit 1" }, "keywords": [], "author": "", "license": "ISC" }

      Cette commande crée un fichier package.json minimal qui vous servira de fichier de configuration pour votre projet npm. Vous êtes maintenant prêt à configurer TypeScript dans votre projet.

      Exécutez la commande suivante pour procéder à une configuration simple de TypeScript :

      • npm install typescript ts-node @types/node --save-dev

      Vous installerez ainsi trois paquets en tant que dépendances de développement dans votre projet :

      • typescript : la chaîne d’outils TypeScript.
      • ts-node : un paquet qui exécutera les applications TypeScript sans compilation préalable à JavaScript.
      • @types/node : les définitions de type TypeScript pour Node.js.

      La dernière chose à faire consiste à ajouter un fichier tsconfig.json pour vous assurer que TypeScript est correctement configuré pour l’application que vous allez développer.

      Tout d’abord, exécutez la commande suivante pour créer le fichier :

      Ajoutez le code JSON suivant dans le fichier :

      my-blog/tsconfig.json

      {
        "compilerOptions": {
          "sourceMap": true,
          "outDir": "dist",
          "strict": true,
          "lib": ["esnext"],
          "esModuleInterop": true
        }
      }
      

      Enregistrez et quittez le fichier.

      Il s’agit d’une configuration standard et minimale pour un projet TypeScript. Si vous souhaitez en savoir plus sur les propriétés individuelles du fichier de configuration, vous pouvez les consulter dans la documentation de TypeScript.

      Vous avez configuré votre projet TypeScript simple en utilisant npm. Ensuite, vous allez configurer votre base de données PostgreSQL avec Docker et y connecter Prisma.

      Étape 2 — Configuration de Prisma avec PostgreSQL

      Au cours de cette étape, vous allez installer la CLI Prisma, créer votre fichier de schéma Prisma, configurer PostgreSQL avec Docker et y connecter Prisma. Le schéma Prisma est le fichier de configuration principal de votre configuration Prisma et contient votre schéma de base de données.

      Commencez par installer la CLI Prisma avec la commande suivante :

      • npm install @prisma/cli --save-dev

      L’une des meilleures pratiques recommande d’installer la CLI Prisma localement dans votre projet (par opposition à une installation globale). Cela permet d’éviter les conflits de versions dans le cas où vous disposeriez de plusieurs projets Prisma sur votre machine.

      Ensuite, vous allez configurer votre base de données PostgreSQL en utilisant Docker. Créez un nouveau fichier Docker Compose avec la commande suivante :

      Maintenant, ajoutez le code suivant au fichier nouvellement créé :

      my-blog/docker-compose.yml

      version: '3.8'
      services:
        postgres:
          image: postgres:10.3
          restart: always
          environment:
            - POSTGRES_USER=sammy
            - POSTGRES_PASSWORD=your_password
          volumes:
            - postgres:/var/lib/postgresql/data
          ports:
            - '5432:5432'
      volumes:
        postgres:
      

      Ce fichier Docker Compose configure une base de données PostgreSQL qui peut être consultée via le port 5432 du conteneur Docker. Notez également que les informations d’identification de la base de données actuelles sont les suivantes : sammy (utilisateur) et your_password (mot de passe). N’hésitez pas à modifier ces informations d’identification et à utiliser votre nom d’utilisateur et votre mot de passe préférés. Enregistrez et quittez le fichier.

      Une fois cette configuration en place, vous pouvez lancer le serveur de base de données PostgreSQL avec la commande suivante :

      Le résultat de cette commande sera similaire à ce qui suit :

      Output

      Pulling postgres (postgres:10.3)... 10.3: Pulling from library/postgres f2aa67a397c4: Pull complete 6de83ca23e55: Pull complete . . . Status: Downloaded newer image for postgres:10.3 Creating my-blog_postgres_1 ... done

      Vous pouvez vérifier si le serveur de base de données fonctionne avec la commande suivante :

      Vous obtiendrez un résultat similaire à celui-ci :

      Output

      CONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMES 8547f8e007ba postgres:10.3 "docker-entrypoint.s…" 3 seconds ago Up 2 seconds 0.0.0.0:5432->5432/tcp my-blog_postgres_1

      Maintenant que le serveur de la base de données est en cours d’exécution, vous pouvez créer votre configuration Prisma. Exécutez la commande suivante depuis la CLI Prisma :

      Vous obtiendrez le résultat suivant :

      Output

      ✔ Your Prisma schema was created at prisma/schema.prisma. You can now open it in your favorite editor.

      Notez que l’une des meilleures pratiques vous recommande de préfixer toutes les invocations de CLI Prisma avec npx. Vous aurez ainsi la certitude que votre installation locale est bien utilisée.

      Une fois la commande exécutée, la CLI Prisma aura créé un nouveau dossier appelé prisma dans votre projet. Il contient les deux fichiers suivants :

      • schema.prisma : le fichier de configuration principal de votre projet Prisma (comprendra votre modèle de données).
      • .env : un fichier dotenv qui définit l’URL de connexion de votre base de données.

      Pour veiller à ce que Prisma connaisse bien l’emplacement de votre base de données, ouvrez le fichier .env et ajustez la variable de l’environnement DATABASE_URL.

      Tout d’abord, ouvrez le fichier .env :

      Maintenant, vous pouvez configurer la variable d’environnement de la manière suivante :

      my-blog/prisma/.env

      DATABASE_URL="postgresql://sammy:your_password@localhost:5432/my-blog?schema=public"
      

      Veillez à bien remplacer les informations d’identification de la base de données par les données que vous avez spécifiées dans le fichier Docker Compose. Pour en savoir plus sur le format de l’URL de connexion, consultez les docs Prisma.

      Une fois que vous avez terminé, enregistrez et fermez le fichier.

      Au cours de cette étape, vous avez configuré votre base de données PostgreSQL avec Docker, installé la CLI Prisma et connecté Prisma à la base de données via une variable d’environnement. Lors de la section suivante, vous configurerez votre modèle de données et créerez les tableaux de votre base de données.

      Étape 3 — Configuration de votre modèle de données et création des tableaux de base de données

      Au cours de cette étape, vous allez configurer votre data model dans le fichier du schéma Prisma. Ce modèle de données sera ensuite mappé à la base de données avec Prisma Migrate, qui générera et enverra les instructions SQL pour créer les tableaux correspondant à votre modèle de données. Étant donné que vous développez une application de blog, les principales entités de l’application seront les utilisateurs et les publications.

      Prisma utilise son propre langage de modélisation des données pour définir la forme des données de votre application.

      Tout d’abord, ouvrez votre fichier schema.prisma avec la commande suivante :

      • nano prisma/schema.prisma

      Maintenant, ajoutez-y les définitions de modèles suivantes. Vous pouvez placer les modèles au bas du fichier, juste après le bloc generator client :

      my-blog/prisma/schema.prisma

      . . .
      model User {
        id    Int     @default(autoincrement()) @id
        email String  @unique
        name  String?
        posts Post[]
      }
      
      model Post {
        id        Int     @default(autoincrement()) @id
        title     String
        content   String?
        published Boolean @default(false)
        author    User?   @relation(fields: [authorId], references: tag:www.digitalocean.com,2005:/community/tutorials/how-to-build-a-rest-api-with-prisma-and-postgresql-fr)
        authorId  Int?
      }
      

      Enregistrez et quittez le fichier.

      Vous allez définir deux modèles, que vous nommerez User et Post. Chacun de ces modèles possède un certain nombre de fields qui représentent les propriétés du modèle. Les modèles seront mappés sur les tables de base de données ; les champs représentent les colonnes individuelles.

      Notez également qu’il existe une relation de un à plusieurs entre les deux modèles, spécifiés par les champs de relation posts et author sur User et Post. Cela signifie qu’un utilisateur peut être associé à plusieurs publications.

      Une fois ces modèles en place, vous pouvez maintenant créer les tableaux correspondants dans la base de données en utilisant Prisma Migrate. Sur votre terminal, exécutez la commande suivante :

      • npx prisma migrate save --experimental --create-db --name "init"

      Cette commande crée une nouvelle migration sur votre système de fichiers. Voici un aperçu rapide des trois options disponibles avec la commande :

      • --experimental : requise car Prisma Migrates indique actuellement un état experimental.
      • --create-db : permet à Prisma Migrate de créer la base de données nommée my-blog qui est spécifiée dans l’URL de connexion.
      • --name "init" : spécifie le nom de la migration (sera utilisé pour nommer le dossier de migration créé sur votre système de fichiers).

      Le résultat de cette commande sera similaire à ce qui suit :

      Output

      New datamodel: // This is your Prisma schema file, // learn more about it in the docs: https://pris.ly/d/prisma-schema datasource db { provider = "postgresql" url = env("DATABASE_URL") } generator client { provider = "prisma-client-js" } model User { id Int @default(autoincrement()) @id email String @unique name String? posts Post[] } model Post { id Int @default(autoincrement()) @id title String content String? published Boolean @default(false) author User? @relation(fields: [authorId], references: tag:www.digitalocean.com,2005:/community/tutorials/how-to-build-a-rest-api-with-prisma-and-postgresql-fr) authorId Int? } Prisma Migrate just created your migration 20200811140708-init in migrations/ └─ 20200811140708-init/ └─ steps.json └─ schema.prisma └─ README.md

      N’hésitez pas à explorer les fichiers de migration qui ont été créés dans le répertoire prisma/migrations.

      Pour exécuter la migration par rapport à votre base de données et créer les tableaux pour vos modèles Prisma, exécutez la commande suivante dans votre terminal :

      • npx prisma migrate up --experimental

      Vous obtiendrez le résultat suivant :

      Output

      . . . Checking the datasource for potential data loss... Database Changes: Migration Database actions Status 20200811140708-init 2 CreateTable statements. Done 🚀 You can get the detailed db changes with prisma migrate up --experimental --verbose Or read about them here: ./migrations/20200811140708-init/README.md 🚀 Done with 1 migration in 206ms.

      Prisma Migrate génère maintenant les instructions SQL nécessaires à la migration et les envoie à la base de données. Les instructions SQL qui ont créé les tableaux sont les suivantes :

      CREATE TABLE "public"."User" (
        "id" SERIAL,
        "email" text  NOT NULL ,
        "name" text   ,
        PRIMARY KEY ("id")
      )
      
      CREATE TABLE "public"."Post" (
        "id" SERIAL,
        "title" text  NOT NULL ,
        "content" text   ,
        "published" boolean  NOT NULL DEFAULT false,
        "authorId" integer   ,
        PRIMARY KEY ("id")
      )
      
      CREATE UNIQUE INDEX "User.email" ON "public"."User"("email")
      
      ALTER TABLE "public"."Post" ADD FOREIGN KEY ("authorId")REFERENCES "public"."User"("id") ON DELETE SET NULL ON UPDATE CASCADE
      

      Au cours de cette étape, vous avez défini votre modèle de données dans votre schéma Prisma et créé les tableaux des bases de données correspondants avec Prisma Migrate. À l’étape suivante, vous allez installer Prisma Client dans votre projet afin de pouvoir interroger la base de données.

      Étape 4 — Exploration des requêtes Prisma Client dans un script simple

      Prisma Client est un constructeur de requêtes automatisé de type sécurisé qui vous permet de lire et d’écrire des données dans une base de données depuis une application Node.js ou TypeScript. Vous l’utiliserez pour accéder à la base de données dans vos itinéraires API REST, en remplaçant les ORM traditionnelles, les requêtes SQL simples, les couches d’accès aux données personnalisées ou toute autre méthode d’échange avec une base de données.

      Au cours de cette étape, vous allez installer Prisma Client et vous familiariser avec les requêtes que vous pouvez envoyer. Avant d’implémenter les itinéraires de votre API REST au cours des prochaines étapes, vous allez tout d’abord explorer certaines des requêtes Prisma Client dans un script exécutable simple.

      Premièrement, vous pouvez procéder à l’installation de Prisma Client dans votre projet en ouvrant votre terminal et en installant le paquet npm de Prisma Client :

      • npm install @prisma/client

      Ensuite, créez un nouveau répertoire que vous nommerez src. Il contiendra vos fichiers sources :

      Créez maintenant un fichier TypeScript à l’intérieur du nouveau répertoire :

      Toutes les requêtes de Prisma Client renvoient les promesses auxquelles vous pouvez vous attendre dans votre code. Vous devez donc envoyer les requêtes à l’intérieur d’une fonction async.

      Ajoutez le texte standard suivant avec une fonction async qui s’exécutera dans votre script :

      my-blog/src/index.ts

      import { PrismaClient } from '@prisma/client'
      
      const prisma = new PrismaClient()
      
      async function main() {
        // ... your Prisma Client queries will go here
      }
      
      main()
        .catch((e) => console.error(e))
        .finally(async () => await prisma.disconnect())
      

      Voici une rapide décomposition du texte standard :

      1. Importez le constructeur PrismaClient depuis le paquet @prisma/client npm déjà installé.
      2. Instanciez PrismaClient en appelant le constructeur et en obtenant une instance appelée prisma.
      3. Définissez une fonction async que vous appellerez main dans laquelle vous allez ensuite ajouter vos requêtes Prisma Client.
      4. Appelez la fonction main, tout en détectant toute exception potentielle et en vous assurant que Prisma Client ferme toutes les connexions à la base de données ouvertes, en appelant prisma.disconnect().

      Une fois la fonction main en place, vous pouvez commencer à ajouter les requêtes Prisma Client au script. Ajustez index.ts pour que cela ressemble à ce qui suit :

      my-blog/src/index.ts

      import { PrismaClient } from '@prisma/client'
      
      const prisma = new PrismaClient()
      
      async function main() {
        const newUser = await prisma.user.create({
          data: {
            name: 'Alice',
            email: 'alice@prisma.io',
            posts: {
              create: {
                title: 'Hello World',
              },
            },
          },
        })
        console.log('Created new user: ', newUser)
      
        const allUsers = await prisma.user.findMany({
          include: { posts: true },
        })
        console.log('All users: ')
        console.dir(allUsers, { depth: null })
      }
      
      main()
        .catch((e) => console.error(e))
        .finally(async () => await prisma.disconnect())
      

      Dans ce code, vous utilisez deux requêtes Prisma Client :

      • create : crée un nouvel enregistrement User. Notez que, en réalité, vous utilisez une écriture imbriquée, ce qui signifie que vous créez à la fois un enregistrement User et un enregistrement Post dans la même requête.
      • findMany : lit tous les enregistrements User existants depuis la base de données. Vous fournissez l’option include qui charge également les enregistrements de Post correspondants pour chaque enregistrement User.

      Maintenant, exécutez le script avec la commande suivante :

      Vous obtiendrez le résultat suivant dans votre terminal :

      Output

      Created new user: { id: 1, email: 'alice@prisma.io', name: 'Alice' } [ { id: 1, email: 'alice@prisma.io', name: 'Alice', posts: [ { id: 1, title: 'Hello World', content: null, published: false, authorId: 1 } ] }

      Remarque : si vous utilisez une interface graphique de base de données, vous pouvez valider si les données ont bien été créées en examinant les tableaux User et Post. Vous pouvez également explorer les données dans Prisma Studio en exécutant npx prisma studio --experimental.

      Vous avez maintenant utilisé Prisma Client pour lire et écrire des données dans votre base de données. Au cours des étapes restantes, vous allez appliquer ces nouvelles connaissances pour implémenter les itinéraires dans une API REST échantillon.

      Étape 5 — Implémentation de votre premier itinéraire API REST

      Au cours de cette étape, vous allez installer Express dans votre application. Express est un framework web populaire pour Node.js que vous utiliserez pour implémenter vos itinéraires API REST dans ce projet. Le premier itinéraire que vous allez implémenter vous permettra de récupérer tous les utilisateurs de l’API en utilisant une requête GET. Les données utilisateur seront récupérées depuis la base de données en utilisant Prisma Client.

      Vous pouvez maintenant installer Express avec la commande suivante :

      Étant donné que vous utilisez TypeScript, vous devez également installer les types correspondants en tant que dépendances de développement. Pour cela, exécutez la commande suivante :

      • npm install @types/express --save-dev

      Une fois les dépendances installée, vous pouvez configurer votre application Express.

      Commencez par rouvrir votre fichier source principal :

      Maintenant, supprimez l’intégralité du code dans index.ts et remplacez-le par ce qui suit pour lancer votre API REST :

      my-blog/src/index.ts

      import { PrismaClient } from '@prisma/client'
      import express from 'express'
      
      const prisma = new PrismaClient()
      const app = express()
      
      app.use(express.json())
      
      // ... your REST API routes will go here
      
      app.listen(3000, () =>
        console.log('REST API server ready at: http://localhost:3000'),
      )
      

      Voici une décomposition rapide du code :

      1. Importez PrismaClient et express à partir des paquets npm correspondants.
      2. Instanciez PrismaClient en appelant le constructeur et en obtenant une instance appelée prisma.
      3. Créez votre application Express en appelant express().
      4. Ajoutez le logiciel médiateur express.json() pour avoir la certitude que les données de JSON soient correctement traitées par Express.
      5. Lancez le serveur sur le port 3000.

      Maintenant, vous pouvez implémenter votre premier itinéraire. Entre les appels à app.use et app.listen, ajoutez le code suivant :

      my-blog/src/index.ts

      . . .
      app.use(express.json())
      
      app.get('/users', async (req, res) => {
        const users = await prisma.user.findMany()
        res.json(users)
      })
      
      app.listen(3000, () =>
      console.log('REST API server ready at: http://localhost:3000'),
      )
      

      Une fois ajouté, enregistrez et fermez votre fichier. Ensuite, démarrez votre serveur web local en utilisant la commande suivante :

      Vous recevrez le résultat suivant :

      Output

      REST API server ready at: http://localhost:3000

      Pour accéder à l’itinéraire /users, vous pouvez pointer votre navigateur vers http://localhost:3000/users ou tout autre client HTTP.

      Dans ce tutoriel, vous allez tester tous les itinéraire API REST en utilisant curl, un client HTTP basé sur le terminal.

      Note : si vous préférez utiliser un client HTTP basé sur une interface graphique, vous pouvez utiliser des alternatives comme Postwoman ou le Advanced REST Client.

      Pour tester votre itinéraire, ouvrez une nouvelle fenêtre ou un nouveal onglet du terminal (afin que votre serveur web local puisse continuer à fonctionner) et exécutez la commande suivante :

      • curl http://localhost:3000/users

      Vous obtiendrez les données User que vous avez créées au cours de l’étape précédente : 

      Output

      [{"id":1,"email":"alice@prisma.io","name":"Alice"}]

      Notez que, cette fois, le tableau posts n’est pas inclus, étant donné que vous ne faites pas passer l’option include à l’appel findMany dans l’implémentation de l’itinéraire /users.

      Vous avez implémenté votre premier itinéraire API REST au niveau de /users. Au cours de l’étape suivante, vous allez implémenter les autres itinéraires API REST pour ajouter plus de fonctionnalités à votre API.

      Étape 6 — Implémentation des itinéraires API REST restants

      Au cours de cette étape, vous allez implémenter les autres itinéraires API REST de votre application de blog. À la fin, votre serveur web servira diverses requêtes GET, POST, PUT et DELETE.

      Voici un aperçu des différents itinéraires que vous allez implémenter :

      Méthode HTTP Itinéraire Description
      GET /feed Récupère toutes les publications published.
      GET /post/:id Récupère une publication spécifique en utilisant son ID.
      POST /user Crée un nouvel utilisateur.
      POST /post Crée une nouvelle publication (en tant que draft).
      PUT /post/publish/:id Définit le champ published d’une publication comme true.
      DELETE post/:id Supprime une publication en utilisant son ID.

      Vous pouvez maintenant implémenter le reste des itinéraires Get en premier.

      Ouvrez la commande index.ts avec la commande suivante :

      Ensuite, ajoutez le code suivant une fois l’itinéraire /users  implémenté :

      my-blog/src/index.ts

      . . .
      
      app.get('/feed', async (req, res) => {
        const posts = await prisma.post.findMany({
          where: { published: true },
          include: { author: true }
        })
        res.json(posts)
      })
      
      app.get(`/post/:id`, async (req, res) => {
        const { id } = req.params
        const post = await prisma.post.findOne({
          where: { id: Number(id) },
        })
        res.json(post)
      })
      
      app.listen(3000, () =>
        console.log('REST API server ready at: http://localhost:3000'),
      )
      

      Enregistrez et fermez votre fichier

      Ce code implémente les itinéraires API pour deux requêtes GET :

      • /feed : renvoie une liste des posts publiés.
      • /post/:id : renvoie un post spécifique en utilisant son ID.

      Prisma Client est utilisé dans les deux implémentations. Dans l’implémentation de l’itinéraire /feed, la requête que vous envoyez avec Prisma Client filtre pour tous les enregistrements Post pour lesquels la colonne published indique la valeur true. En outre, la requête Prisma Client utilise include pour récupérer les informations liées à l’author pour chaque publication renvoyée. Dans l’implémentation de l’itinéraire /post/:id, faites passer l’ID récupérée depuis le chemin de l’URL afin de lire un enregistrement Post spécifique depuis la base de données.

      Vous pouvez arrêter le serveur en utilisant les touches CTRL+C de votre clavier. Ensuite, redémarrez le serveur en utilisant :

      Pour tester l’itinéraire /feed, vous pouvez utiliser la commande curl suivante :

      • curl http://localhost:3000/feed

      Étant donné qu’aucune publication n’a encore été publiée, la réponse prendra la forme d’un tableau vide :

      Output

      []

      Pour tester l’itinéraire /post/:id, vous pouvez utiliser la commande curl suivante :

      • curl http://localhost:3000/post/1

      Vous obtiendrez la publication que vous avez créée initialement :

      Output

      {"id":1,"title":"Hello World","content":null,"published":false,"authorId":1}

      Ensuite, implémentez les deux itinéraires POST. Ajoutez le code suivant à index.ts après les trois itinéraires GET :

      my-blog/src/index.ts

      . . .
      
      app.post(`/user`, async (req, res) => {
        const result = await prisma.user.create({
          data: { ...req.body },
        })
        res.json(result)
      })
      
      app.post(`/post`, async (req, res) => {
        const { title, content, authorEmail } = req.body
        const result = await prisma.post.create({
          data: {
            title,
            content,
            published: false,
            author: { connect: { email: authorEmail } },
          },
        })
        res.json(result)
      })
      
      app.listen(3000, () =>
        console.log('REST API server ready at: http://localhost:3000'),
      )
      

      Une fois que vous avez terminé, enregistrez et fermez le fichier.

      Ce code implémente les itinéraires API pour deux requêtes POST :

      • /user : crée un nouvel utilisateur dans la base de données.
      • /post : crée une nouvelle publication dans la base de données.

      Comme auparavant, Prisma Client est utilisé dans les deux implémentations. Dans le cadre de l’implémentation de l’itinéraire /user, vous faites passer les valeurs depuis le corps de la requête HTTP à la requête create de Prisma Client.

      L’itinéraire /post exige un peu plus d’implication. Ici, vous ne pouvez pas faire passer les valeurs directement depuis le corps de la requête HTTP. Au contraire, vous devez d’abord les extraire manuellement afin de les transmettre à la requête Prisma Client. En effet, étant donné que la structure de JSON dans le corps de requête ne correspond pas à la structure attendue par Prisma Client. Vous devez donc créer la structure attendue manuellement.

      Vous pouvez tester les nouveaux itinéraires en arrêtant le serveur avec CTRL+C. Ensuite, redémarrez le serveur en utilisant :

      Pour créer un nouvel utilisateur via l’itinéraire /user, vous pouvez envoyer la requête POST suivante avec curl :

      • curl -X POST -H "Content-Type: application/json" -d '{"name":"Bob", "email":"bob@prisma.io"}' http://localhost:3000/user

      Cela créera un nouvel utilisateur dans la base de données, en donnant le résultat suivant :

      Output

      {"id":2,"email":"bob@prisma.io","name":"Bob"}

      Pour créer une nouvelle publication via l’itinéraire /post, vous pouvez envoyer la requête POST suivante avec curl :

      • curl -X POST -H "Content-Type: application/json" -d '{"title":"I am Bob", "authorEmail":"bob@prisma.io"}' http://localhost:3000/post

      Cela créera une nouvelle publication dans la base de données et la connectera à l’utilisateur avec le courriel bob@prisma.io. Cela donne le résultat suivant :

      Output

      {"id":2,"title":"I am Bob","content":null,"published":false,"authorId":2}

      Enfin, vous pouvez implémenter les itinéraires PUT et DELETE.

      Ouvrez la commande index.ts avec la commande suivante :

      Ensuite, une fois les deux itinéraires POST implémentés, ajoutez le code surligné :

      my-blog/src/index.ts

      . . .
      
      app.put('/post/publish/:id', async (req, res) => {
        const { id } = req.params
        const post = await prisma.post.update({
          where: { id: Number(id) },
          data: { published: true },
        })
        res.json(post)
      })
      
      app.delete(`/post/:id`, async (req, res) => {
        const { id } = req.params
        const post = await prisma.post.delete({
          where: { id: Number(id) },
        })
        res.json(post)
      })
      
      app.listen(3000, () =>
        console.log('REST API server ready at: http://localhost:3000'),
      )
      

      Enregistrez et fermez votre fichier

      Ce code implémente les itinéraires API pour une requête PUT et une requête DELETE :

      • /post/publish/:id (PUT) : publie une publication en utilisant son ID.
      • /post/:id (DELETE) : supprime une publication en utilisant son ID.

      À nouveau, Prisma Client est utilisé dans les deux implémentations. Dans le cadre de l’implémentation de l’itinéraire /post/publish/:id, l’ID du message à publier est récupéré depuis l’URL et transmis à la requête update de Prisma Client. L’implémentation de l’itinéraire /post/:id qui permet de supprimer une publication dans la base de données renvoie également l’ID de l’URL et le transmet à la requête delete de Prisma Client.

      Encore une fois, arrêtez le serveur à l’aide des touches CTRL+C de votre clavier. Ensuite, redémarrez le serveur en utilisant :

      Vous pouvez tester l’itinéraire PUT avec la commande curl suivante :

      • curl -X PUT http://localhost:3000/post/publish/2

      Cela vous permettra de publier la publication avec une valeur d’ID de 2. Si vous renvoyez la requête /feed, cette publication sera alors incluse dans la réponse.

      Enfin, vous pouvez tester l’itinéraire DELETE avec la commande curl suivante :

      • curl -X DELETE http://localhost:3000/post/1

      Cela vous permettra de supprimer la publication avec une valeur d’ID de 1. Pour valider le fait que la publication portant cet ID ait été supprimée, vous pouvez renvoyer une requête GET à l’itinéraire /post/1.

      Au cours de cette étape, vous avez implémenté les autres itinéraires API REST de votre application de blog. L’API répond maintenant aux diverses requêtes GET, POST, PUT et DELETE et implémente une fonctionnalité pour lire et écrire des données dans la base de données.

      Conclusion

      Au cours de cet article, vous avez créé un serveur API REST avec plusieurs itinéraires différents pour créer, lire, mettre à jour et supprimer les données utilisateur et de publications pour une application de blog échantillon. À l’intérieur des itinéraires de l’API, vous utilisez le Prisma Client pour envoyer les requêtes correspondantes à votre base de données.

      Ensuite, vous pouvez implémenter des itinéraires API supplémentaires ou étendre le schéma de votre base de données en utilisant Prisma Migrate. Veillez à consulter la documentation de Prisma pour en savoir plus sur les divers aspects de Prisma et à explorer quelques exemples de projets prêts à l’exécution dans le référentiel prisma-examples – en utilisant des outils comme les API GraphQL ou grPC.



      Source link

      Comment développer un site web Drupal 9 sur votre machine locale en utilisant Docker et DDEV


      L’auteur a choisi le Diversity in Tech Fund​​​​​ pour recevoir un don dans le cadre du programme Write for DOnations.

      Introduction

      DDEV est un outil open-source qui utilise Docker dans le but de construire des environnements de développement locaux pour de nombreux cadres PHP différents. Grâce à la puissance de la conteneurisation, DDEV peut grandement simplifier la façon dont vous travaillez sur des projets multiples qui utilisent plusieurs piles technologiques et plusieurs serveurs cloud. DDEV comprend des modèles pour WordPress, Laravel, Magento, TYPO3, Drupal, et plus encore.

      Drupal 9 a été publié le 3 juin 2020 pour le CMS Drupal. Connu pour sa facilité d’utilisation et sa vaste bibliothèque de modules et de thèmes, Drupal est un cadre PHP populaire pour la création et la maintenance de divers sites web et applications de toutes tailles.

      Dans ce tutoriel, vous allez commencer à développer un site web Drupal 9 sur votre machine locale en utilisant DDEV. Cela vous permettra de construire votre site web dans un premier temps, puis, lorsque vous serez prêt, de déployer votre projet sur un serveur de production.

      Conditions préalables

      Pour suivre ce tutoriel, vous aurez besoin de :

      Note : Il est possible de développer Drupal 9 en utilisant DDEV sur un serveur à distance, mais vous aurez besoin d’une solution pour accéder à localhost dans un navigateur web. La commande de DDEV ddev share fonctionne avec ngrok , qui crée un tunnel sécurisé vers votre serveur pour que vous et d’autres parties prenantes puissiez voir votre site de développement. Pour un usage personnel, vous pouvez également installer une interface graphique sur votre serveur à distance et accéder à votre site de développement via un navigateur web à l’intérieur de cette interface. Pour ce faire, vous pouvez suivre notre guide Comment installer et configurer VNC sur Ubuntu 20.04. Pour une solution GUI encore plus rapide, vous pouvez suivre notre guide sur la façon de configurer un bureau à distance avec X2Go sur Ubuntu 20.04.

      Étape 1 — Installer DDEV

      Au cours de cette étape, vous installerez DDEV sur votre machine locale. L’option 1 comprend des instructions pour macOS, tandis que l’option 2 fournit des instructions pour Linux. Ce tutoriel a été testé sur la version 1.15.0 de DDEV.

      Option 1 — Installation de DDEV sur macOS

      DDEV conseille aux utilisateurs de macOS d’installer leur outil en utilisant le gestionnaire de paquets Homebrew . Utilisez la commande brew suivante pour installer la dernière version stable :

      • brew tap drud/ddev && brew install drud/ddev/ddev

      Si vous préférez la version la plus récente, vous pouvez utiliser brew pour installer ddev-edge :

      • brew tap drud/ddev-edge && brew install drud/ddev-edge/ddev

      Si vous avez déjà une version de DDEV installée, ou si vous souhaitez mettre à jour votre version, arrêtez DDEV et utilisez brew pour mettre à jour votre installation :

      • ddev poweroff
      • brew upgrade ddev

      Une fois que vous avez installé ou mis à jour DDEV, exécutez  ddev version pour vérifier votre logiciel :

      Vous verrez un résultat similaire à ce qui suit :

      Output

      DDEV-Local version v1.15.0 commit v1.15.0 db drud/ddev-dbserver-mariadb-10.2:v1.15.0 dba phpmyadmin/phpmyadmin:5 ddev-ssh-agent drud/ddev-ssh-agent:v1.15.0 docker 19.03.8 docker-compose 1.25.5 os darwin router drud/ddev-router:v1.15.0 web drud/ddev-webserver:v1.15.0

      DDEV comprend un puissant CLI, ou interface de ligne de commande. Lancez ddev pour en savoir plus sur certaines commandes courantes :

      Vous verrez le résultat suivant :

      Output

      Create and maintain a local web development environment. Docs: https://ddev.readthedocs.io Support: https://ddev.readthedocs.io/en/stable/#support Usage: ddev [command] Available Commands: auth A collection of authentication commands composer Executes a composer command within the web container config Create or modify a ddev project configuration in the current directory debug A collection of debugging commands delete Remove all project information (including database) for an existing project describe Get a detailed description of a running ddev project. exec Execute a shell command in the container for a service. Uses the web service by default. export-db Dump a database to a file or to stdout help Help about any command hostname Manage your hostfile entries. import-db Import a sql file into the project. import-files Pull the uploaded files directory of an existing project to the default public upload directory of your project. list List projects logs Get the logs from your running services. pause uses 'docker stop' to pause/stop the containers belonging to a project. poweroff Completely stop all projects and containers pull Pull files and database using a configured provider plugin. restart Restart a project or several projects. restore-snapshot Restore a project's database to the provided snapshot version. sequelpro This command is not available since sequel pro.app is not installed share Share project on the internet via ngrok. snapshot Create a database snapshot for one or more projects. ssh Starts a shell session in the container for a service. Uses web service by default. start Start a ddev project. stop Stop and remove the containers of a project. Does not lose or harm anything unless you add --remove-data. version print ddev version and component versions Flags: -h, --help help for ddev -j, --json-output If true, user-oriented output will be in JSON format. -v, --version version for ddev Use "ddev [command] --help" for more information about a command.

      Pour plus d’informations sur l’utilisation de la CLI de DDEV, consultez la documentation officielle de DDEV.

      DDEV étant installée sur votre machine locale, vous êtes maintenant prêt(e) a installer Drupal 9 et à commencer à développer un site web.

      Option 2 — Installer DDEV sur Linux

      Sur un système d’exploitation Linux, vous pouvez installer DDEV en utilisant Homebrew pour Linux ou en utilisant le script d’installation officiel. Sur Ubuntu, commencez par mettre à jour votre liste de paquets dans le gestionnaire de paquets apt (vous pouvez utiliser apt dans Debian, sinon utilisez le gestionnaire de paquets équivalent associé à votre distribution Linux) :

      Installez maintenant quelques paquets pré-requis du dépôt officiel d’Ubuntu :

      • sudo apt install build-essential apt-transport-https ca-certificates software-properties-common curl

      Ces paquets vous permettront de télécharger le script d’installation de DDEV à partir de leur dépôt officiel GitHub.

      Maintenant, téléchargez le script :

      • curl -O https://raw.githubusercontent.com/drud/ddev/master/scripts/install_ddev.sh

      Avant d’exécuter le script, ouvrez-le dans nano ou votre éditeur de texte préféré et inspectez son contenu :

      nano install_ddev.sh
      

      Une fois que vous avez examiné le contenu du script et que vous êtes satisfait(e), enregistrez et fermez le fichier. Vous êtes maintenant prêt à exécuter le script d’installation.

      Utilisez la commande chmod pour rendre le script exécutable :

      Maintenant, lancez le script :

      Le processus d’installation peut vous demander de confirmer certains paramètres ou d’entrer votre mot de passe sudo. Une fois l’installation terminée, DDEV sera disponible sur votre système d’exploitation Linux.

      Exécutez la version ddev pour vérifier votre logiciel :

      Vous verrez un résultat similaire à ce qui suit :

      Output

      DDEV-Local version v1.15.0 commit v1.15.0 db drud/ddev-dbserver-mariadb-10.2:v1.15.0 dba phpmyadmin/phpmyadmin:5 ddev-ssh-agent drud/ddev-ssh-agent:v1.15.0 docker 19.03.8 docker-compose 1.25.5 os linux router drud/ddev-router:v1.15.0 web drud/ddev-webserver:v1.15.0

      DDEV est un puissant CLI, ou interface de ligne de commande. Exécutez ddev sans rien d’autre pour apprendre quelques commandes courantes :

      Vous verrez le résultat suivant :

      Output

      Create and maintain a local web development environment. Docs: https://ddev.readthedocs.io Support: https://ddev.readthedocs.io/en/stable/#support Usage: ddev [command] Available Commands: auth A collection of authentication commands composer Executes a composer command within the web container config Create or modify a ddev project configuration in the current directory debug A collection of debugging commands delete Remove all project information (including database) for an existing project describe Get a detailed description of a running ddev project. exec Execute a shell command in the container for a service. Uses the web service by default. export-db Dump a database to a file or to stdout help Help about any command hostname Manage your hostfile entries. import-db Import a sql file into the project. import-files Pull the uploaded files directory of an existing project to the default public upload directory of your project. list List projects logs Get the logs from your running services. pause uses 'docker stop' to pause/stop the containers belonging to a project. poweroff Completely stop all projects and containers pull Pull files and database using a configured provider plugin. restart Restart a project or several projects. restore-snapshot Restore a project's database to the provided snapshot version. sequelpro This command is not available since sequel pro.app is not installed share Share project on the internet via ngrok. snapshot Create a database snapshot for one or more projects. ssh Starts a shell session in the container for a service. Uses web service by default. start Start a ddev project. stop Stop and remove the containers of a project. Does not lose or harm anything unless you add --remove-data. version print ddev version and component versions Flags: -h, --help help for ddev -j, --json-output If true, user-oriented output will be in JSON format. -v, --version version for ddev Use "ddev [command] --help" for more information about a command.

      Pour plus d’informations sur l’utilisation du CLI de DDEV, vous pouvez consulter la documentation officielle de DDEV.

      DDEV étant installé sur votre machine locale, vous êtes maintenant prêt à déployer Drupal 9 et à commencer à développer un site web.

      Étape 2 — Déployer un nouveau site Drupal 9 en utilisant DDEV

      Avec l’exécution de DDEV, vous allez maintenant l’utiliser pour créer un système de fichiers spécifique à Drupal, installer Drupal 9, et ensuite lancer un projet de site web standard.

      Tout d’abord, vous allez créer un répertoire root du projet et ensuite vous déplacer à l’intérieur de celui-ci. Vous exécuterez toutes les commandes restantes à partir de cet emplacement. Ce tutoriel utilisera d9test , mais vous êtes libre de donner un autre nom à votre répertoire. Notez cependant que DDEV ne gère pas bien les noms avec trait d’union. Il est considéré comme une bonne pratique d’éviter les noms de répertoire comme my-project ou drupal-site-1.

      Créez le répertoire root de votre projet et naviguez à l’intérieur :

      DDEV excelle dans la création d’arborescences de répertoires qui correspondent à des plateformes CMS spécifiques. Utilisez la commande ddev config pour créer une structure de répertoire spécifique à Drupal 9 :

      • ddev config --project-type=drupal9 --docroot=web --create-docroot

      Vous verrez un résultat similaire à ce qui suit :

      Output

      Creating a new ddev project config in the current directory (/Users/sammy/d9test) Once completed, your configuration will be written to /Users/sammy/d9test/.ddev/config.yaml Created docroot at /Users/sammy/d9test/web You have specified a project type of drupal9 but no project of that type is found in /Users/sammy/d9test/web Ensuring write permissions for d9new No settings.php file exists, creating one Existing settings.php file includes settings.ddev.php Configuration complete. You may now run 'ddev start'.

      Parce que vous avez passé --project-type=drupal9 à votre commande ddev config, DDEV a créé plusieurs sous-répertoires et fichiers qui représentent l’organisation par défaut pour un site Drupal. L’arborescence de votre répertoire de projets ressemblera désormais à ceci :

      A Drupal 9 directory tree

      .
      ├── .ddev
      │   ├── .gitignore
      │   ├── config.yaml
      │   ├── db-build
      │   │   └── Dockerfile.example
      │   └── web-build
      │       └── Dockerfile.example
      └── web
          └── sites
              └── default
                  ├── .gitignore
                  ├── settings.ddev.php
                  └── settings.php
      
      6 directories, 7 files
      

      ddev/ sera le dossier principal pour la configuration de ddev. web/ sera le root documentaire de votre nouveau projet ; il contiendra plusieurs fichiers settings. spécifiques. Vous disposez maintenant de la structure initiale pour votre nouveau projet Drupal.

      Votrte prochaine étape consiste à initialiser votre plate-forme, qui permettra de construire les conteneurs et les configurations de réseau nécessaires.  DDEV se lie aux ports 80 et 443, donc si vous utilisez un serveur web comme Apache sur votre machine, ou tout autre chose qui utilise ces ports, arrêtez ces services avant de continuer.

      Utilisez la commande ddev start pour initialiser votre plate-forme :

      Cela permettra de construire tous les conteneurs basés sur Docker pour votre projet, qui comprennent un conteneur web, un conteneur de base de données et phpmyadmin. Une fois l’initialisation terminée, vous verrez un résultat comme celui-ci (votre numéro de port peut être différent) :

      Output

      ... Successfully started d9test Project can be reached at http://d9test.ddev.site http://127.0.0.1:32773

      Note : N’oubliez pas que DDEV démarre les conteneurs Docker en arrière-plan ici. Si vous voulez voir ces conteneurs ou vérifier qu’ils fonctionnent, vous pouvez toujours utiliser la commande docker ps :

      En plus des autres conteneurs que vous utilisez actuellement, vous trouverez quatre nouveaux conteneurs, chacun avec une image différente : php-myadmin, ddev-webserver, ddev-router, et ddev-dbserver-mariadb.

      ddev start a réussi à construire vos conteneurs et vous a donné une sortie avec deux URL. Bien que cette sortie indique que votre projet « can be reached at http://d9test.ddev.site and http://127.0.0.1:32773 », le fait de visiter ces URL maintenant entraînera une erreur. À partir de Drupal 8, le noyau de Drupal et les modules contrib fonctionnent comme des dépendances. Par conséquent, vous devez d’abord terminer l’installation de Drupal à l’aide de Composer, le gestionnaire de paquets pour les projets PHP, avant que tout ne se charge dans votre navigateur web.

      L’une des caractéristiques les plus utiles et les plus élégantes de DDEV est que vous pouvez passer les commandes de Composer par le CLI de DDEV et dans votre environnement conteneurisé. Cela signifie que vous pouvez séparer la configuration spécifique de votre machine de votre environnement de développement. Vous n’avez plus à gérer les différents problèmes de chemin de fichier, de dépendance et de version qui accompagnent généralement le développement local de PHP. De plus, vous pouvez rapidement changer de contexte entre plusieurs projets utilisant différents cadres et piles techniques avec un minimum d’effort.

      Utilisez la commande ddev composer pour télécharger drupal/recommended-project. Cela permettra de télécharger le noyau de Drupal, ses bibliothèques et d’autres ressources connexes, puis de créer un projet par défaut :

      • ddev composer create "drupal/recommended-project"

      Téléchargez maintenant un dernier composant appelé Drush, ou Drupal Shell. Ce tutoriel n’utilisera qu’une seule commande drush, et ce tutoriel fournit une alternative, mais drush est un CLI puissant pour le développement de Drupal qui peut améliorer votre efficacité.

      Utilisez ddev composer pour installer drush :

      • ddev composer require "drush/drush"

      Vous avez maintenant construit un projet Drupal 9 par défaut et installé drush. Vous allez maintenant visualiser votre projet dans un navigateur et configurer les paramètres de votre site web.

      Étape 3 — Configuration de votre projet Drupal 9

      Maintenant que vous avez installé Drupal 9, vous pouvez visiter votre nouveau projet dans votre navigateur. Pour ce faire, vous pouvez relancer ddev start et copier l’une des deux URL qu’il produit, ou vous pouvez utiliser la commande suivante, qui lancera automatiquement votre site dans une nouvelle fenêtre de navigateur :

      Vous y trouverez l’assistant d’installation standard de Drupal.

      Installateur Drupal 9 à partir du navigateur

      Vous avez ici deux possibilités. Vous pouvez utiliser cette interface utilisateur et suivre l’assistant tout au long de l’installation, ou vous pouvez retourner à votre terminal et passer une commande drush via ddev. Cette dernière option automatisera le processus d’installation et définira admin comme votre nom d’utilisateur et votre mot de passe.

      Option 1 — Utiliser l’assistant

      Retournez à l’assistant dans votre navigateur. Sous Choose language, sélectionnez une langue dans le menu déroulant et cliquez sur Save and continue. Sélectionnez maintenant un profil d’installation. Vous pouvez choisir entre Standard , Minimal , et Demo. Faites votre choix, puis cliquez sur Save and continue.  Drupal vérifiera automatiquement vos besoins, mettra en place une base de données et installera votre site. La dernière étape consiste à personnaliser quelques configurations. Ajoutez un nom de site et une adresse électronique de site qui se termine par votre domaine. Choisissez ensuite un nom d’utilisateur et un mot de passe. Choisissez un mot de passe fort et conservez vos informations d’identification dans un endroit sûr. Enfin, ajoutez une adresse électronique privée que vous vérifiez régulièrement, remplissez les paramètres régionaux, puis appuyez sur Save and continue.

      Message de bienvenue de Drupal 9 avec un avertissement sur les autorisations

      Votre nouveau site sera chargé avec un message de bienvenue.

      Option 2 — Utilisation de la ligne de commande

      Depuis le répertoire root de votre projet, lancez la commande ddev exec pour installer un site Drupal par défaut en utilisant drush :

      • ddev exec drush site:install --account-name=admin --account-pass=admin

      Votre site sera créé de la même manière que l’assistant, mais avec quelques configurations standard. Votre nom d’utilisateur et votre mot de passe seront admin.

      Lancez maintenant le site pour le visualiser dans votre navigateur :

      Vous êtes maintenant prêt à commencer à construire votre site web, mais il est considéré comme une bonne pratique de vérifier que vos autorisations sont correctes pour le répertoire /sites/web/default. Lorsque vous travaillez localement, ce n’est pas une préoccupation importante, mais si vous transférez ces autorisations à un serveur de production, elles poseront un risque de sécurité.

      Étape 4 — Vérifier vos autorisations

      Pendant l’installation de l’assistant, ou lors du premier chargement de votre page d’accueil, vous pouvez voir un avertissement concernant les paramètres des permissions dans votre répertoire /sites/web/default et un fichier à l’intérieur de ce répertoire : settings.php.

      Après l’exécution du script d’installation, Drupal essaiera de définir les permissions read et execute pour le répertoire web/sites/default, pour tous les groupes : il s’agit d’un paramètre de permissions 555. read only, ou 444. Si vous rencontrez cet avertissement, exécutez ces deux commandes `chmod` du répertoire root de votre projet. Tout manquement à cette obligation constitue un risque pour la sécurité :

      • chmod 555 web/sites/default
      • chmod 444 web/sites/default/settings.php

      Pour vérifier que vous avez les bonnes autorisations, exécutez la commande ls avec les boutons a , l , h et d :

      • ls -alhd web/sites/default web/sites/default/settings.php

      Vérifiez que vos autorisations correspondent à la sortie suivante :

      Output

      dr-xr-xr-x 8 sammy staff 256 Jul 21 12:56 web/sites/default -r--r--r-- 1 sammy staff 249 Jul 21 12:12 web/sites/default/settings.php

      Vous êtes maintenant prêt(e) à développer un site web Drupal 9 sur votre machine locale.

      Étape 5 — Créer votre premier article dans Drupal

      Pour tester certaines des fonctionnalités de Drupal, vous allez maintenant créer un message en utilisant l’interface utilisateur du web.

      Depuis la page initiale de votre site, cliquez sur le bouton Content dans le menu supérieur à gauche. Cliquez maintenant sur le bouton bleu add content. Une nouvelle page apparaîtra. Cliquez sur Article, et une autre page apparaîtra.

      Drupal 9 Créer une invite d'article  

      Ajoutez le titre et le contenu que vous souhaitez. Vous pouvez également ajouter une image, comme l’un des fonds d’écran de DigitalOcean . Lorsque vous êtes prêt, cliquez sur le bouton bleu save.

      Votre premier article apparaîtra sur votre site web.

      Création d'article par Drupal 9  

      Vous développez maintenant un site web Drupal 9 sur votre machine locale sans jamais interagir avec un serveur grâce à Docker et DDEV. Dans l’étape suivante, vous gérerez le conteneur DDEV afin d’adapter votre flux de travail.

      Étape 6 — Gérer le conteneur DDEV

      Lorsque vous avez terminé le développement de votre projet, ou lorsque vous souhaitez faire une pause, vous pouvez arrêter votre conteneur DDEV sans vous soucier de la perte de données. DDEV peut gérer un changement rapide de contexte parmi de nombreux projets ; c’est l’une de ses caractéristiques les plus utiles. Votre code et vos données sont toujours conservés dans le répertoire de votre projet, même après que vous ayez arrêté ou supprimé le conteneur DDEV.

      Pour libérer des ressources, vous pouvez arrêter DDEV à tout moment. Depuis le répertoire root de votre projet, exécutez la commande suivante :

      DDEV est disponible dans le monde entier, vous pouvez donc exécuter des commandes ddev depuis n’importe quel endroit, à condition de spécifier le projet DDEV :

      Vous pouvez également consulter tous vos projets en même temps en utilisant ddev list :

      DDEV comprend de nombreuses autres commandes utiles.

      Vous pouvez à tout moment relancer DDEV et continuer à vous développer localement.

      Conclusion

      Dans ce tutoriel, vous avez utilisé Docker et la puissance de la conteneurisation pour développer un site Drupal localement, avec l’aide de DDEV. DDEV s’intègre également bien avec de nombreux EDI et fournit un débogage PHP intégré pour Atom, PHPStorm et Visual Studio Code (vscode). Vous pouvez également en apprendre davantage sur la création d’environnements de développement pour Drupal avec DDEV ou sur le développement d’autres cadres PHP comme WordPress .



      Source link