Skip to content
Shuhub
Guides / Build a SaaS from Scratch

Build a SaaS from Scratch

سبع مراحل، أدوات محسومة، وآراء صريحة — بدل ثلاثة أسابيع من «أي إطار أختار؟». هذا ليس دليلًا مترجمًا ولا نظريًا: هذا هو الستاك الفعلي الذي بُنيت به شُهُب، مع خلاصة السوق العربي في القرارات التي تختلف فيها منطقتنا عن بقية العالم.

هذا الدليل بُني بالتجربة — شُهُب نفسها بُنيت بهذا الستاك ✦

قراءة ١٠ دقائق · ٧ مراحل · ١٣ أداة

Idea & Validation

قبل أي سطر كود: تأكّد أن المشكلة حقيقية وأن أحدًا مستعد يدفع لحلّها. الفخ الشائع: ثمانية أشهر بناء في صومعة، ثم إطلاق يقابله صمت. تحدّث مع خمسة مستخدمين محتملين هذا الأسبوع — اسألهم عن مشكلتهم، لا عن رأيهم في فكرتك.

أرخص نسخة من منتجك هي محادثة. إن لم يتحمّس أحد للمشكلة في الكلام، لن يتحمّس لها في تطبيق.

Design

لا تحتاج أن تكون مصممًا — تحتاج نظام تصميم واحدًا بسيطًا تلتزم به: لوحة ألوان، خطّان، ومقياس مسافات. الفخ: أسبوعان في مطاردة «اللون المثالي» بينما المنتج بلا شاشة واحدة مكتملة.

FigmaFigmaتصميم الواجهات التعاوني في المتصفح — معيار الصناعة1

«Our take هنا وُلدت هوية شُهُب — الليل والذهب. يومان من الأساسيات يكفيانك: إطارات ونصوص وألوان.

Alternatives:Canva

وثّق نظام تصميمك في ملف واحد (الألوان، الخطوط، القواعد) واجعله مرجع كل شاشة — أرخص قرار في المشروع كله.

Arab market note

منتجك عربي؟ صمّم بالـ RTL من الشاشة الأولى. تحويل تصميم LTR إلى RTL لاحقًا أغلى بكثير من البدء به.

Build

ابنِ أصغر نسخة قابلة للإطلاق تحلّ المشكلة الأساسية — ميزة واحدة تعمل بامتياز تغلب عشر ميزات نصف جاهزة. الفخ: مطاردة الكمال والبنية «القابلة للتوسع» لمليون مستخدم لم يأتوا بعد.

Claude Codeاكتب الكود وصحّح الأخطاء وأطلقه من الطرفية عبر وكيل AI يعمل داخل مشروعك1

«Our take وكيل الذكاء الاصطناعي الذي كتب شُهُب كاملة — من الواجهة إلى الـ API. مع مواصفات واضحة، يبني أسرع من فريق صغير.

Next.jsNext.js142.1kابنِ تطبيقات ويب عالية الأداء باستخدام React مع توجيه وعرض من الخادم وتحسينات مدمجة1

«Our take إطار شُهُب: واجهة وخلفية في مشروع واحد، RTL وتعدد اللغات مدعومان، والنشر بضغطة.

MongoDBMongoDBخزّن بيانات المستندات والـ vectors وبيانات البث في منصة بيانات واحدة جاهزة للـ AI1

«Our take قاعدة بيانات شُهُب — مرنة في البدايات حين يتغير شكل بياناتك كل أسبوع.

Alternatives:CursorSupabase

الوكيل يبني بسرعة أفكارك الواضحة وأخطائك الغامضة بنفس الحماس — اكتب المواصفات قبل الأوامر، وراجع كل خطوة قبل التالية.

Arab market note

استخدم الخصائص المنطقية في CSS (ms/me بدل ml/mr) من اليوم الأول — هذا ما جعل شُهُب تعمل بالعربية والإنجليزية بلا إعادة كتابة.

Payments

