الخطوات الأساسية لنشر تطبيق ويب باستخدام استضافة Firebase

استضافة Firebase هي خدمة استضافة آمنة وسريعة وموثوقة تقدمها Google للمطورين لنشر تطبيقات الويب. تهدف استضافة Firebase إلى توفير استضافة عالية الأداء للأصول الثابتة مثل ملفات HTML وCSS و JavaScript ، وتدعم أيضًا إنشاء المحتوى الديناميكي باستخدام وظائف بدون خادم. بفضل شبكتها العالمية لتوصيل المحتوى (CDN)، تضمن استضافة Firebase الحد الأدنى من زمن الوصول للمستخدمين النهائيين لتطبيقك.

تعد استضافة Firebase خيارًا ممتازًا لمطوري الويب الذين يبحثون عن حل نشر سهل الاستخدام يتكامل بشكل جيد مع خدمات Firebase الأخرى، مثل Firebase Functions وFirestore. بفضل عمليات التكامل هذه، يمكنك إنشاء تطبيقات ويب قوية تستفيد من مزامنة البيانات في الوقت الفعلي، والمصادقة، وإمكانيات الحوسبة بدون خادم التي توفرها Google.

المتطلبات الأساسية لنشر تطبيق ويب باستخدام استضافة Firebase

قبل أن تتمكن من نشر تطبيق ويب باستخدام استضافة Firebase، هناك بعض المتطلبات الأساسية التي يتعين عليك الوفاء بها:

• حساب Firebase ومشروع Firebase نشط
• تطبيق ويب تم إنشاؤه باستخدام إعداد HTML و CSS وJavaScript عادي، أو إطار عمل ويب حديث، مثل React أو Angular أو Vue.js
• تم تثبيت Node.js وnpm (مدير حزم Node.js) على جهاز التطوير الخاص بك
• تم تثبيت Firebase CLI (واجهة سطر الأوامر) وتكوينها على جهاز التطوير الخاص بك

إذا لم يكن لديك حساب Firebase، فتوجه إلى موقع Firebase الإلكتروني للتسجيل. بالنسبة لأولئك الجدد في مجال تطوير الويب، فكر في تعلم أساسيات HTML وCSS وJavaScript أو استكشف إطار عمل ويب شائعًا مثل React أو Vue.js أو Angular.

إعداد استضافة Firebase

بمجرد استيفاء المتطلبات الأساسية، يمكنك إعداد استضافة Firebase لمشروعك. اتبع الخطوات التالية:

1. أنشئ حساب Firebase وقم بتسجيل الدخول إلى وحدة تحكم Firebase : إذا لم تكن قد قمت بذلك بالفعل، فقم بالتسجيل للحصول على حساب Firebase وقم بتسجيل الدخول إلى وحدة تحكم Firebase. إن إنشاء حساب مجاني، ويمكنك الاستفادة من خطة Spark المجانية عند البدء.
2. إنشاء مشروع Firebase جديد أو تحديد مشروع موجود : من وحدة تحكم Firebase، يمكنك إما إنشاء مشروع جديد أو تحديد مشروع موجود لتمكين استضافة Firebase.
3. تمكين استضافة Firebase لمشروعك : انتقل إلى لوحة التحكم الخاصة بك وانقر على علامة التبويب "الاستضافة" في الشريط الجانبي. اتبع الإرشادات المقدمة لتمكين Firebase Hosting لمشروعك.
4. قم بتثبيت Firebase CLI على جهاز التطوير الخاص بك : افتح محطة طرفية أو موجه الأوامر على جهاز التطوير الخاص بك. إذا لم تكن قد قمت بذلك بالفعل، فقم بتثبيت Firebase CLI عالميًا عن طريق تشغيل الأمر التالي:

    npm install -g firebase-tools

   تأكد من تثبيت Node.js وnpm قبل تشغيل هذا الأمر. إذا واجهت مشكلات تتعلق بالأذونات، ففكر في استخدام sudo للأنظمة المستندة إلى Unix أو تشغيل موجه الأوامر كمسؤول لأنظمة Windows.
