GraphQL-zelfstudie voor beginners: wat is, functies en voorbeelden

Wat is GraphQL?

GraphQL is een server-side technologie op de applicatielaag die door Facebook is ontwikkeld voor het uitvoeren van zoekopdrachten met bestaande gegevens. GraphQL kan RESTful API-aanroepen optimaliseren. Het biedt een declaratieve manier om uw gegevens op te halen en bij te werken. GraphQL helpt u gegevens van server naar client te laden. Het stelt programmeurs in staat om de soorten verzoeken te kiezen die ze willen doen.

Waarom GraphQL gebruiken?

Following zijn de redenen om GraphQL te gebruiken:

  • Het biedt een voor mensen leesbare zoekopdracht.
  • In GraphQL is het heel gemakkelijk om met veel databases om te gaan.
  • Het is geschikt voor microservices en complex systemen.
  • U kunt gegevens ophalen met een enkele API-aanroep.
  • Het helpt u bij het batchen en cachen van query's.
  • U wordt niet geconfronteerd met over- en onderophaalproblemen.
  • Aanvragen afstemmen op uw behoeften.
  • Het helpt u het schema in het juiste formaat te ontdekken.
  • GraphQL houdt de documentatie automatisch gesynchroniseerd met API-wijzigingen.
  • API-evolutie is mogelijk zonder versiebeheer.
  • GraphQL-velden worden gebruikt in meerdere query's die kunnen worden gedeeld met een hoger componentniveau voor hergebruik.
  • U kunt kiezen welke functies u wilt weergeven en hoe ze werken.
  • Het kan worden gebruikt voor snelle prototypering van toepassingen.

Toepassingen van GraphQL

Dit zijn de belangrijke toepassingen van GraphQL:

  • Het biedt Relay en andere clientframeworks
  • GraphQL helpt u de prestaties van de mobiele app te verbeteren.
  • Het kan het overhaalprobleem verminderen door de cloudservice aan de serverzijde te verlagen en het netwerkgebruik aan de clientzijde te verminderen.
  • Het kan worden gebruikt wanneer de clienttoepassing moet specificeren welke velden nodig zijn in een lang query-formaat.
  • GraphQL kan volledig benut worden wanneer u functionaliteit moet toevoegen aan uw oude of bestaande API.
  • Het wordt gebruikt wanneer u com moet vereenvoudigenplex API.
  • Mix en mash gevelpatroon, dat vaak wordt gebruikt bij objectgeoriënteerd programmeren.
  • Wanneer u gegevens van meer dan één plaats in één handige API moet samenvoegen.
  • U kunt GraphQL gebruiken als abstractie op een bestaande API om de responsstructuur te specificeren op basis van gebruikersbehoeften.

Wat moet je leren voordat je GraphQl leert?

Deze GraphQL-tutorial is gebaseerd op Uitdrukken en KnooppuntJs. Daarom kunt u GraphQL heel gemakkelijk leren met een basiskennis van NodeJS.

GraphQL-sleutelcomponenten

Laten we nu in deze GraphQL-tutorial de belangrijkste componenten van GraphQL leren:

GraphQL-sleutelcomponenten
GraphQL-sleutelcomponenten

Zoals weergegeven in de bovenstaande afbeelding, zijn er drie belangrijke componenten van GraphQL: 1) Query, 2) Resolver en 3) Schema.

Vraag

De Query is een API-verzoek dat wordt gedaan door de clientmachinetoepassing. Het ondersteunt augments en verwijst naar arrays. Query wordt gebruikt om waarden te lezen of op te halen.

Onderdelen van de zoekopdracht:

Following zijn de belangrijke onderdelen van Query

  1. Veld:

Een veld geeft eenvoudigweg aan dat we de server om bepaalde informatie vragen. Volgwing is een GraphQL-voorbeeld van een veld in de graphQL-query.

query {
    team {
        id name
    }
}

"data": {
    "team":[ {
        "id": 1, 
        "name": "Avengers"
    }
    ,
    …
]
}
}

In het bovenstaande GraphQL-voorbeeld vragen we de server om het veld team en de subvelden ervan, zoals id en naam. De GraphQL-server retourneert gegevens waar we om hebben gevraagd.

  1. argumenten

In REST, kunnen we slechts één set argumenten doorgeven als URL-segmenten en queryparameters. Om een ​​bepaald profiel te krijgen, ziet een typische REST-oproep er als volgt uitwing:

GET /api'team?id=2 Content-Type: application JSON
 {
    "id": 2, 
    "name": "Justice League."
}

oplossen

Resolvers bieden aanwijzingen voor het omzetten van de GraphQL-bewerking in gegevens. Ze lossen de query op in gegevens door oplosserfuncties te definiëren.

