venerdì, Luglio 12, 2024

Come creare un’API GraphQL con Apollo Server e MongoDB

Uno dei fattori più cruciali da considerare durante la progettazione di un’applicazione è il tipo di architettura API da utilizzare. Una progettazione API efficiente è fondamentale per garantire che le app siano performanti per tutto il loro ciclo di vita.

L’architettura RESTful è l’approccio più popolare, ma presenta uno svantaggio significativo: una struttura di endpoint fissa che restituisce dati predeterminati. Questo design può comportare una comunicazione inefficiente.

Al contrario, GraphQL, un’alternativa a REST, offre maggiore flessibilità consentendoti di richiedere solo i dati di cui hai bisogno.

Cosa sono le API GraphQL?

GraphQL è un linguaggio di query che puoi usare per scrivere API di backend (Application Programming Interface). A differenza delle API REST, che hanno più endpoint per dati diversi, le API GraphQL hanno un solo punto di ingresso.

I clienti possono specificare i dati di cui hanno bisogno nelle loro query da questo singolo punto di ingresso, rendendolo più flessibile ed efficiente per il recupero solo dei dati necessari.

In poche parole, un’API GraphQL implementa l’architettura GraphQL descritta da Specifiche GraphQL. Questa progettazione implica la definizione dello schema, delle query e delle mutazioni con cui i client possono interagire.

Ecco una ripartizione semplificata dei componenti essenziali dell’architettura dell’API GraphQL:

  1. Schema: uno schema è una descrizione dei tipi di dati e operazioni forniti dall’API. Fondamentalmente, uno schema definisce la struttura dei dati disponibili e il tipo di query e mutazioni che un client può eseguire per modificare i dati.
  2. Query: i client utilizzano le query per recuperare i dati dal database specificando la struttura dei dati di cui hanno bisogno. Inoltre, possono nidificare più query in una singola richiesta HTTP per recuperare i dati correlati da più endpoint.
  3. Mutazioni: le mutazioni sono operazioni utilizzate per modificare i dati nel database. I client possono inviare richieste di mutazione per creare, aggiornare o eliminare dati.

Imposta un database MongoDB

Per iniziare, crea un database MongoDB. In alternativa, puoi configurare gratuitamente un cluster MongoDB nel cloud. Dopo aver configurato il database, copia la stringa URI di connessione al database di MongoDB.

Crea un server Apollo

Server dell’Apollo è una popolare implementazione del server GraphQL che ti consentirà di creare API GraphQL in ambienti JavaScript, inclusi Node.js, Express e altri.

Crea una directory per un nuovo progetto e CD dentro:

mkdir graphql-API-mongoDB
cd graphql-API-mongoDB

Successivamente, inizializza un nuovo progetto Node.js.

npm init --yes

Questo comando crea un file pacchetto.json file.

Installa le dipendenze richieste

Eseguire il seguente comando per installare i pacchetti.

npm install apollo-server graphql mongoose

Infine, crea un file index.js file nella directory principale del progetto.

Configura il server Apollo

Aprire index.js e aggiungi il codice qui sotto:

const { ApolloServer } = require('apollo-server');
const mongoose = require('mongoose');
const typeDefs = require("./graphql/typeDefs");
const resolvers = require("./graphql/resolvers");

const server = new ApolloServer({
typeDefs,
resolvers
});


const MONGO_URI = ‘mongodb://localhost:27017’;


mongoose
.connect(MONGO_URI, {
useNewUrlParser: true,
useUnifiedTopology: true,
})
.then(() => {
console.log(`Db Connected`);
return server.listen({ port: 5000 });
})
.then((res) => {
console.log(`Server running at ${res.url}`);
})
.catch(err => {
console.log(err.message);
});


 


Questo codice inizializza un server GraphQL locale utilizzando la libreria Apollo Server. Quindi stabilisce una connessione a un database MongoDB con l’URI di connessione specificato.

Nota come il codice passa due argomenti alla nuova istanza di ApolloServer: typeDefs e resolver. Questi specificano i tipi di dati e le operazioni che l’API GraphQL può eseguire.

Dopo aver impostato la connessione al database MongoDB, il server inizia l’ascolto sulla porta 5000.

Definire il modello di dati

Crea una nuova cartella nella directory principale della cartella del progetto e assegnale un nome Modelli. In questa cartella, crea un nuovo nome file dataModel.js e aggiungervi il seguente codice:

const {model, Schema} = require('mongoose');

const employeeSchema = new Schema({
name: String,
department: String,
salary: String,
});


module.exports = model(‘Employee’, employeeSchema);


 