هنا يفشل الدليل المترجم: كل الأدلة الأجنبية تقول Stripe — و Stripe لا يخدم معظم الأسواق العربية مباشرة. شُهُب لم تصل لمرحلة الدفع بعد، لكن القاعدة عند الوصول إليها محسومة — والإيراد الأول يثبت الجدوى أكثر من أي استبيان.

TapTapاستقبل المدفوعات الإلكترونية لأعمالك عبر بوابة دفع تدعم طرق الدفع المحلية في منطقة MENA1

«Our take خلاصة السوق: البوابة الخليجية متعددة الأسواق — مدى وKNET وبنفت والمحافظ المحلية عبر تكامل واحد.

StripeStripeادمج المدفوعات والفوترة والخدمات المالية في منتجك عبر APIs جاهزة للمطورين1

«Our take خلاصة السوق: إن كان جمهورك عالميًا بالكامل — المعيار الذهبي للمطورين، حيثما توفّر.

Arab market note

القاعدة: جمهورك خليجي؟ Tap. عالمي بالكامل؟ Stripe. والأهم: جرّب عملية دفع حقيقية كاملة قبل الإعلان — لا شيء يقتل الثقة كزر دفع لا يعمل.

Email & Messaging

رسائل الدخول والتفعيل والفواتير — أول ما يلمسه المستخدم من منتجك خارج الموقع. الفخ: إهمال توثيق نطاق الإرسال (SPF/DKIM) فتصل رسائلك إلى السبام، ويظن المستخدم أن منتجك معطّل. وقعنا فيه — لا تقع فيه.

ResendResendأرسل رسائل البريد الإلكتروني للمعاملات والتسويق عبر API بسيط موجّه للمطورين

«Our take بريد شُهُب — أبسط API للمطورين، من الإعداد إلى أول رسالة في ربع ساعة.

وثّق نطاقك في مزود البريد قبل الإطلاق، لا بعده — رسالة الدخول التي لا تصل تعني مستخدمًا لن يعود.

Arab market note

جمهورك خليجي؟ الواتساب والرسائل النصية أهم من البريد أحيانًا — Unifonic تغطيهما عبر API واحد.

Analytics & Monitoring

بلا أرقام أنت تخمّن: من أين يأتي المستخدمون، وأين يتوقفون، وما الميزة التي تُستخدم فعلًا. الفخ: بناء لوحات تحليلات معقدة قبل أن يكون هناك ما يُحلَّل — شُهُب بدأت بعدّاد زيارات مجاني ورقم واحد نراقبه أسبوعيًا.

PostHogPostHogحلّل سلوك المستخدمين وأعد تشغيل الجلسات وأدر feature flags من منصة واحدة للمطورين

«Our take خطوتك الثانية حين تحتاج تفاصيل السلوك: من ضغط ماذا، ومن أين جاء — بطبقة مجانية سخية.

Alternatives:Instabug

ابدأ بعدّاد الزيارات المدمج في منصة النشر (مجاني وبلا إعداد)، واختر مقياس نجاح واحدًا تراقبه كل أسبوع — الباقي ضجيج في البداية.

Deploy & Launch

النشر لم يعد مشروعًا بحد ذاته: اربط مستودعك وادفع الكود وستكون على الإنترنت في دقائق. الفخ الحقيقي ليس تقنيًا — هو تأجيل الإطلاق بحجة «ميزة أخيرة». المنتج الذي لا يُعلَن عنه لا وجود له.

VercelVercelانشر تطبيقات الويب في ثوانٍ — المنصة خلف Next.js1

«Our take من git push إلى رابط مباشر في ثوانٍ — مع شهادة SSL تلقائية وعدّاد زيارات مجاني. شُهُب التي تقرأ منها الآن منشورة عليه.

«إذا لم تشعر بالحرج من نسختك الأولى، فقد تأخرت في الإطلاق.» — أطلق، ثم حسّن.

The full stack, at a glance

StageToolWhy

Checklist

Built your product?

Launch it on Shuhub

Next