5. قم بتسجيل الدخول إلى Firebase CLI باستخدام حساب Google الخاص بك : بعد تثبيت Firebase CLI، قم بتسجيل الدخول باستخدام حساب Google الخاص بك عن طريق تشغيل الأمر التالي:

    firebase login

   سيفتح هذا الأمر نافذة متصفح، ويطالبك بتسجيل الدخول إلى حساب Google الخاص بك ومنح حق الوصول إلى Firebase CLI.
6. تهيئة Firebase Hosting في الدليل المحلي لتطبيق الويب الخاص بك : انتقل إلى الدليل الجذر لتطبيق الويب الخاص بك باستخدام الوحدة الطرفية أو موجه الأوامر. قم بتشغيل الأمر التالي لتهيئة استضافة Firebase:

    firebase init hosting

   اتبع المطالبات لتكوين مشروعك وتحديد خيارات استضافة Firebase التي تناسب احتياجاتك. افتراضيًا، تقوم استضافة Firebase بتخزين أصولك الثابتة في مجلد يسمى "عام"، ولكن يمكنك تغيير هذا إلى مجلد مختلف حسب الحاجة.

في هذه المرحلة، لقد قمت بنجاح بإعداد Firebase Hosting لتطبيق الويب الخاص بك. بعد ذلك، ستحتاج إلى تكوين تطبيقك للنشر عن طريق تحديد موقع أصولك الثابتة، وإعداد قواعد إعادة الكتابة، وتكوين أي عمليات إعادة توجيه ضرورية. بعد إكمال هذه الخطوات، يمكنك نشر تطبيق الويب الخاص بك على Firebase Hosting.

تكوين تطبيق الويب الخاص بك للنشر

قبل نشر تطبيق الويب الخاص بك على Firebase Hosting، يتعين عليك تكوينه بشكل صحيح. قد تختلف هذه العملية اعتمادًا على ما إذا كنت تستخدم إعداد HTML وCSS وJavaScript عادي أو إطار عمل ويب حديث مثل React أو Angular أو Vue.js. بغض النظر عن الإعداد الخاص بك، يجب عليك إنشاء إصدار إنتاجي لتطبيقك يقوم بإنشاء أصول ثابتة، جاهزة للنشر.

إعداد HTML وCSS وJavaScript عادي

بالنسبة لتطبيق ويب بسيط تم إنشاؤه باستخدام HTML وCSS وJavaScript فقط، فإنك عادةً لا تحتاج إلى عملية إنشاء. ومع ذلك، من المهم تنظيم ملفاتك في بنية دليل مناسبة. قم بإنشاء مجلد public في دليل المشروع الخاص بك وقم بوضع ملفات HTML وCSS وJavaScript بداخله.

تطبيقات الويب React أو Angular أو Vue.js

إذا كنت تستخدم إطار عمل ويب حديثًا مثل React أو Angular أو Vue.js، فستحتاج إلى إنشاء تطبيق الويب الخاص بك قبل نشره. تأتي معظم أطر عمل الويب الحديثة مزودة بدعم مدمج لإنشاء أصول ثابتة جاهزة للإنتاج باستخدام أمر واحد:

Try AppMaster no-code today!

Platform can build any web, mobile or backend application 10x faster and 3x cheaper

Start Free

• بالنسبة لتطبيقات React، استخدم npm run build أو yarn build
• بالنسبة للتطبيقات Angular، استخدم ng build --prod
• بالنسبة لتطبيقات Vue.js، استخدم npm run build أو yarn build

ستقوم هذه الأوامر بإنشاء مجلد build أو dist أو public باستخدام الأصول الثابتة الجاهزة للإنتاج.

تكوين firebase.json

بعد ذلك، تحتاج إلى تكوين ملف firebase.json في مشروعك. يتم إنشاء هذا الملف عند تهيئة Firebase Hosting في دليل مشروعك، ويحدد إعدادات النشر لـ Firebase Hosting. الإعداد الأكثر أهمية هو تحديد الدليل العام الذي يحتوي على الأصول الثابتة لتطبيق الويب الخاص بك. في ملف firebase.json، قم بتعيين الحقل public إلى المجلد الذي يحتوي على أصولك الثابتة:

 { "hosting": { "public": "public", "ignore": [ "firebase.json", "**/.*", "**/node_modules/**" ] } }