Definire lo schema GraphQL

Uno schema GraphQL definisce la struttura dei dati che puoi interrogare utilizzando l’API GraphQL. Lo schema delinea anche le query e le mutazioni che l’API può eseguire. È possibile utilizzare le query per recuperare i dati e le mutazioni per modificarli.

Nella directory principale del tuo progetto, crea una nuova cartella e assegnale un nome graphql. All’interno di questa cartella, aggiungi due file: typeDefs.js E resolver.js

Aggiungi il codice seguente nel file typeDefs.js:

const {gql} = require("apollo-server");

const typeDefs = gql`
type Employee {
id: ID!
name: String
department: String
salary: String
}
input EmployeeInput {
name: String
department: String
salary: String
}
type Query {
getEmployee(id: ID): Employee #return Employee by id
employees: (Employee) #return array of Employees
}
type Mutation {
createEmployee(employeeInput: EmployeeInput): Employee
updateEmployee(id: ID, employeeInput: EmployeeInput): Boolean
deleteEmployee(id: ID): Boolean
}
`;


module.exports = typeDefs;


 


Questo codice sopra usa il gql funzione fornita dal pacchetto apollo-server per creare uno schema GraphQL per i dati Employee.

Lo schema è costituito da quattro elementi principali: tipi di dati per le informazioni sui dipendenti, tipi di input, query e mutazioni che l’API può eseguire.

Definire i resolver per l’API GraphQL

Un resolver è una funzione GraphQL che definisce i dati da trasmettere quando un client invia una query API per recuperare i dati. In sostanza, il suo ruolo principale è recuperare i dati richiesti dall’origine dati specificata e restituirli al client.

Aggiungi il codice qui sotto al file resolver.js file nel graphql cartella. I resolver, in questo caso, sono specificati all’interno degli oggetti Query e Mutation.

L’oggetto Query definisce due metodi: dipendenti E getEmployee. Questi metodi sono responsabili del recupero dei dati dei dipendenti dal database su richiesta di un cliente.

const Employee= require("../models/employeesModel");

const resolvers = {
Query: {
employees: async () => {
try {
const employees = await Employee.find({});
return employees;
} catch (error) {
console.error(error);
throw new Error(‘Failed to fetch employees’);
}
},
getEmployee: async (parent, args) => {
try {
const employee = await Employee.findById(args.id);
return employee;
} catch (error) {
console.error(error);
throw new Error(‘Failed to fetch employee by ID’);
}
},
},


 


L’oggetto Mutazione ha tre metodi: createEmployee, updateDipendenteE deleteDipendente. Questi metodi apportano modifiche ai dati archiviati nel database MongoDB.

  Mutation: {
    async createEmployee (_, { employeeInput: { name, department, salary } }) {
      const newEmployee = new Employee({
        name: name,
        department: department,
        salary: salary
      });

const response = await newEmployee.save();
console.log(newEmployee);


return {
id: response._id,
…response._doc
}
},


async updateEmployee (_, {id, employeeInput: {name, department, salary}}) {
const updatedEmployee = await Employee.updateOne(
{ _id: id },
{ name, department, salary }
);


if (!updatedEmployee) {
throw new Error(`Employee with ID: ${id} not found`);
}


return true;
},


async deleteEmployee (_, {id}) {
const deletedEmployee = await Employee.deleteOne({ _id: id });

if (!deletedEmployee || deletedEmployee.deletedCount === 0) {
throw new Error(`Employee with ID ${id} not found`);
}


return true;
},
},
};


module.exports = resolvers;


 


Infine, esegui questo comando per avviare il server:

node index.js

Una volta stabilita una connessione al database, il server si avvierà sulla porta 5000.

Puoi andare avanti e testare la funzionalità dell’API GraphQL effettuando richieste HTTP dal playground GraphQL nel tuo browser.

Ad esempio, puoi utilizzare il createEmployee mutazione per aggiungere nuovi dati dei dipendenti nel database MongoDB.

Implementazione dell'API GraphQL sul browser utilizzando il client playground di GraphQL

GraphQL sta guadagnando terreno nella comunità degli sviluppatori come approccio di progettazione API alternativo alla popolare architettura REST.

Ciò è dovuto alla sua capacità di fornire un modo più flessibile ed efficiente per recuperare i dati da varie fonti, il tutto da un unico punto di ingresso. Ciò evita di dover gestire più endpoint per dati diversi, che è un problema comune con l’architettura dell’API REST. Questa soluzione di progettazione semplifica il processo di creazione e gestione delle API di back-end.

ARTICOLI COLLEGATI:

ULTIMI ARTICOLI: