Qu’est-ce que PocketBase et comment l’utiliser ?

Qu’est-ce que PocketBase et comment l’utiliser ?

PocketBase est un backend open source composé d’une base de données SQLite intégrée avec validation des données, abonnements en temps réel et une API REST facile à utiliser. Il offre également une authentification et un stockage de fichiers pour les fichiers multimédias.

PocketBase est parfait pour les projets pour lesquels vous préférez ne pas créer de backend en raison de contraintes de temps ou de commodité, car il est entièrement portable et nécessite une configuration minimale. Il s’intègre également aux technologies populaires telles que Vue, Svelte, React, Angular et Flutter.

Services fournis par PocketBase

PocketBase fournit la plupart des services offerts par d’autres fournisseurs de backend comme SupaBase.

  • Base de données SQLite : PocketBase inclut une base de données SQLite embarquée. Cela diffère des autres fournisseurs de backend qui utilisent des bases de données plus volumineuses comme PostgreSQL ou MySQL. L’utilisation de SQLite rend PocketBase plus léger. Vous pouvez également vous abonner à des événements de base de données en temps réel via une API.
  • Authentification : PocketBase prend en charge l’authentification par e-mail/mot de passe et l’authentification OAuth2 via Facebook, Google, GitLab et GitHub.
  • Stockage de fichiers : vous pouvez télécharger des photos, des fichiers audio et vidéo vers un stockage local ou un compartiment S3 à l’aide de PocketBase.
  • Tableau de bord Admin : Le tableau de bord Admin vous permet de créer et de gérer des collections dans la base de données. Vous pouvez également télécharger des fichiers, afficher les fichiers journaux et configurer le paramètre d’envoi d’e-mails,

Selon les documents, PocketBase peut servir facilement plus de 10 000 connexions simultanées et persistantes en temps réel sur 6 serveurs privés virtuels, ce qui en fait un choix de backend abordable pour les petites et moyennes applications.

Notez que PocketBase ne se met à l’échelle que verticalement. Cela signifie que vous devez ajouter plus de CPU et de RAM pour augmenter la puissance de traitement. Si vous avez une grande application, envisagez un fournisseur de backend comme Firebase qui permet une mise à l’échelle horizontale.

Premiers pas avec PocketBase

Actuellement, PocketBase fournit deux SDK :

  • Un SDK JavaScript que vous pouvez utiliser avec des frameworks JavaScript comme Svelte, React, Vue et Angular.
  • Un SDK Dart pour les applications Flutter.

La façon la plus simple de commencer est de télécharger PocketBase . Il existe plusieurs liens, alors assurez-vous de télécharger celui qui est compatible avec votre environnement.

Une fois que vous l’avez téléchargé, extrayez-le et accédez au dossier pocketbase. Exécutez ensuite cette commande dans un terminal :

./pocketbase serve

Cette commande doit démarrer un serveur Web sur ces routes.

  • Serveur : http://127.0.0.1:8090/
  • API REST : http://127.0.0.1:8090/api/
  • Interface utilisateur d’administration : http://127.0.0.1:8090/_/

Accédez à l’URL http://127.0.0.1:8090/_/ pour créer votre première collection à l’aide du tableau de bord d’administration.

Créer une collection dans PocketBase

La première fois que vous ouvrez l’interface utilisateur d’administration, il vous sera demandé une adresse e-mail et un mot de passe pour créer un compte administrateur.

Voici à quoi ressemble l’interface utilisateur d’administration :

Interface utilisateur d'administration de Pocketbase

Cliquez sur le bouton Nouvelle collection dans l’interface utilisateur d’administration pour ouvrir un panneau de collection que vous pouvez remplir avec des détails pour créer une nouvelle collection.

Voici comment créer une collection appelée todos composée d’un titre et de champs remplis :

Collection Todo pocketbase

Une collection peut être une collection de base ou auth. Une collection de base est le type de collection par défaut et vous pouvez l’utiliser pour tout type de données. Une collection d’authentification contient des champs supplémentaires pour gérer les utilisateurs, comme le nom d’utilisateur, l’e-mail et la vérification.

