GraphQL - Configuración del entorno
En este capítulo, aprenderemos sobre la configuración del entorno para GraphQL. Para ejecutar los ejemplos de este tutorial, necesitará lo siguiente:
Una computadora con Linux, macOS o Windows.
Un navegador web, preferiblemente la última versión de Google Chrome.
Una versión reciente de Node.js instalada. Se recomienda la última versión de LTS.
Visual Studio Code con la extensión GraphQL para VSCode instalada o cualquier editor de código de su elección.
Cómo construir un servidor GraphQL con Nodejs
Pasaremos por un enfoque detallado paso a paso para construir el servidor GraphQL con Nodejs como se muestra a continuación:
Paso 1: verificar las versiones de nodo y Npm
Después de instalar NodeJs, verifique la versión de node y npm usando los siguientes comandos en la terminal:
C:\Users\Admin>node -v
v8.11.3
C:\Users\Admin>npm -v
5.6.0
Paso 2: cree una carpeta de proyecto y ábrala en VSCode
La carpeta raíz del proyecto puede denominarse test-app.
Abra la carpeta usando el editor de código de Visual Studio siguiendo las instrucciones a continuación:
C:\Users\Admin>mkdir test-app
C:\Users\Admin>cd test-app
C:\Users\Admin\test-app>code.
Paso 3: cree package.json e instale las dependencias
Cree un archivo package.json que contendrá todas las dependencias de la aplicación del servidor 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"
}
}
Instale las dependencias usando el comando como se indica a continuación:
C:\Users\Admin\test-app>npm install
Paso 4: crear una base de datos de archivos planos en la carpeta de datos
En este paso, usamos archivos planos para almacenar y recuperar datos. Crea una carpeta de datos y agrega dos archivosstudents.json y colleges.json.
Lo siguiente es el colleges.json archivo -
[
{
"id": "col-101",
"name": "AMU",
"location": "Uttar Pradesh",
"rating":5.0
},
{
"id": "col-102",
"name": "CUSAT",
"location": "Kerala",
"rating":4.5
}
]
Lo siguiente es el students.json archivo -
[
{
"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"
}
]
Paso 5: crear una capa de acceso a datos
Necesitamos crear un almacén de datos que cargue el contenido de la carpeta de datos. En este caso, necesitamos variables de colección, estudiantes y universidades . Siempre que la aplicación necesita datos, utiliza estas variables de colección.
Cree el archivo db.js en la carpeta del proyecto de la siguiente manera:
const { DataStore } = require('notarealdb');
const store = new DataStore('./data');
module.exports = {
students:store.collection('students'),
colleges:store.collection('colleges')
};
Paso 6: crear un archivo de esquema, schema.graphql
Cree un archivo de esquema en la carpeta del proyecto actual y agregue el siguiente contenido:
type Query {
test: String
}
Paso 7: crear un archivo de resolución, resolvers.js
Cree un archivo de resolución en la carpeta del proyecto actual y agregue el siguiente contenido:
const Query = {
test: () => 'Test Success, GraphQL server is up & running !!'
}
module.exports = {Query}
Paso 8: crear Server.js y configurar GraphQL
Cree un archivo de servidor y configure GraphQL de la siguiente manera:
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}`
)
);
Paso 9: Ejecute la aplicación y pruebe con GraphiQL
Verifique la estructura de carpetas de la aplicación de prueba del proyecto de la siguiente manera:
test-app /
-->package.json
-->db.js
-->data
students.json
colleges.json
-->resolvers.js
-->schema.graphql
-->server.js
Ejecute el comando npm start como se indica a continuación:
C:\Users\Admin\test-app>npm start
El servidor se ejecuta en el puerto 9000, por lo que podemos probar la aplicación usando la herramienta GraphiQL. Abra el navegador e ingrese la URL http: // localhost: 9000 / graphiql. Escriba la siguiente consulta en el editor:
{
Test
}
La respuesta del servidor se da a continuación:
{
"data": {
"test": "Test Success, GraphQL server is running !!"
}
}