Fashionito Next.js Shop
فشنیتو یک نمونه فروشگاه اینترنتی پوشاک با رابط کاربری مدرن و واکنش‌گرا است که با Next.js، React و TypeScript توسعه یافته است. این پروژه قابلیت‌هایی مانند دسته‌بندی و مرتب‌سازی محصولات، مشاهده جزئیات محصول، سبد خرید و فهرست علاقه‌مندی‌ها را با مدیریت وضعیت پایدار در مرورگر ارائه می‌دهد.
درباره‌ی پروژه
درباره پروژه
Fashionito یک نمونه فروشگاه اینترنتی پوشاک است که با هدف پیاده‌سازی یک تجربه خرید مدرن، ساختار کامپوننت‌محور و تعاملات متداول فروشگاهی توسعه داده شده است. رابط کاربری با Next.js، React و TypeScript ساخته شده و برای استایل‌دهی از Tailwind CSS استفاده می‌کند.
امکانات اصلی
- نمایش محصولات در قالب کارت‌های فروشگاهی
- فیلتر محصولات براساس دسته‌بندی
- مرتب‌سازی براساس جدیدترین، قدیمی‌ترین، ارزان‌ترین و گران‌ترین
- صفحه جزئیات محصول و نمایش اطلاعات و تصاویر آن
- سبد خرید با قابلیت افزودن، حذف و تغییر تعداد محصولات
- محاسبه مجموع قیمت اقلام سبد خرید
- فهرست علاقه‌مندی‌ها با امکان افزودن، حذف و انتقال محصول به سبد خرید
- حفظ وضعیت سبد خرید و علاقه‌مندی‌ها در مرورگر با Zustand Persist
- اعلان‌های تعاملی برای بازخورد عملیات کاربر
- صفحات مکمل شامل مقالات، پرسش‌های متداول و تماس با ما
تصمیم‌های فنی
- استفاده از Next.js App Router برای ساختاردهی صفحات
- استفاده از TypeScript برای مدل‌سازی داده‌ها و افزایش اطمینان در توسعه
- جداسازی وضعیت سبد خرید و علاقه‌مندی‌ها در Storeهای مستقل
- استفاده از داده‌های نمونه JSON برای نمایش و تعامل با محصولات
- استفاده از Tailwind CSS برای ساخت رابط کاربری واکنش‌گرا
محدوده پروژه
این نسخه بر رابط کاربری و تعاملات سمت کلاینت تمرکز دارد. اطلاعات محصولات از داده‌های محلی خوانده می‌شوند؛ اتصال به بک‌اند، پایگاه داده و پردازش واقعی پرداخت در این نسخه تأیید نشده است.
پروژه‌های دیگر
آنیما هوم یک پلتفرم فول‌استک در حوزه دکوراسیون داخلی و کابینت آشپزخانه است که با Next.js، TypeScript و PostgreSQL توسعه داده شده است. این پروژه وب‌سایت شرکتی را با امکانات فروشگاهی و پنل مدیریت یکپارچه می‌کند و قابلیت‌هایی مانند معرفی پروژه‌ها و خدمات، مدیریت محصولات و سفارش‌ها، احراز هویت با کد یک‌بارمصرف (OTP) و مدیریت محتوای سایت را ارائه می‌دهد. برنامه روی زیرساخت ابری چابکان میزبانی می‌شود.
فول‌استک
Next.jsTypeScriptDrizzle ORM / Postgre
یک داشبورد مدیریتی مدرن برای فروشگاه آنلاین، توسعه‌یافته با React، TypeScript و Tailwind CSS. این پروژه شامل تحلیل فروش و درآمد، نمودارهای آماری، مدیریت محصولات، سفارش‌ها و مشتریان، ابزارهای بازاریابی و کدهای تخفیف است. رابط کاربری با پشتیبانی از زبان فارسی، چیدمان RTL، تم تاریک و طراحی واکنش‌گرا پیاده‌سازی شده است.
داشبورد
ReactTypeScriptViteTailwind CSSReact RouterZustandRechartsReact Hook FormZodReact ToastifyReact PDF Rendererclsxtailwind-mergeVercel
ReactJavaScriptCSS