Tech TutorBangla Web Documentation
Portfolio
HomeHTMLCSSTailwind CSSJavaScriptTypeScriptReactNext.jsNode.jsExpressSocket.IOExpoWordPressPostgreSQLPrismaPostgresNestJSMongoDBDockerTanStackTanStack TableRTK QueryGitGitHub
  • TanStack Documentation42টি অধ্যায়
প্রযুক্তি নির্বাচন
HomeHTMLCSSTailwind CSSJavaScriptTypeScriptReactNext.jsNode.jsExpressSocket.IOExpoWordPressPostgreSQLPrismaPostgresNestJSMongoDBDockerTanStackTanStack TableRTK QueryGitGitHub
  • Project Overview
  • Architecture
  • Folder Structure
  • Setup Next.js
  • Axios Setup
  • API Client
  • API Types
  • Query Install
  • Query Provider
  • Query Keys
  • Data Fetching
  • States
  • Devtools
  • Create Mutation
  • Update Mutation
  • Delete Mutation
  • Cache Invalidation
  • Optimistic Update
  • Pagination
  • Search
  • Filtering
  • Sorting
  • TanStack Table
  • Table Explore
  • Table Columns
  • Table Actions
  • React Hook Form
  • Zod Validation
  • Create Form
  • Edit Form
  • Dialog Modal
  • Delete Confirmation
  • Complete CRUD Flow
  • Full Integration
  • Error Handling
  • Loading States
  • Reusable Components
  • Production
  • Complete Project
  • Common Mistakes
  • Best Practices
  • Interview Q&A
  1. Docs
  2. TanStack
  3. API Types — TypeScript কোডের বেবা
TanStackBeginner

API Types — TypeScript কোডের বেবা

Product model, input types ও paginated response types — বাংলায়।

5টি অংশবাংলা ভাষায়

TypeScript-এর আসল শক্তি — API-র সাথে mirror করা types। ধরনের সাথে সবকিছু typed থাকলে refactor-এ মননের চাপ কমে ও autocomplete মেলে।

src/types/product.tsts
ts
export type ProductStatus = "active" | "inactive";

export type Product = {
  id: string;
  name: string;
  description: string;
  price: number;
  category: string;
  stock: number;
  status: ProductStatus;
  createdAt: string;   // ISO date string
  updatedAt: string;
};

// create/update-এ যা পাঠাব
export type CreateProductInput = {
  name: string;
  description: string;
  price: number;
  category: string;
  stock: number;
  status: ProductStatus;
};

// list request-এর query params
export type ProductQueryParams = {
  page?: number;
  pageSize?: number;
  search?: string;
  category?: string;
  status?: ProductStatus | "all";
  sortBy?: "name" | "price" | "stock" | "createdAt";
  sortOrder?: "asc" | "desc";
};

// paginated response
export type ProductListResponse = {
  items: Product[];
  total: number;
  page: number;
  pageSize: number;
  totalPages: number;
};

কেন এই split

  • Product — সার্ভার যা পাঠায় (id, timestamps সহ)
  • CreateProductInput — সার্ভার যা গ্রহণ করে (id ছাড়া)
  • ProductQueryParams — list-এর filters/sorting
  • ProductListResponse — paginated response shape
API types আলাদা রাখুন

যদি আপনি OpenAPI/Generated SDK ব্যবহার করেন, types আসে SDK থেকেই। তবে নিজের হাতে typed client বানালে এই ফাইলটিই 'স্বতঃ' contract — এখানে ভুল হলে compile-time-এই ধরা পড়ে।

শেষ প্যারায় নিজে practice করুন — কোড কপি করে নিজের এডিটরে চালিয়ে দেখুন।
আগেরAPI Client — Typed FunctionsপরেরTanStack Query Installation ও Setup
এই পেজে
Tech Tutor

বাংলায় ওয়েব ডেভেলপমেন্ট ডকুমেন্টেশন শিখুন — ধাপে ধাপে।

Homeসব ডকুমেন্টেশনQuick Startআমার নোটস

© 2026 Tech Tutor. বাংলায় শিখুন, বাংলায় গড়ুন।

mdanamolhasan1998@gmail.com