إذا كنت تستخدم إطار عمل ويب حديثًا مثل React أو Angular أو Vue.js، فتأكد من تعيين الحقل public إلى مجلد build أو dist المعني.

نشر تطبيق الويب الخاص بك على استضافة Firebase

بعد تكوين تطبيق الويب الخاص بك للنشر، يمكنك الآن نشره على Firebase Hosting باستخدام Firebase CLI. اتبع الخطوات التالية:

1. في المحطة الطرفية الخاصة بك، انتقل إلى دليل المشروع الخاص بك الذي يحتوي على ملف firebase.json.
2. قم بتشغيل أمر firebase deploy . سيقوم هذا الأمر بتحميل الأصول الثابتة لتطبيق الويب الخاص بك إلى Firebase Hosting.
3. بعد اكتمال النشر، ستزودك واجهة سطر أوامر Firebase بعنوان URL حيث أصبح تطبيق الويب الخاص بك الآن مباشرًا ويمكن الوصول إليه. سيكون عنوان URL بالتنسيق https://{your-project-id}.web.app و https://{your-project-id}.firebaseapp.com .

هذا كل شيء! أصبح تطبيق الويب الخاص بك مباشرًا الآن على استضافة Firebase. إذا قمت بإعداد نطاق مخصص، فسيتم أيضًا الوصول إلى تطبيق الويب الخاص بك على عنوان URL الخاص بنطاقك المخصص.

إدارة وتحديث تطبيق الويب الذي تم نشره

بعد نشر تطبيق الويب الخاص بك، قد تحتاج إلى إدارته أو تحديثه. استضافة Firebase تجعل هذه المهام سهلة.

تحديث تطبيق الويب الخاص بك

لتحديث تطبيق الويب الذي تم نشره، اتبع الخطوات التالية:

1. قم بإجراء التغييرات اللازمة على الكود المصدري لتطبيق الويب الخاص بك.
2. قم ببناء تطبيق الويب المحدث الخاص بك، وإنشاء الأصول الثابتة الجاهزة للإنتاج.
3. قم بتشغيل أمر firebase deploy مرة أخرى من دليل المشروع الخاص بك.

ستقوم Firebase Hosting تلقائيًا بتحديث تطبيق الويب الخاص بك بالتغييرات الجديدة، مما يوفر انتقالًا سلسًا للمستخدمين.

العودة إلى الإصدار السابق

إذا كنت بحاجة إلى إرجاع تطبيق الويب الخاص بك إلى إصدار سابق، فيمكنك القيام بذلك باستخدام سجل إصدارات Firebase Hosting. تقوم وحدة تحكم Firebase بتتبع كل عملية نشر، مما يسمح لك بالعودة إلى إصدار محدد عند الحاجة.

1. انتقل إلى Firebase Console وانتقل إلى قسم الاستضافة في مشروعك.
2. انقر فوق علامة التبويب "السجل" لعرض سجل النشر الخاص بك.
3. حدد الإصدار الذي تريد الرجوع إليه، وانقر على أيقونة "...".
4. حدد "العودة إلى هذا الإصدار" من القائمة المنسدلة، وأكد العودة إلى الحالة السابقة.

سيتم الآن إرجاع تطبيق الويب الخاص بك إلى الإصدار المحدد.

مراقبة استخدام تطبيقات الويب

توفر استضافة Firebase إحصائيات الاستخدام لتطبيق الويب الخاص بك، والتي يمكنك عرضها في وحدة تحكم Firebase. يمكن أن تساعدك هذه الإحصائيات في فهم أداء تطبيقك وشعبيته واستهلاكه للموارد. تتضمن بعض المقاييس المتعقبة إجمالي الطلبات، ونتائج ذاكرة التخزين المؤقت، وأخطاء ذاكرة التخزين المؤقت، والتخزين المستخدم، ونقل البيانات.

