Ana içeriğe geç

Apollo'yu Deno ile Kullanma

Apollo Server , birkaç dakika içinde kurabileceğiniz bir GraphQL sunucusudur ve mevcut veri kaynaklarınızla (veya REST API) kullanabilirsiniz. Daha sonra istediğiniz herhangi bir GraphQL istemcisini bağlayarak verileri alabilir ve GraphQL'in tür denetimi ve verimli alım gibi avantajlarından yararlanabilirsiniz.

Yerel verileri sorgulamamıza olanak tanıyan basit bir Apollo sunucusu kuracağız. Bunun için sadece üç dosyaya ihtiyacımız olacak:

  1. schema.ts veri modelimizi kurmak için
  2. resolvers.ts şemamızda veri alanlarını nasıl dolduracağımızı belirlemek için
  3. Sunucunun başlatılacağı main.ts

Şimdi onları oluşturarak başlayalım:

touch schema.ts resolvers.ts main.ts

Her birinin kurulumu üzerinden geçelim.

Kaynağı buradan görüntüleyin.

schema.ts

schema.ts dosyamız verimizi tanımlar. Bu durumda, verimiz bir dinozorlar listesidir. Kullanıcılarımızın her dinozorun adını ve kısa bir tanımını alabilmesini istiyoruz. GraphQL dilinde bu, Dinosaur'un tipimiz olduğunu ve name ile description'ın alanlarımız olduğunu belirtir. Ayrıca her alan için veri tipini de tanımlayabiliriz. Bu durumda, her ikisi de string'dir.

bilgi

GraphQL'de veri için izin verdiğimiz sorguları tanımlarken özel Query tipini kullanıyoruz.

Ayrıca burada, GraphQL'de veri için izin verdiğimiz sorguları tanımlarız; bu, özel Query tipini kullanarak yapılır. İki sorgumuz var:

  • dinosaurs: Tüm dinozorların listesini alır
  • dinosaur: Bir dinozor adı (name) alır ve o tür dinozor hakkında bilgi döndürür.

Tüm bunları typeDefs tür tanımlamaları değişkenimiz içerisinde dışa aktaracağız:

export const typeDefs = `
type Dinosaur {
name: String
description: String
}

type Query {
dinosaurs: [Dinosaur]
dinosaur(name: String): Dinosaur
}
`;

Eğer veri yazmak isteseydik, bu da Mutation'ı tanımlayacağımız yer olurdu. Mutasyonlar, GraphQL ile veri yazmanın yoludur. Burada statik bir veri kümesi kullandığımız için hiçbir şey yazmayacağız.

resolvers.ts

Bir çözümleyici, her sorgu için verileri doldurmaktan sorumludur. Burada dinozor listemiz var ve çözümleyici, ya a) kullanıcı dinosaurs sorgusunu talep ederse tüm listeyi istemciye iletecek ya da b) kullanıcı dinosaur sorgusunu talep ederse yalnızca bir tanesini iletecektir.

const dinosaurs = [
{
name: "Aardonyx",
description: "Bir sauropodların evriminde erken bir aşama.",
},
{
name: "Abelisaurus",
description: '"Abel\'in kertenkeleleri" tek bir kafatasından yeniden inşa edilmiştir.',
},
];

export const resolvers = {
Query: {
dinosaurs: () => dinosaurs,
dinosaur: (_: any, args: any) => {
return dinosaurs.find((dinosaur) => dinosaur.name === args.name);
},
},
};
ipucu

Sonuncusunda, istemciden gelen argümanları bir işlevde geçerek ismi veri kümesindeki bir isimle eşleştiriyoruz.

main.ts

main.ts dosyamızda ApolloServer'ı, graphql'ı ve şemamızdan typeDefs ve resolvers'ı içe aktaracağız:

import { ApolloServer } from "npm:@apollo/server@^4.1";
import { startStandaloneServer } from "npm:@apollo/server@4.1/standalone";
import { graphql } from "npm:graphql@16.6";
import { typeDefs } from "./schema.ts";
import { resolvers } from "./resolvers.ts";

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

const { url } = await startStandaloneServer(server, {
listen: { port: 8000 },
});

console.log(`Sunucu çalışıyor: ${url}`);
tehlike

typeDefs ve resolversApolloServer'a geçirerek yeni bir sunucu başlatıyoruz.

Son olarak, startStandaloneServer sunucunun hızlıca çalışmasını sağlamak için bir yardımcı işlevdir.

Sunucuyu Çalıştırma

Artık yapmamız gereken tek şey sunucuyu çalıştırmak:

deno run --allow-net --allow-read --allow-env main.ts

Terminalinizde Sunucu çalışıyor: 127.0.0.1:8000 mesajını görmelisiniz. O adrese gittiğinizde, dinosaurs sorgumuzu girebileceğimiz Apollo kumanda panelini göreceksiniz:

query {
dinosaurs {
name
description
}
}

Bu, veri kümesini döndürecektir:

{
"data": {
"dinosaurs": [
{
"name": "Aardonyx",
"description": "Bir sauropodların evriminde erken bir aşama."
},
{
"name": "Abelisaurus",
"description": "\"Abel'in kertenkeleleri\" tek bir kafatasından yeniden inşa edilmiştir."
}
]
}
}

Sadece bir dinosaur almak istersek:

query {
dinosaur(name:"Aardonyx") {
name
description
}
}

Bu da döner:

{
"data": {
"dinosaur": {
"name": "Aardonyx",
"description": "Bir sauropodların evriminde erken bir aşama."
}
}
}

Harika!