76 lines
4.9 KiB
Markdown
76 lines
4.9 KiB
Markdown
# 🧱 الستاك الموصى به — diyaa.de
|
|
|
|
> القرار: **Next.js فل ستاك + PostgreSQL + Prisma**. كل شي بمشروع واحد، مكوّنات قابلة لإعادة الاستخدام، ومكتبات محليّة (self-hosted) قدر الإمكان.
|
|
>
|
|
> **تحديث 2026-08-05:** المخطط اعتُمد على **الخيار A** — جدول `Project` موحّد + `Melody` منفصل (تفاصيله بـ `ARCHITECTURE.md §3`). الاحصائيات: **عدّادات داخلية أولاً** بدل Umami. راجع قرارات المراجعة بـ `REVIEW-2026-08-05.md`.
|
|
|
|
---
|
|
|
|
## الخلاصة السريعة
|
|
|
|
| الطبقة | الاختيار | ليش |
|
|
|--------|---------|-----|
|
|
| **Framework** | Next.js 14 (App Router) — *موجود* | فرونت + باك اند بمشروع واحد، Server Actions & Route Handlers |
|
|
| **اللغة** | TypeScript (strict) — *موجود* | أمان أنواع، أسهل للـ agents يفهموا الكود |
|
|
| **التنسيق** | **Tailwind CSS** | معيار مطلوب، utility-first، متناسق |
|
|
| **مكوّنات UI** | **shadcn/ui** (Radix + Tailwind) | مكوّنات محليّة (بتتنسخ للريبو مش package)، قابلة للتعديل الكامل |
|
|
| **قاعدة البيانات** | **PostgreSQL** | علاقات قوية (أعمال ↔ تصنيفات ↔ ألحان)، ممتاز محلياً وعلى السيرفر |
|
|
| **ORM** | **Prisma** | Schema واحد = مصدر الحقيقة، migrations منظّمة، type-safe |
|
|
| **المصادقة (Admin)** | **Auth.js (NextAuth v5)** بـ Credentials | لوحة تحكم لك وحدك، بدون طرف ثالث |
|
|
| **رفع الملفات** | تخزين محلي على الـ VPS (volume) + معالجة بـ **sharp** | صور الأعمال والسكرين شوتس والصوت — self-hosted، بدون S3 إلزامي |
|
|
| **الصوت (الألحان)** | `<audio>` عنصر أصلي + مشغّل مخصّص (wavesurfer.js اختياري، محلي) | تشغيل الألحان بدون خدمة خارجية |
|
|
| **الإيميلات** | **Nodemailer + SMTP** (STRATO أو أي مزوّد) | تحكّم كامل، بدون API طرف ثالث |
|
|
| **قوالب الإيميل** | **React Email** | قوالب بمكوّنات React، متسقة مع باقي الستاك |
|
|
| **الاحصائيات** | **عدّادات داخلية بسيطة** أولاً (Umami self-hosted لاحقاً لو لزم) | أخف، خصوصية أعلى، بدون خدمة إضافية للإطلاق الأول |
|
|
| **الفاليديشن** | **Zod** | تحقّق من الفورمات والـ API، متكامل مع Prisma/TS |
|
|
| **الفورمات** | **React Hook Form + Zod** | إدارة نماذج لوحة التحكم |
|
|
| **النشر** | Docker + Traefik + Makefile — *موجود* | نفس المنظومة الحالية، بنضيف عليها Postgres |
|
|
|
|
---
|
|
|
|
## ليش Next.js فل ستاك (مش باك اند منفصل)؟
|
|
|
|
- مشروع واحد = صيانة أسهل وتوثيق أوضح للـ agents.
|
|
- **Server Actions** بتلغي الحاجة لطبقة API منفصلة لمعظم عمليات لوحة التحكم.
|
|
- **Route Handlers** (`app/api/...`) لأي endpoints عامة (مثلاً webhook، رفع، RSS للألحان).
|
|
- كل شي TypeScript من الداتابيس للواجهة = نوع واحد يمشي من `Prisma` لـ `React`.
|
|
|
|
## ليش PostgreSQL + Prisma؟
|
|
|
|
- بياناتك **علائقية**: عمل واحد ينتمي لتصنيف، تطبيق إله كذا سكرين شوت، لحن إله تصنيف (عربي/شرقي). Postgres مثالي لهيك.
|
|
- Prisma بيخلّي `schema.prisma` **مصدر الحقيقة الوحيد** للبنية — وهاد بيخدم شرط التوثيق.
|
|
- migrations منظّمة → تشتغل نفسها محلياً وعلى السيرفر.
|
|
|
|
## مبدأ "كل المكتبات محليّة"
|
|
|
|
- **shadcn/ui**: بتتنسخ داخل `components/ui/` — مش dependency خارجي، تحت سيطرتك بالكامل.
|
|
- الخطوط: self-hosted عبر `next/font` (بدون Google Fonts CDN).
|
|
- الأيقونات: `lucide-react` (bundled محلياً).
|
|
- مشغّل الصوت والاحصائيات: self-hosted على نفس الـ VPS.
|
|
- تجنّب أي CDN وقت التشغيل — كل شي يتحزّم مع الـ build.
|
|
|
|
---
|
|
|
|
## حزم مقترحة للتثبيت (مرجع)
|
|
|
|
```
|
|
# UI
|
|
tailwindcss postcss autoprefixer
|
|
# shadcn/ui يُهيّأ عبر: npx shadcn@latest init
|
|
class-variance-authority clsx tailwind-merge lucide-react tailwindcss-animate
|
|
# DB
|
|
prisma @prisma/client
|
|
# Auth
|
|
next-auth@beta
|
|
# Forms & validation
|
|
react-hook-form zod @hookform/resolvers
|
|
# Email
|
|
nodemailer @react-email/components @react-email/render
|
|
# Media
|
|
sharp
|
|
# (اختياري) مشغّل صوت
|
|
wavesurfer.js
|
|
```
|
|
|
|
> ⚠️ لا تثبّت شي إلا وقت الحاجة الفعلية للـ feature المرتبط فيه، وحدّث `PROJECT-STATE.md` بعد كل إضافة.
|