من خلال فهم تطبيق الويب الخاص بك وإدارته، يمكنك التأكد من أنه يظل آمنًا ومحدثًا مع توفير تجربة مستخدم سلسة. تجعل استضافة Firebase من السهل والفعال نشر تطبيقات الويب وإدارتها ومراقبتها.

إيجابيات وسلبيات استخدام استضافة Firebase لتطبيقات الويب

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

إيجابيات استضافة Firebase

• استضافة آمنة وسريعة وموثوقة: يتم توفير استضافة Firebase بواسطة Google، مما يضمن تجربة استضافة آمنة وسريعة وموثوقة لتطبيق الويب الخاص بك. بفضل شبكة توصيل المحتوى العالمية (CDN) التابعة لشركة Google، سيستفيد تطبيقك من تقليل زمن الوصول وتحسين الأداء.
• سهولة الإعداد والنشر: تجعل واجهة سطر أوامر Firebase عملية إعداد ونشر تطبيق الويب الخاص بك على استضافة Firebase عملية سريعة ومباشرة. باستخدام بعض الأوامر، يمكنك تشغيل تطبيق الويب الخاص بك عبر الإنترنت.
• دعم النطاق المخصص وشهادات SSL التلقائية: تتيح لك استضافة Firebase استخدام النطاقات المخصصة لتطبيق الويب الخاص بك، مما يضمن مظهرًا احترافيًا. بالإضافة إلى ذلك، تعتني استضافة Firebase بإدارة شهادات SSL، مما يوفر لتطبيق الويب الخاص بك تشفير HTTPS تلقائيًا.
• التكامل مع خدمات Firebase الأخرى: يؤدي استخدام استضافة Firebase لتطبيق الويب الخاص بك إلى تسهيل عملية دمج خدمات Firebase الأخرى، مثل وظائف Firebase أو Firestore أو المصادقة. يعد هذا التكامل ذا قيمة خاصة لتطبيقات الويب الحديثة التي تم إنشاؤها باستخدام أطر عمل الواجهة الأمامية التي تعتمد على بنيات بدون خادم لوظائف الواجهة الخلفية.

Try AppMaster no-code today!

Platform can build any web, mobile or backend application 10x faster and 3x cheaper

Start Free

سلبيات استضافة Firebase

• قدرات العرض من جانب الخادم (SSR) المحدودة: تركز استضافة Firebase بشكل أساسي على استضافة الأصول الثابتة، مما يعني أن لديها دعمًا محدودًا لميزات العرض من جانب الخادم (SSR). على الرغم من أنه يمكنك استخدام وظائف Firebase لـ SSR الأساسية، إلا أنها قد لا تكون الحل المثالي لتطبيقات الويب ذات متطلبات العرض الشاملة من جانب الخادم.
• تكاليف الاستضافة المحتملة: على الرغم من أن استضافة Firebase توفر طبقة أساسية مجانية، فقد تحتاج إلى الترقية إلى الخطط المدفوعة مع نمو تطبيق الويب الخاص بك من حيث التخزين ونقل البيانات ومتطلبات الموارد الأخرى. فكر بعناية في تكاليف الاستضافة المرتبطة قبل الالتزام باستضافة Firebase.
• غير مناسبة لجميع تطبيقات الويب: قد لا تكون استضافة Firebase هي الخيار الأفضل لتطبيقات الويب ذات المتطلبات المعقدة من جانب الخادم أو تلك التي تحتاج إلى ميزات لا تدعمها مجموعة خدمات Firebase. في مثل هذه الحالات، قد تكون حلول الاستضافة البديلة أكثر ملاءمة لمشروعك.

AppMaster: تطوير No-Code لتطبيقات الويب

في مجال تطوير تطبيقات الويب، يظهر AppMaster كبديل لقواعد اللعبة من خلال منهجه المبتكر الذي لا يعتمد على التعليمات البرمجية . تعمل هذه الأداة القوية على تمكين المستخدمين من إنشاء تطبيقات الواجهة الخلفية والويب والهواتف المحمولة بسهولة دون معرفة واسعة بالبرمجة.

