Vad är GraphQL?

07 Oct Vad är GraphQL?

GraphQL låter klienter fråga en applikation efter data.
Du vill kanske visa senaste inläggen på en blog och alla kommentarer från en viss användare?

Den som skrivit REST API:er vet hur svåra de kan vara att underhålla och dokumentera – dessutom krävs ofta många anrop för att få allt data.

Allt det löser GraphQL! ?

GraphQL är ett “query language” som utvecklats av Facebook under MIT license.
Det är oberoende av programspråk och/eller databastyp.

Till skillnad från vanliga API:er är GraphQL självdokumenterande och har därför alltid uppdaterad dokumentation om vilket data som kan hämtas.

GraphQL ger anropande klient möjlighet att styra exakt vilket data som skall returneras vilket innebär att det som annars skulle varit flera anrop kan slås ihop. Svaret skickas som JSON – precis som med ett vanligt REST API.

I “GraphQL playground” (fungerar ungefär som som Postman) visas vilket data som kan efterfrågas, datatyper, mm. Det gör det mycket enkelt att utforma frågor innan de läggs in i koden. Själva använder vi oss av graphql-yoga för NodeJS.

Ladda gärna ner och prova själv. Det tar bara 5 minuter att sätta upp en lokal GraphQL-server och testa.

1. Skapa ett nytt node-projekt
2. Kör npm init (acceptera standardinställningarna genom att trycka enter 6-8 gånger)
3. Installera babel-stöd för ES6/7 (inte nödvändigt, men gör det enklare att skriva kod)
   1.  npm install babel-cli@6.26.0 babel-preset-env@1.7.0
4. Lägg till följande rad i “package.json” under “scipts”-sektionen
   1.  “start”: “babel-node src/index.js”,
5. Skapa mappen src och filen index.js
6. Installera graphql-yoga
   1. npm install graphql-yoga@1.14.10
7. Lägg in nedan kod i index.js

   import {GraphQLServer} from 'graphql-yoga';
   
   //Type definitions (schema)
   const typeDefs = `
     type Query {
     hello: String!
   }
   `;
   
   //Resolvers (functions)
   const resolvers = {
     Query: {
       hello(){
       return'This is my first query';
       }
     }
   }
   
   const server = new GraphQLServer({
     typeDefs,
     resolvers
   });
   
   server.start(
     ()=>{
     console.log('GraphQL server is running on port 4000 (standard))');
     console.log('Please go to http://localhost:4000/playground')
   })
   
   

8. Kör npm run start