إعداد Atlas — نظام SaaS لإدارة تأجير السيارات

استضافة Hostinger

كود Atlas مجاني؛ أما الاستضافة فهي باقة مدفوعة. موقعك المباشر يعمل هنا.

اختر باقة Hostinger

استخدم باقة Unlimited أو باقة Cloud تتضمن نشر Web App.

Claude Desktop

مساعدك الذكي في الإعداد. ينفّذ Claude العمل التقني في تبويب Code.

نزّل Claude Desktop

https://claude.ai/download

Node.js

الإصدار 20.19 أو أحدث. يتولى Claude الباقي.

نزّل Node.js

https://nodejs.org/en/download

Git

يُستخدم لنشر نسختك من Atlas. ينفّذ Claude أوامر Git نيابةً عنك.

تحميل Git

https://git-scm.com/

حساب Supabase

الباقة المجانية تكفي للبدء. ستنشئ مشروعًا جديدًا عندما يطلبه Claude.

أنشئ حساب Supabase

https://supabase.com/dashboard

حساب GitHub

مجاني. يحتفظ بنسختك الخاصة من Atlas، والتي ينشر Hostinger منها.

أنشئ حساب GitHub

https://github.com/signup

نزّل Atlas

Atlas مجاني ومفتوح المصدر بموجب MIT License.

افتح Atlas على GitHub

https://github.com/salhiworks/atlas-car-rental-saas

انقر على Code، ثم على Download ZIP فك ضغط الملف الذي نزّلته احتفظ بمجلد atlas-car-rental-saas-main في مكان يسهل الوصول إليه، مثل Documents

تستخدم Git بالفعل؟ يمكنك استنساخ المستودع بدلًا من ذلك. يعمل إعداد Claude مع الطريقتين.

افتح Atlas في Claude Desktop

Claude Desktop Code Local Select Project Folder Open Trust Workspace

اختر مجلد Atlas نفسه — المجلد الذي يحتوي على README.md.

اطلب من Claude إعداد Atlas

في تبويب Code، ومجلد Atlas مفتوح، أرسل هذه الرسالة:

موجّه إعداد Atlas

يبدأ الإعداد المدمج في Atlas. ينفّذ Claude العمل التقني نيابةً عنك.

Set up Atlas for me.

يتّبع Claude مهارة الإعداد المدمجة في Atlas. يفحص جهازك، ويثبّت ما يحتاجه Atlas، وينفّذ العمل التقني بنفسه. لا يتوقف إلا عندما يحتاج إليك، وكل لحظة من هذه اللحظات مهمة في هذا الدليل.

أنشئ مشروع Supabase الخاص بك

يطلب Claude هذا أولًا. يُثبَّت Atlas دائمًا في مشروع جديد وفارغ.

افتح لوحة تحكم Supabase

https://supabase.com/dashboard

انقر على New project — الباقة Free مناسبة سمِّه واحفظ كلمة مرور قاعدة البيانات في مكان آمن عندما يصبح جاهزًا، انسخ Project ID الخاص به والصقه في Claude

Supabase Project Settings General

إذا طلب منك Claude تسجيل الدخول إلى Supabase أو ربط مشروعك، فاتّبع التعليمات التي يعطيك إياها بدقة.

وافِق على التثبيت

يعرض Claude اسم مشروعك ومنطقته وتاريخ إنشائه، ويطلب الإذن بتثبيت Atlas فيه. تأكد أنه المشروع الذي أنشأته للتو، ثم أجب بـ yes. هذه الموافقة الواحدة تغطي كل ما يلي:

ينشئ قاعدة بيانات Atlas (54 migration، مع معاينتها أولًا)

ينشر 4 Edge Functions الخاصة بـ Atlas ويتحقق منها

يضبط التطبيق باستخدام publishable key فقط

يشغّل البناء والفحوصات التلقائية الخاصة بـ Atlas

يستغرق الأمر بضع دقائق، ولا يوجد ما تفتحه أو تختبره. إذا لم يكن المشروع فارغًا، يتوقف Claude ولا يغيّر شيئًا.

أنشئ مستودعًا خاصًا فارغًا

هذه نسختك الخاصة من Atlas على GitHub. ينشر Hostinger موقعك منها.

أنشئ مستودع GitHub

