TypeScript के साथ GraphQL API: व्यावहारिक चरण-दर-चरण ट्यूटोरियल

परिचय

GraphQL API के लिए एक क्वेरी भाषा है जो क्लाइंट को केवल आवश्यक डेटा प्राप्त करने की अनुमति देती है। TypeScript के साथ मिलकर, यह टाइप-सुरक्षित, स्केलेबल और दस्तावेजीकृत API बनाने के लिए एक शक्तिशाली उपकरण बन जाता है। इस चरण-दर-चरण ट्यूटोरियल में, हम व्यावहारिक रूप से Apollo Server और TypeGraphQL का उपयोग करके TypeScript पर एक पूर्ण GraphQL API बनाएंगे।

आप सीखेंगे:

\n
• TypeScript और Apollo Server के साथ प्रोजेक्ट कैसे सेट करें
\n
• TypeGraphQL डेकोरेटर का उपयोग करके GraphQL स्कीमा कैसे परिभाषित करें
\n
• पूर्ण टाइपिंग के साथ रिज़ॉल्वर कैसे लिखें
\n
• डेटाबेस कैसे कनेक्ट करें और क्वेरी कैसे निष्पादित करें
\n

यह सामग्री शुरुआती और उन डेवलपर्स दोनों के लिए उपयोगी होगी जो REST API से परिचित हैं, लेकिन API बनाने के आधुनिक दृष्टिकोण में महारत हासिल करना चाहते हैं।

1. प्रोजेक्ट सेटअप और निर्भरताएँ स्थापित करना

प्रोजेक्ट को इनिशियलाइज़ करके शुरू करें। सुनिश्चित करें कि आपके पास Node.js (संस्करण 16+) और npm/yarn स्थापित है।

mkdir graphql-ts-tutorial\ncd graphql-ts-tutorial\nnpm init -y

आवश्यक पैकेज स्थापित करें:

npm install apollo-server graphql reflect-metadata type-graphql class-validator\nnpm install -D typescript @types/node ts-node

tsconfig.json फ़ाइल बनाएँ:

{\n  "compilerOptions": {\n    "target": "ES2020",\n    "module": "commonjs",\n    "lib": ["ES2020"],\n    "experimentalDecorators": true,\n    "emitDecoratorMetadata": true,\n    "strict": true,\n    "esModuleInterop": true,\n    "outDir": "./dist",\n    "rootDir": "./src"\n  },\n  "include": ["src/**/*"]\n}

experimentalDecorators और emitDecoratorMetadata फ़्लैग पर ध्यान दें - ये TypeGraphQL के काम करने के लिए आवश्यक हैं।

2. TypeGraphQL के साथ स्कीमा और प्रकार परिभाषित करना

src फ़ोल्डर और src/types/User.ts फ़ाइल बनाएँ। यहाँ हम उपयोगकर्ता मॉडल का वर्णन करेंगे।

import { ObjectType, Field, ID, InputType } from "type-graphql";\n\n@ObjectType()\nexport class User {\n  @Field(() => ID)\n  id!: number;\n\n  @Field()\n  name!: string;\n\n  @Field()\n  email!: string;\n\n  @Field()\n  createdAt!: Date;\n}

व्याख्या:

\n
• @ObjectType() — क्लास को GraphQL प्रकार के रूप में चिह्नित करता है।
\n
• @Field() — इंगित करता है कि API में कौन से फ़ील्ड उपलब्ध होंगे।
\n
• @Field(() => ID) — स्केलर प्रकार ID के लिए।
\n

अब म्यूटेशन (उपयोगकर्ता बनाना) के लिए InputType बनाएँ:

@InputType()\nexport class CreateUserInput {\n  @Field()\n  name!: string;\n\n  @Field()\n  email!: string;\n}

इस प्रकार का उपयोग इनपुट डेटा के सत्यापन के लिए रिज़ॉल्वर में किया जाएगा।

3. रिज़ॉल्वर लिखना

src/resolvers/UserResolver.ts फ़ाइल बनाएँ। यहाँ हम क्वेरी और म्यूटेशन का तर्क लागू करेंगे।

import { Resolver, Query, Mutation, Arg } from "type-graphql";\nimport { User, CreateUserInput } from "../types/User";\n\n// डेटाबेस का अनुकरण\nlet users: User[] = [\n  { id: 1, name: "इवान इवानोव", email: "ivan@example.com", createdAt: new Date() },\n  { id: 2, name: "मारिया पेट्रोवा", email: "maria@example.com", createdAt: new Date() }\n];\n\nlet nextId = 3;\n\n@Resolver()\nexport class UserResolver {\n  @Query(() => [User])\n  async users(): Promise<User[]> {\n    return users;\n  }\n\n  @Query(() => User, { nullable: true })\n  async user(@Arg("id") id: number): Promise<User | undefined> {\n    return users.find(u => u.id === id);\n  }\n\n  @Mutation(() => User)\n  async createUser(@Arg("data") data: CreateUserInput): Promise<User> {\n    const newUser: User = {\n      id: nextId++,\n      name: data.name,\n      email: data.email,\n      createdAt: new Date()\n    };\n    users.push(ne