در دنیای توسعه وب مدرن، APIها نقش حیاتی ایفا می کنند. GraphQL یک زبان پرس و جوی API است که به عنوان جایگزینی برای RESTful APIها مطرح شده است. GraphQL به شما این امکان را می دهد که دقیقاً همان داده ای را که نیاز دارید درخواست کنید، بدون اینکه داده های اضافی را دریافت کنید. این امر باعث بهبود عملکرد و کارایی وب سایت شما می شود.
قبل از شروع این آموزش، مطمئن شوید که با مفاهیم زیر آشنایی دارید:
ابتدا، یک پوشه جدید برای پروژه خود ایجاد کنید و یک فایل `package.json` ایجاد کنید:
mkdir graphql-ecommerce cd graphql-ecommerce npm init -y
برای ساخت API GraphQL، به کتابخانه های زیر نیاز دارید:
کتابخانه ها را با استفاده از npm نصب کنید:
npm install express graphql express-graphql
Schema GraphQL ساختار API شما را تعریف می کند. Schema شامل نوع ها (Types) و پرس و جوها (Queries) و تغییرات (Mutations) است. برای مثال، یک نوع `Product` می تواند به این صورت تعریف شود:
type Product {
id: ID!
name: String!
description: String
price: Float!
imageUrl: String
}
type Query {
products: [Product]
product(id: ID!): Product
}
این Schema تعریف می کند که ما یک نوع `Product` داریم که شامل فیلدهای `id`, `name`, `description`, `price` و `imageUrl` است. همچنین، دو پرس و جو تعریف شده است: `products` که لیستی از محصولات را برمی گرداند و `product` که یک محصول خاص را بر اساس `id` برمی گرداند.
Resolvers توابعی هستند که نحوه دریافت داده ها را برای هر فیلد در Schema تعریف می کنند. برای مثال، Resolver برای پرس و جوی `products` می تواند به این صورت باشد:
const products = [
{ id: '1', name: 'Product 1', description: 'Description 1', price: 10.99, imageUrl: 'image1.jpg' },
{ id: '2', name: 'Product 2', description: 'Description 2', price: 20.99, imageUrl: 'image2.jpg' },
];
const resolvers = {
Query: {
products: () => products,
product: (parent, { id }) => products.find(product => product.id === id),
},
};
در این مثال، Resolver `products` لیستی از محصولات را برمی گرداند و Resolver `product` یک محصول خاص را بر اساس `id` برمی گرداند.
حالا باید سرور Express را راه اندازی کنید و GraphQL را به آن اضافه کنید:
const express = require('express');
const { graphqlHTTP } = require('express-graphql');
const { buildSchema } = require('graphql');
// Define the schema
const schema = buildSchema(`
type Product {
id: ID!
name: String!
description: String
price: Float!
imageUrl: String
}
type Query {
products: [Product]
product(id: ID!): Product
}
`);
// Define the resolvers
const products = [
{ id: '1', name: 'Product 1', description: 'Description 1', price: 10.99, imageUrl: 'image1.jpg' },
{ id: '2', name: 'Product 2', description: 'Description 2', price: 20.99, imageUrl: 'image2.jpg' },
];
const resolvers = {
Query: {
products: () => products,
product: (parent, { id }) => products.find(product => product.id === id),
},
};
const app = express();
app.use('/graphql', graphqlHTTP({
schema: schema,
rootValue: resolvers,
graphiql: true,
}));
app.listen(4000, () => console.log('Now browse to localhost:4000/graphql'));
این کد یک سرور Express راه اندازی می کند و GraphQL را در مسیر `/graphql` فعال می کند. `graphiql: true` ابزار GraphiQL را فعال می کند که به شما امکان می دهد API خود را تست کنید.
پس از اجرای کد بالا، به آدرس `http://localhost:4000/graphql` در مرورگر خود بروید. GraphiQL باید باز شود. حالا می توانید پرس و جوهای GraphQL را برای API خود تست کنید. برای مثال، برای دریافت لیست محصولات، پرس و جوی زیر را وارد کنید:
query {
products {
id
name
price
}
}
GraphQL یک زبان پرس و جوی API است که به شما امکان می دهد دقیقاً همان داده ای را که نیاز دارید، درخواست کنید. در مقابل، RESTful APIها معمولاً چندین endpoint دارند که هر کدام داده های خاصی را برمی گردانند. GraphQL به شما امکان می دهد با یک درخواست، داده های مورد نیاز خود را از چندین منبع دریافت کنید.
GraphQL و REST هر دو رویکردهای معتبری برای ساخت API هستند. GraphQL در مواردی که نیاز به انعطاف پذیری بالا و دریافت دقیق داده ها دارید، گزینه بهتری است. REST برای APIهای ساده تر و مواردی که نیاز به کش کردن داده ها دارید، مناسب تر است.
برای استفاده از GraphQL در فرانت اند خود، می توانید از کتابخانه هایی مانند Apollo Client یا Relay استفاده کنید. این کتابخانه ها به شما کمک می کنند پرس و جوهای GraphQL را به سرور ارسال کنید و داده ها را در برنامه خود مدیریت کنید.
نیاز به کمک در سئوی وب سایت خود دارید؟ با ما تماس بگیرید تا به شما کمک کنیم!
09190994063 - 09376846692