إحدى ميزات AppMaster المميزة هي قدرته على تسهيل إنشاء تطبيقات الواجهة الخلفية. يمكن للمستخدمين تصميم نماذج البيانات بشكل مرئي، وتحديد منطق الأعمال المعقد من خلال مصمم BP المرئي، وإنشاء واجهات برمجة تطبيقات REST ونقاط endpoints WebSocket. وهذا يتيح التوليد السريع لأنظمة الواجهة الخلفية.

بالنسبة لتطبيقات الويب، يتيح AppMaster إنشاء واجهات المستخدم من خلال إجراءات drag-and-drop البسيطة. يسمح Web BP Designer للمستخدمين بتحديد المنطق لكل مكون، مما يجعل تطبيقات الويب تفاعلية بالكامل. ومن الجدير بالذكر أن العمليات التجارية على الويب يتم تنفيذها داخل متصفح المستخدم، مما يعزز تجارب المستخدم.

يعمل AppMaster أيضًا على تحسين إدارة المشروع عن طريق إنشاء وثائق Swagger (OpenAPI) endpoints الخادم والبرامج النصية لترحيل مخطط قاعدة البيانات . مع كل تغيير في المخطط، يقوم AppMaster بإنشاء مجموعات جديدة من التطبيقات بسرعة في أقل من 30 ثانية. يضمن هذا النهج الفريد عدم وجود ديون فنية متراكمة مرتبطة بالمشروع.

بالإضافة إلى عملية التطوير السريعة، تم تصميم تطبيقات AppMaster للعمل بسلاسة مع أي قاعدة بيانات متوافقة مع PostgreSQL كمخزن بيانات أساسي. باستخدام تطبيقات الواجهة الخلفية المجمعة وعديمة الحالة التي تم إنشاؤها باستخدام Go، تكون تطبيقات AppMaster قابلة للتطوير بطبيعتها، مما يلبي متطلبات كل من حالات الاستخدام الخاصة بالمؤسسات وحالات الاستخدام ذات التحميل العالي. إن مستقبل تطوير تطبيقات الويب مشرق بفضل إمكانيات AppMaster no-code.

افكار اخيرة

توفر استضافة Firebase خيارًا جذابًا لنشر تطبيقات الويب، خاصة للمشروعات التي تستفيد من أطر الواجهة الأمامية الحديثة والبنيات بدون خادم. بفضل استضافتها الآمنة والسريعة والموثوقة، وسهولة الإعداد والنشر، والتكامل السلس مع خدمات Firebase الأخرى، يمكن أن تكون استضافة Firebase خيارًا ممتازًا للعديد من مشاريع تطبيقات الويب.

ومع ذلك، من الضروري الموازنة بين الإيجابيات والسلبيات الموضحة في هذه المقالة لتحديد ما إذا كانت استضافة Firebase مناسبة لحالة الاستخدام الخاصة بك. ضع في اعتبارك عوامل مثل احتياجات العرض من جانب الخادم لتطبيق الويب الخاص بك، وتكاليف الاستضافة المحتملة، والتوافق مع خدمات Firebase الأخرى. من خلال تقييم هذه العوامل بعناية، يمكنك اتخاذ قرار مستنير واختيار أفضل حل استضافة لتطبيق الويب الخاص بك.

لا تنس استكشاف AppMaster ، وهي منصة قوية no-code لإنشاء تطبيقات الواجهة الخلفية والويب وتطبيقات الهاتف المحمول. يوفر AppMaster أدوات للتصميم المرئي لنماذج البيانات والعمليات التجارية وواجهات المستخدم، مما يؤدي إلى أوقات تطوير أسرع وأكثر فعالية من حيث التكلفة. يمكن أيضًا دمج إمكانات إنشاء تطبيقات الويب مع Firebase Hosting للحصول على حل فعال وقابل للتطوير لنشر تطبيقات الويب الخاصة بك.