Het toont de server het proces en de locatie om gegevens op te halen volgens een specifiek veld. De oplosser scheidt ook het databaseschema en het API-schema. De gescheiden informatie helpt bij het wijzigen van de inhoud die uit de database wordt verkregen.

Schema

Een GraphQL-schema vormt het centrum van de GraphQL-implementatie. Het beschrijft de functionaliteit die beschikbaar is voor de clients die er verbinding mee maken.

Kenmerken van GraphQL

Hier zijn belangrijke kenmerken van GraphQL:

  • Het biedt declaratieve zoektaal, wat niet noodzakelijk is.
  • Het is hiërarchisch en productgericht.
  • GraphQL is sterk getypeerd. Het betekent dat zoekopdrachten worden uitgevoerd binnen de context van een bepaald systeem.
  • Query's in GraphQL worden gecodeerd in de client, niet in de server.
  • Het heeft alle kenmerken van de applicatielaag van het OSI-model.

GraphQL-klanten

GraphQL-client is een code die POST-verzoeken doet naar een relevante GraphQL-server. U kunt rechtstreeks een GraphQL-API opvragen, maar de goede aanpak is om gebruik te maken van een speciale clientbibliotheek met behulp van Relay.

Deze JavaScript-bibliotheek is ontwikkeld door Facebook voor het maken van React-applicaties met GraphQL. GraphQL-clients kunnen een CMS zoals Drupal, een applicatie met één pagina, een mobiele applicatie, enz.

GraphQL-servers

GraphQL-servers zijn serverzijde-implementaties van de GraphQL-specificatie. Het geeft uw gegevens weer als GraphQL API, die uw clientprogramma kan opvragen voor de databank.

GraphQL-gateways

Gateway is een microservicepatroon waarmee u een afzonderlijke service kunt bouwen om met andere backend-services om te gaan. Het biedt werkbare documentatie en biedt een handige manier om met één verzoek gegevens uit meer dan één bron te verzamelen.

Wat is de variabele in GraphQL?

A Variabele in GraphQL wordt gebruikt om de dynamische waarden te scheiden van de clientquery en de query door te geven als een uniek woordenboek. Variabele in GraphQL kan ook worden gebruikt voor het hergebruiken van de query of mutaties die door de klant zijn geschreven met individuele argumenten. In graphQL kunt u dynamische argumenten niet rechtstreeks in de queryreeks doorgeven. De reden hiervoor is dat code aan de clientzijde de queryreeks dynamisch moet manipuleren op het moment dat u het programma uitvoert.

GraphQL heeft een goede manier om de dynamische waarden uit de query te ontbinden. Het geeft ze door als een apart woordenboek. Deze waarden staan ​​bekend als variabelen. Telkens wanneer we met variabelen werken, moeten we het volgende doenwing drie dingen:

  1. Vervang de statische waarde in de query door een variabelenaam.
  2. Declareer de naam van de variabele als een van de variabelen die worden geaccepteerd door de GraphQL-query.
  3. Geef de waarde door in het transportspecifieke woordenboek met variabelen.

Zo ziet het er allemaal samen uit:

query HeroNameAndFriends($episode: Episode) {
  hero(episode: $episode) {
    name
    friends {
      name
    }
  }
}
{
  "episode": "JEDI"
}
{
  "data": {
    "hero": {
      "name": "R2-D2",
      "friends": [
        {
          "name": "Luke Skywalker"
        },
        {
          "name": "Han Solo"
        },
        {
          "name": "Leia Organa"
        }
      ]
    }
  }
}

Zoals u in het bovenstaande GraphQL-voorbeeld kunt zien, hebben we eenvoudigweg een andere variabele doorgegeven, behalve dat we een nieuwe query moesten construeren.

Wat is mutatie?

Een mutatie is een manier om de dataset in GraphQL te wijzigen. Het wijzigt gegevens in het gegevensarchief en retourneert een waarde. Mutaties helpen u bij het invoegen, bijwerken of verwijderen van gegevens. Over het algemeen worden mutaties gedefinieerd als een schemaonderdeel.

Punten waarmee u rekening moet houden bij het ontwerpen van GraphQL-mutaties

Hier zijn de belangrijke punten bij het ontwerpen van GraphQL:

  • Naamgeving: Allereerst moet u uw mutatiewerkwoord een naam geven. Dan het zelfstandig naamwoord, of ‘object’, indien van toepassing. Gebruik camelCase bij het benoemen van mutaties.
  • specificiteit: Je moet zoveel mogelijk mutatiespecifiek maken. Mutaties moeten semantische acties vertegenwoordigen die door de gebruiker zijn ondernomen.
  • Invoerobject: Gebruik een uniek, vereist invoerobjecttype als argument voor het uitvoeren van een mutatie op de client.
  • Uniek type lading: U moet voor elke mutatie een uniek payloadtype gebruiken. U kunt de mutatieuitvoer ook als een veld toevoegen aan dat specifieke payloadtype.
  • Nesten: Gebruik nesten voor uw mutatie waar dit zinvol is. Hiermee kunt u de GraphQL API volledig gebruiken.

