GraphQL — asoslar va tushunchalar

~25 daq · NestJS · Ilg'or mavzular

Muammodan boshlaylik

Siz mobil ilova uchun backend yozdingiz. Frontend dasturchi shikoyat qildi:

"Foydalanuvchi profilini ko'rsatish uchun 3 ta so'rov yuborishim kerak. Har biri kerak bo'lmagan ma'lumotlarni ham qaytaryapti. Bitta so'rovda barchani olsam bo'lmaydimi?"

REST API dagi klassik muammo:

GET /users/1          → 15 ta maydon, lekin faqat 3 tasi kerak
GET /users/1/posts    → alohida so'rov
GET /users/1/friends  → yana alohida so'rov

3 ta so'rov, ortiqcha ma'lumot. GraphQL bu muammoni hal qiladi.


GraphQL nima?

GraphQL — frontend o'zi nima kerakligini belgilaydigan API so'rov tili. Facebook 2015-yilda yaratgan.

Hayotiy o'xshatma: restoran.

REST da — to'liq to'plam keladi, kerak bo'lmaganini qoldirasiz. GraphQL da — faqat o'zingiz istagan narsani buyurtma qilasiz.

# Bitta so'rovda — aynan kerakli ma'lumot
{
  user(id: 1) {
    name
    posts {
      title
    }
  }
}

Server aynan shuni qaytaradi — na ko'p, na kam.


Asosiy tushunchalar

GraphQL da 3 ta operatsiya turi bor:

Query — ma'lumot olish (REST dagi GET)

query {
  users {
    id
    name
    email
  }
}

Mutation — ma'lumot o'zgartirish (REST dagi POST/PUT/DELETE)

mutation {
  createUser(name: "Ali", email: "ali@test.com") {
    id
    name
  }
}

Subscription — real-time ma'lumot (WebSocket orqali)

subscription {
  newMessage {
    text
    from
  }
}

Schema — shartnoma

GraphQL da avval schema aniqlanadi — qanday ma'lumotlar mavjud.

type User {
  id: Int!       # ! = null bo'lmaydi
  name: String!
  email: String!
  posts: [Post]  # Post lar ro'yxati
}

type Post {
  id: Int!
  title: String!
  author: User
}

type Query {
  user(id: Int!): User
  users: [User]
}

type Mutation {
  createUser(name: String!, email: String!): User
}

Schema — bu kelishuv. Frontend shu kelishuvga qarab so'rov yozadi.


Resolver — so'rovni bajaruvchi funksiya

Har bir schema field uchun — uni qaytaruvchi funksiya. REST dagi controller method ga o'xshash.

Schema: user(id)  →  Resolver: db dan user ni topib qaytaradi
Schema: posts     →  Resolver: db dan postlarni topib qaytaradi

Keyingi darsda NestJS da buni qanday yozishni ko'ramiz.


REST vs GraphQL

REST GraphQL
Endpoint Har bir resurs uchun alohida Bitta /graphql
Ma'lumot Server belgilaydi Client belgilaydi
Ortiqcha ma'lumot Ko'p uchraydi Yo'q
Kesh Oson (URL ga qarab) Murakkab
Fayl yuklash Oddiy Murakkab
O'rganish Oson Biroz murakkab

Qachon GraphQL:

  • Ko'p turdagi client bor (web, mobil, TV)
  • Ma'lumotlar bog'liq va ko'p darajali
  • Frontend tez-tez o'zgarib turadi

Qachon REST:

  • Oddiy CRUD API
  • Fayl yuklash kerak
  • Kichik loyiha

N+1 muammosi

GraphQL ning eng ko'p uchraydigan muammosi:

users so'rovi keldi — 10 ta foydalanuvchi
Har biri uchun posts so'raldi:
→ 10 ta alohida DB query ❌

Yechim — DataLoader (bir vaqtda batch qilish):

→ Barcha userId lar yig'ildi
→ 1 ta query: WHERE userId IN (1,2,...,10) ✅

Keyingi darsda buni amalda ko'ramiz.


Xulosa

Eslab qoling:

  • GraphQL — frontend o'zi nima kerakligini so'raydi
  • Query — olish, Mutation — o'zgartirish, Subscription — real-time
  • Schema — kelishuv, Resolver — bajaruvchi funksiya
  • Over/under-fetching muammosi yo'q
  • N+1 muammosiga ehtiyot bo'ling

Keyingi dars: 43-dars: Apollo + GraphQL — NestJS da ishlash