https://github.com/new

سمِّ المستودع اختر Private اترك README و.gitignore وlicense غير مفعّلة انقر على Create repository انسخ رابط URL للمستودع

وافِق على النشر

الصق رابط المستودع في Claude عندما يطلبه. يجهّز Claude Git، ويتحقق من عدم تضمين أي أسرار، ويعرض ملخصًا قصيرًا: مستودعك والفرع main. تأكد أن المستودع مستودعك، ثم أجب بـ yes.

لا يدفع Claude أبدًا (push) إلى مستودع Atlas الأصلي. إذا طلب Git منك تسجيل الدخول، يطلب منك Claude تنفيذ الـ push بنفسك — سجّل الدخول عبر المتصفح، لأن GitHub لا يقبل كلمة مرور حسابك هناك.

استورد مستودعك

لا تملك استضافة بعد؟ احصل على باقة من المتطلبات أولًا.

Hostinger Websites Add Website Web App Import Git Repository

اربط GitHub واختر Only select repositories اختر مستودع Atlas الخاص بك والفرع main اختر النطاق المؤقت المجاني أو نطاقك الخاص

اضبط البناء وانشر

أبقِ على إعداد إطار العمل Vite الذي يكتشفه Hostinger اختر Node.js 22، أو أحدث إصدار متاح اضبط أمر البناء على npm run build اضبط مجلد الإخراج على dist

أضف هذين المتغيرين البيئيين تحديدًا. يعرض لك Claude القيمتين، ويمكنك تجاهل أي اقتراحات أخرى:

VITE_SUPABASE_URL VITE_SUPABASE_PUBLISHABLE_KEY

VITE_SUPABASE_URL

رابط المشروع

VITE_SUPABASE_PUBLISHABLE_KEY

Publishable key

احصل على هذه القيم من Supabase

افتح Connect

https://supabase.com/dashboard/project/_?showConnect=true

الأمان

يوضع هنا Publishable key فقط. لا تضف أبدًا مفتاح Secret أو service_role إلى متغير VITE_ — كل ما يبدأ بـ VITE_ يكون مرئيًا في المتصفح.

انقر على Deploy وانتظر حتى ينتهي البناء انسخ عنوان موقعك والصقه في Claude

يتحقق Claude من أن الموقع المباشر يعمل عبر HTTPS ومتصل بمشروع Supabase الخاص بك.

أضف عنوانك المباشر إلى Supabase

روابط رسائل التسجيل وكلمة المرور تؤدي إلى هذه العناوين. يرسل Claude قيمة Site URL الدقيقة وأربعة Redirect URLs لنطاقك على Hostinger — انسخها من رسالة Claude.

Supabase Authentication URL Configuration

اضبط Site URL على عنوانك المباشر، بدءًا من https:// أضف Redirect URLs الأربعة، واحدًا تلو الآخر انقر على Save، ثم أخبر Claude أنك انتهيت

كل Redirect URL هو عنوانك المباشر متبوعًا بأحد هذه المسارات:

/auth/callback

/accept-invite

/auth/reset-password

/confirm-email

أنشئ وكالتك

افتح رابط التسجيل الذي يعطيك إياه Claude — عنوانك المباشر متبوعًا بـ /sign-up أنشئ وكالتك بالبريد الإلكتروني نفسه المستخدم في حساب Supabase افتح رسالة التأكيد في المتصفح نفسه سجّل الدخول، ثم أخبر Claude عندما تظهر وكالتك في لوحة التحكم

لماذا البريد نفسه: بريد Supabase المدمج لا يصل إلا إلى عناوين فريقك في Supabase، بمعدل رسالتين تقريبًا في الساعة. بعدها يتأكد Claude من وجود وكالتك وأنك Owner لها — لا يوجد ما تختبره.

أصبح Atlas مباشرًا. كل push إلى الفرع main يعيد نشره الآن على Hostinger، لذا اطلب من Claude أي تغيير، بما في ذلك اسمك أو شعارك أو ألوانك، ثم اطلب منه تنفيذ push.

قبل العملاء الحقيقيين

اربط مزوّد البريد الخاص بك (Custom SMTP) قبل أن يسجّل عملاء أو موظفون من خارج فريقك في Supabase:

Supabase Authentication Emails SMTP Settings