شكل أقرب للإنتاج
ده مش مجرد تقسيم فولدرات بأسماء الطبقات.
src/├── app/│ ├── providers/│ │ ├── query-provider.tsx│ │ └── router-provider.tsx│ ├── router/│ │ └── index.tsx│ └── styles/│├── pages/│ ├── home/│ │ ├── ui/home-page.tsx│ │ └── index.ts│ ├── product-details/│ │ ├── ui/product-details-page.tsx│ │ └── index.ts│ ├── products/│ │ ├── ui/products-page.tsx│ │ └── index.ts│ ├── cart/│ │ ├── ui/cart-page.tsx│ │ └── index.ts│ └── checkout/│ ├── ui/checkout-page.tsx│ └── index.ts│├── widgets/│ ├── header/│ │ ├── ui/header.tsx│ │ └── index.ts│ ├── product-grid/│ │ ├── ui/product-grid.tsx│ │ └── index.ts│ └── cart-summary/│ ├── ui/cart-summary.tsx│ └── index.ts│├── features/│ ├── add-to-cart/│ │ ├── api/│ │ ├── model/│ │ ├── ui/add-to-cart-button.tsx│ │ └── index.ts│ ├── change-cart-quantity/│ │ ├── ui/quantity-control.tsx│ │ └── index.ts│ ├── add-to-wishlist/│ │ ├── model/│ │ ├── ui/wishlist-button.tsx│ │ └── index.ts│ └── apply-coupon/│ ├── model/│ ├── ui/coupon-form.tsx│ └── index.ts│├── entities/│ ├── product/│ │ ├── api/│ │ │ ├── get-product.ts│ │ │ └── get-products.ts│ │ ├── model/│ │ │ ├── types.ts│ │ │ └── queries.ts│ │ ├── ui/product-card.tsx│ │ └── index.ts│ ├── cart/│ │ ├── api/│ │ │ ├── get-cart.ts│ │ │ └── add-cart-item.ts│ │ ├── model/│ │ │ ├── types.ts│ │ │ └── queries.ts│ │ └── index.ts│ ├── user/│ │ └── index.ts│ └── order/│ └── index.ts│└── shared/ ├── api/ │ ├── client.ts │ └── types.ts ├── ui/ │ ├── button.tsx │ ├── input.tsx │ └── spinner.tsx ├── lib/ ├── config/ └── types/خلّصت الفصل لما
🧠 اختبر نفسك
١) باقي التطبيق يستورد من أنهي ملف في الـ Slice؟
من
index.ts، مش من الملفات الداخلية.٢) لازم أعمل كل الفولدرات في أول يوم؟
لأ. اعمل الـ Slices المطلوبة بس.