Vous n’avez pas besoin d’utiliser l’interface utilisateur d’administration pour créer une collection ; vous pouvez en créer un à l’aide de l’API Web. Les documents PocketBase fournissent des exemples spécifiques au SDK sur la façon de créer et de gérer des collections via l’API. Vous pouvez créer, afficher, mettre à jour, supprimer ou importer des collections.

Utilisation de PocketBase dans une application React

Le SDK JavaScript vous permet d’interagir avec PocketBase à partir d’un projet React.

Pour suivre, commencez par créer un projet React.

Ensuite, installez le SDK JavaScript PocketBase dans votre projet React via npm :

npm install pocketbase --save

Ensuite, dans app.js, importez PocketBase et initialisez-le.

import PocketBase from 'pocketbase';
const pb = new PocketBase('http://127.0.0.1:8090');

Pour illustrer comment PocketBase intègre React, vous allez créer les fonctions d’assistance pour une application de tâches. Ces fonctions créeront, mettront à jour, récupéreront et supprimeront des éléments.

Créer un élément de tâche

Dans app.js, créez une fonction appelée addTodo.

const addTodo = async (todo) => {
try {
   const record = await await pb.collection("todos").create(todo);
   return record;
 } catch (error) {
   return { error: error.message };
 }
};

Cette fonction ajoute un nouvel enregistrement dans la collection todos.

Mettre à jour un élément Todo

Pour mettre à jour un enregistrement dans la collection todo, créez une fonction appelée updateTodo et utilisez la méthode update.

const updateTodo = async (record_id, todo) => {
try {
   const record = await pb.collection("todos").update(record_id, todo);
   return record;
 } catch (error) {
   return { error: error.message };
 }
};

La fonction updateTodo trouve l’élément de tâche en fonction de l’ID d’enregistrement et le met à jour avec les nouvelles données.

Supprimer un élément Todo

Dans app.js, créez une fonction appelée deleteTodo qui supprime un enregistrement dans la collection todo.

const deleteTodo = async (record_id) => {
try {
   await pb.collection("todos").delete(record_id);
 } catch (error) {
   return { error: error.message };
 }
};

Récupérer un élément Todo

Vous pouvez récupérer un seul élément de tâche ou tous les éléments de la collection.

Cette fonction récupère un seul élément de tâche par identifiant :

const getTodo = async (record_id) => {
try {
   const record = await pb.collection("todos").getOne(record_id, {
     expand: "relField1,relField2.subRelField",
   });
   return record
 } catch (error) {
   return { error: error.message };
 }
};

Tandis que la fonction ci-dessous récupérera tous les enregistrements de la collection de tâches :

const getTodos = async (record_id) => {
  try {
    const records = await pb
      .collection("todos")
      .getFullList(200 /* batch size */, {
        sort: "-created",
      });
    return records;
  } catch (error) {
    return { error: error.message };
  }
}

Vous pouvez utiliser ces fonctions pour créer et mettre à jour l’interface utilisateur de l’application.

Pour des exemples plus détaillés, consultez la documentation de l’ API des enregistrements PocketBase ou la documentation de l’API générée dans « Interface utilisateur d’administration > Collections > Aperçu de l’API ». Vous devriez pouvoir accéder à la liste, afficher, créer, mettre à jour, supprimer et à la documentation en temps réel de votre collection.

documentation API générée

Pourquoi devriez-vous utiliser PocketBase

PocketBase est le meilleur backend pour les petits et moyens projets. Il nécessite une configuration minimale et est facile à utiliser. Il propose deux SDK client (un SDK JavaScript et un SDK Dart) et vous pouvez l’utiliser dans des applications Web et mobiles.

PocketBase est également auto-hébergé et vous pouvez l’héberger sur un serveur local ou un VPS. Bien qu’il ne prenne pas en charge les fonctions cloud, vous pouvez l’utiliser comme framework Go et créer votre propre application avec une logique métier personnalisée.

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *