GraphQL - Configurazione dell'ambiente

In questo capitolo impareremo la configurazione ambientale per GraphQL. Per eseguire gli esempi in questo tutorial avrai bisogno di quanto segue:

• Un computer con Linux, macOS o Windows.

• Un browser web, preferibilmente l'ultima versione di Google Chrome.

• È installata una versione recente di Node.js. Si consiglia l'ultima versione di LTS.

• Visual Studio Code con estensione GraphQL per VSCode installata o qualsiasi editor di codice di tua scelta.

Come costruire un server GraphQL con Nodejs

Passeremo attraverso un approccio graduale dettagliato per costruire il server GraphQL con Nodejs come mostrato di seguito -

Passaggio 1: verifica delle versioni di Node e Npm

Dopo aver installato NodeJs, verificare la versione di node e npm utilizzando i seguenti comandi sul terminale:

C:\Users\Admin>node -v
v8.11.3

C:\Users\Admin>npm -v
5.6.0

Passaggio 2: creare una cartella del progetto e aprirla in VSCode

La cartella principale del progetto può essere denominata app di test.

Apri la cartella utilizzando l'editor di codice di Visual Studio utilizzando le istruzioni seguenti:

C:\Users\Admin>mkdir test-app
C:\Users\Admin>cd test-app
C:\Users\Admin\test-app>code.

Passaggio 3: creare package.json e installare le dipendenze

Creare un file package.json che conterrà tutte le dipendenze dell'applicazione del server GraphQL.

{
   "name": "hello-world-server",
   "private": true,
   "scripts": {
      "start": "nodemon --ignore data/ server.js"
   },
   
   "dependencies": {
      "apollo-server-express": "^1.4.0",
      "body-parser": "^1.18.3",
      "cors": "^2.8.4",
      "express": "^4.16.3",
      "graphql": "^0.13.2",
      "graphql-tools": "^3.1.1"
   },
   
   "devDependencies": {
      "nodemon": "1.17.1"
   }
}

Installa le dipendenze utilizzando il comando come indicato di seguito:

C:\Users\Admin\test-app>npm install

Passaggio 4: creare un database di file flat nella cartella dei dati

In questo passaggio, utilizziamo file flat per archiviare e recuperare i dati. Crea una cartella dati e aggiungi due filestudents.json e colleges.json.

Di seguito è riportato il file colleges.json file -

[
   {
      "id": "col-101",
      "name": "AMU",
      "location": "Uttar Pradesh",
      "rating":5.0
   },
   
   {
      "id": "col-102",
      "name": "CUSAT",
      "location": "Kerala",
      "rating":4.5
   }
]

Di seguito è riportato il file students.json file -

[
   {
      "id": "S1001",
      "firstName":"Mohtashim",
      "lastName":"Mohammad",
      "email": "[email protected]",
      "password": "pass123",
      "collegeId": "col-102"
   },
   
   {
      "id": "S1002",
      "email": "[email protected]",
      "firstName":"Kannan",
      "lastName":"Sudhakaran",
      "password": "pass123",
      "collegeId": "col-101"
   },
   
   {
      "id": "S1003",
      "email": "[email protected]",
      "firstName":"Kiran",
      "lastName":"Panigrahi",
      "password": "pass123",
      "collegeId": "col-101"
   }
]

Passaggio 5: creare un livello di accesso ai dati

Dobbiamo creare un datastore che carichi il contenuto della cartella dati. In questo caso, abbiamo bisogno di variabili di raccolta, studenti e college . Ogni volta che l'applicazione necessita di dati, utilizza queste variabili di raccolta.

Crea il file db.js con nella cartella del progetto come segue:

const { DataStore } = require('notarealdb');

const store = new DataStore('./data');

module.exports = {
   students:store.collection('students'),
   colleges:store.collection('colleges')
};

Passaggio 6: creare il file dello schema, schema.graphql

Crea un file schema nella cartella del progetto corrente e aggiungi i seguenti contenuti:

type Query  {
   test: String
}

Passaggio 7: creare un file Resolver, resolvers.js

Crea un file resolver nella cartella del progetto corrente e aggiungi i seguenti contenuti:

const Query = {
   test: () => 'Test Success, GraphQL server is up & running !!'
}
module.exports = {Query}

Passaggio 8: creare Server.js e configurare GraphQL

Crea un file server e configura GraphQL come segue:

const bodyParser = require('body-parser');
const cors = require('cors');
const express = require('express');
const db = require('./db');

const port = process.env.PORT || 9000;
const app = express();

const fs = require('fs')
const typeDefs = fs.readFileSync('./schema.graphql',{encoding:'utf-8'})
const resolvers = require('./resolvers')

const {makeExecutableSchema} = require('graphql-tools')
const schema = makeExecutableSchema({typeDefs, resolvers})

app.use(cors(), bodyParser.json());

const  {graphiqlExpress,graphqlExpress} = require('apollo-server-express')
app.use('/graphql',graphqlExpress({schema}))
app.use('/graphiql',graphiqlExpress({endpointURL:'/graphql'}))

app.listen(
   port, () => console.info(
      `Server started on port ${port}`
   )
);

Passaggio 9: eseguire l'applicazione e testare con GraphiQL

Verificare la struttura delle cartelle dell'app di test del progetto come segue:

test-app /
   -->package.json
   -->db.js
   -->data
      students.json
      colleges.json
   -->resolvers.js
   -->schema.graphql
   -->server.js

Esegui il comando npm start come indicato di seguito -

C:\Users\Admin\test-app>npm start

Il server è in esecuzione sulla porta 9000, quindi possiamo testare l'applicazione utilizzando lo strumento GraphiQL. Apri il browser e inserisci l'URL http: // localhost: 9000 / graphiql. Digita la seguente query nell'editor:

{
   Test 
}

Di seguito viene fornita la risposta dal server:

{
   "data": {
      "test": "Test Success, GraphQL server is running !!"
   }
}