RTK QueryBeginner
Folder Structure — Redux Pattern
Redux-সম্পর্কিত ফাইলগুলোর কীভাবে organizing করা হয় — বাংলায়।
4টি অংশবাংলা ভাষায়
Recommended layout (features pattern)text
text
src/
├─ app/
│ ├─ layout.tsx # ReduxProvider wrap
│ ├─ page.tsx # storefront (client)
│ └─ cart/page.tsx # cart page (client)
├─ components/
│ ├─ ui/ # shadcn (button, card …)
│ ├─ products/
│ │ ├─ product-card.tsx
│ │ ├─ product-grid.tsx
│ │ └─ product-filters.tsx
│ └─ cart/
│ └─ cart-drawer.tsx
├─ features/
│ ├─ cart/
│ │ ├─ cartSlice.ts # createSlice
│ │ └─ cartSelectors.ts # memoized selectors
│ └─ orders/
│ └─ ordersService.ts # RTK Query API
├─ hooks/
│ ├─ use-app-dispatch.ts
│ └─ use-app-selector.ts
└─ types/
└─ index.ts # Product, CartItem, Order
Product vs feature folders
| Pattern | কবে |
|---|---|
| Feature-first (বড় app) | প্রতিটি feature-এর নিজস্ব slice+selector+component |
| File-type-first (ছোট app) | সব slices/features আলাদা folder |
Single store, slice-ভাগ
প্রতিটি screen-এর জন্য আলাদা store বানাবেন না — Redux-এ একটি store, তার ভেতরে multiple slices এই correct pattern। আলাদা store করলে state-ঐক্য ভেঙে যায়, জটিলতা বাড়ে।
শেষ প্যারায় নিজে practice করুন — কোড কপি করে নিজের এডিটরে চালিয়ে দেখুন।