Ба саҳифаи асосӣ

Оғози зуд

Ин роҳи кӯтоҳтарин аз ҳеҷ то эндпоинти воқеӣ, ки шумо аз барномаи худ муроҷиат карда метавонед, нишон медиҳад. Тахминан панҷ дақиқа мегирад.

1. Ҳисоб созед

Дар /register бо email ва рамз сабти ном кунед. Шумо ба дашборди худ мерасед — холӣ, зеро шумо ҳанӯз лоиҳае насохтаед.

2. Лоиҳа созед

Лоиҳа танҳо фазои ном аст: он як ё якчанд захираро дар бар мегирад ва соҳиби key-е мебошад, ки дар ҳар URL-и эндпоинти он пайдо мешавад. Ба Лоиҳаи нав зер занед, ба он ном диҳед ва MockLab барои шумо key-и тасодуфии лоиҳа месозад — чизе ба монанди demo7k2m9x. Шумо ҳеҷ гоҳ худ ин key-ро интихоб намекунед; он барои он вуҷуд дорад, ки URL-и эндпоинти шумо аз номи лоиҳа тахминзанӣ нашавад.

3. Захира созед

Дар дохили лоиҳаи худ захира созед ва ба он ном диҳед — масалан, products. Захира як схема аст: рӯйхати майдонҳо, ки ҳар кадом навъи худро дорад. Барои санҷиш се майдон илова кунед:

Номи майдонНавъЭзоҳ
titlewordяк калимаи сохташуда
pricepriceопсияи symbol-ро ба $ таъин кунед
inStockbooleantrue/false

Ҳар майдоне, ки илова мекунед, ҷадвали пешнамоиши зиндаро дар ҳамон экран навсозӣ мекунад, пас шумо метавонед сатрҳои воқеан сохташударо пеш аз навиштани ягон сатри коди клиент бинед. Шумораи сабтҳо-ро ба ҳар чӣ лозим аст таъин кунед — 50 барои санҷиши зуд, 100,000 барои дидани он, ки даъвои "бе маҳдудияти сабт" воқеан рост меояд. Ба ҳар рақаме, ки интихоб кунед, вақти ҷавоб барои як саҳифа қариб тағйир намеёбад, зеро MockLab ҳеҷ гоҳ барои як дархост зиёда аз арзиши як саҳифаи сабтҳоро намесозад.

4. Ба эндпоинти худ муроҷиат кунед

Эндпоинти захираи шумо ҳамон лаҳзае, ки онро месозед, фаъол мешавад — қадами алоҳидаи "нашр" ё "дифоъ" вуҷуд надорад. URL-и пурра як намунаро пайравӣ мекунад:

https://mocklab.dev/m/{project-key}/{resource-name}

Пас барои лоиҳа ва захираи дар боло:

const response = await fetch("https://mocklab.dev/m/demo7k2m9x/products");
const products = await response.json();
console.log(products[0]);
// { id: "a1b2c3d4-...", title: "vivid", price: "$48.19", inStock: true }

Дар компоненти React бо TanStack Query, ҳамон муроҷиат чунин намуд дорад:

import { useQuery } from "@tanstack/react-query";

function ProductList() {
  const {
    data: products,
    isPending,
    isError,
  } = useQuery({
    queryKey: ["products"],
    queryFn: () => fetch("https://mocklab.dev/m/demo7k2m9x/products").then((res) => res.json()),
  });

  if (isPending) return <p>Loading…</p>;
  if (isError) return <p>Something went wrong.</p>;

  return (
    <ul>
      {products.map((product) => (
        <li key={product.id}>
          {product.title} — {product.price}
        </li>
      ))}
    </ul>
  );
}

Ҳамин — захираи воқеии REST бо саҳифабандӣ, филтр, тартиб ва CRUD-и пурра, бидуни сервери худи шумо. Аз ин ҷо: Схема ва навъҳои майдон ҳар навъи майдонеро, ки барои захираи шумо дастрас аст, фаро мегирад, ва Параметрҳои дархост ҳар чизеро, ки шумо тавассути URL бо эндпоинти рӯйхат карда метавонед, фаро мегирад.