Verschil tussen GraphQL en REST

Following tabel laat een belangrijk verschil zien tussen GraphQL en REST.

GraphQL REST
Het volgt een klantgestuurde architectuur. Het volgt een servergestuurde architectuur.
GraphQL kan worden georganiseerd in termen van een schema. REST kan worden georganiseerd in termen van eindpunten.
GraphQL is een growing gemeenschap. REST is een zeer grote gemeenschap.
De ontwikkelsnelheid in GraphQL is snel. De ontwikkelingssnelheid in REST is langzaam.
De leercurve in GraphQL is moeilijk. De leercurve in REST is gematigd.
De identiteit is gescheiden van hoe u deze ophaalt. Het eindpunt dat u in REST aanroept, is de identiteit van een bepaald object.
In GraphQL bepaalt de server de beschikbare bronnen. De vorm en grootte van de bron wordt bepaald door de server in REST.
GraphQL biedt hoge consistentie op alle platforms. Het is moeilijk om consistentie op alle platforms te bereiken.

Nadelen van GraphQL

Hier zijn de GraphQL-nadelen:

  • jong ecosystem
  • Gebrek aan middelen op het backend-gedeelte.
  • Ontbrekend ontwerppatroon voor een complex app.
  • Prestatieproblemen met complex queries.
  • Overkill voor kleine toepassingen
  • GraphQL is niet afhankelijk van de HTTP-cachingmethoden die het opslaan van aanvraaginhoud mogelijk maken.
  • GraphQL begrijpt geen bestanden. Daarom is er geen functie voor het uploaden van bestanden opgenomen.
  • Met GraphQL bent u voorbereid op veel voorbereidend onderwijs, zoals het leren van de Schema Definition Language.

Open source-apps en -tools gebruikt door GraphQL

De belangrijke open source apps en tools die GraphQL gebruikt zijn als volgt:

  • Gatsby: Gastby is een applicatie aangedreven door GraphQL die gegevens kan gebruiken die zijn afgeleid van meer dan één GraphQL API-bron. U kunt het gebruiken om een ​​statische en clientgebaseerde React-applicatie te ontwikkelen.
  • GrafiQL: Het is een ID die integreert met de browser en ook communiceert met de API van GraphQL. Enkele van de functies die GraphiQL bevat, zijn mutaties, gegevensquery's en autocomplete-query's.
  • GraphQL-speeltuin: Het is een krachtige IDE met een ingebouwde editor voor het afhandelen van mutaties, validatie, GraphQl-query's, abonnementen, enz. De ontwikkelaar kan deze IDE gebruiken om de structuur van het schema te visualiseren.
  • Prisma: Prisma is een database-abstractielaag die uw databases omzet in GraphQL API's met CRUD-bewerkingen (Create, Read, Update en Delete).
  • Beetje: Het is een open-source tool en platform dat herbruikbare code omzet in componenten. Ontwikkelaars kunnen ze gebruiken om verschillende projecten te delen en te ontwikkelen.

Samengevat

  • GraphQL is een server-side technologie op de applicatielaag die door Facebook is ontwikkeld voor het uitvoeren van zoekopdrachten met bestaande gegevens.
  • U kunt GraphQL gebruiken om gegevens op te halen met een enkele API-aanroep.
  • GraphQL helpt u de prestaties van de mobiele app te verbeteren.
  • Belangrijke GraphQL-querycomponenten zijn: 1) Query, 2) Resolver, 3) Schema.
  • GraphQL is sterk getypeerd. Het betekent dat zoekopdrachten worden uitgevoerd binnen de context van een bepaald systeem.
  • GraphQL-client is een code die POST-verzoeken doet naar een relevante GraphQL-server.
  • GraphQL-servers zijn serverzijde-implementaties van de GraphQL-specificatie.
  • Gateway is een microservicepatroon waarmee u een afzonderlijke service kunt bouwen om met andere backend-services om te gaan.
  • GraphQL heeft een goede manier om de dynamische waarden uit de query te ontbinden.
  • Een mutatie is een manier om de dataset in GraphQL te wijzigen.
  • De belangrijke punten bij het ontwerpen van GraphQL zijn: 1) Naamgeving, 2) Specificiteit, 3) Invoerobject Uniek payload-type, en 4) Nesten.
  • GraphQL kan worden georganiseerd in termen van een schema, terwijl REST kan worden georganiseerd in termen van eindpunten.
  • Het nadeel van GraphQL is dat het geen bronnen heeft op het backend-gedeelte.