يوضّح لك دليل البدء السريع هذا كيفية استخدام Firebase SQL Connect مع أداة ترميز الذكاء الاصطناعي لإنشاء تطبيقات علائقية ذات حزمة كاملة بسرعة. من خلال تزويد وكيلك بمهارات وكيل Firebase، لن تحتاج إلى كتابة رمز قاعدة البيانات النمطي أو إعداد نقاط النهاية يدويًا. ستتعرّف على كيفية إعداد مشروعك المحلي، وضبط مساعد الذكاء الاصطناعي، واستخدام طلب واحد لإنشاء مخطط PostgreSQL آمن وعمليات GraphQL وواجهة أمامية كاملة باستخدام React. يمكنك استخدام ما تتعلمه هنا لإنشاء واجهات أمامية لأي من المنصات التي تتوافق مع Firebase SQL Connect.
قبل البدء
لإكمال هذا الدليل السريع، تأكَّد من إعداد بيئتك باستخدام ما يلي. إذا كنت بحاجة إلى مساعدة مفصّلة بشأن نظام التشغيل الخاص بك، يمكنك الاطّلاع على دليل الإعداد العادي:
- Node.js: ثبِّت Node.js لتشغيل Firebase CLI وتشغيل واجهة React الأمامية التي تم إنشاؤها.
Firebase CLI: ثبِّت Firebase CLI على مستوى العالم:
npm install -g firebase-toolsأداة الترميز بالذكاء الاصطناعي: ثبِّت أداة تعديل حديثة مستندة إلى الذكاء الاصطناعي (مثل Antigravity أو استوديو Android أو Cursor أو Windsurf).
إعداد مساحة العمل
أولاً، افتح أداة البرمجة المستندة إلى الذكاء الاصطناعي المفضّلة لديك وأنشئ دليل مشروع جديدًا. افتح الوحدة الطرفية المدمجة في أداتك ونفِّذ أمر التهيئة:
firebase init dataconnect
يرشدك هذا الأمر خلال عملية بدء مشروعك. عندما يُطلب منك ذلك، حدِّد الخيارات التالية:
- إنشاء مشروع جديد على Firebase
- تخطّي إنشاء مخطط Gemini
- إنشاء مثيل Cloud SQL جديد
- إنشاء نموذج React
- انقر على نعم لتثبيت "مهارات الوكيل" في Firebase
إنشاء تطبيقك باستخدام الذكاء الاصطناعي
بعد تثبيت "مهارات وكيل Firebase"، يمكن لمساعدك المستنِد إلى الذكاء الاصطناعي إنشاء مخطط SQL Connect وعملياته ورمز الواجهة الأمامية مباشرةً من طلب عالي المستوى.
انسخ أحد الطلبات التالية والصقه في مساعدك المستند إلى الذكاء الاصطناعي لإنشاء الواجهة الخلفية وعلاقات قاعدة البيانات وواجهة React الأمامية:
المثال 1: تطبيق لمراجعة الأفلام
الطلب:
Build a movie review website using Firebase SQL Connect. Customers can browse
a catalog of movies presented in a modern card layout displaying average
ratings and review counts, and leave a review from 1 to 5 stars. A user must
only be allowed to leave a single review per movie. Build a styled React
(Vite) frontend that displays the catalog and dynamically renders a live feed
of new reviews. Compile the database backend and React frontend, seed the
database with sample data, and verify that the application builds cleanly and
all core user flows run successfully.
المثال 2: واجهة محلّ للتجارة الإلكترونية
الطلب:
Build an online storefront using Firebase SQL Connect. Customers can browse
product cards showing prices and stock levels, manage a shopping cart, and
check out securely. The checkout transaction must atomically verify that
their cart is not empty, check that products are in stock, create the order,
and decrease the product stock, safely rolling back if any step fails.
Build a highly responsive React (Vite) storefront with a polished checkout
process. Compile the database backend and React frontend, seed the database
with sample data, and verify that the application builds cleanly and all
core user flows run successfully.
المثال 3: مدونة تضمّ مؤلفين متعددين
الطلب:
Create a multi-author blog platform using Firebase SQL Connect. The homepage
should display published articles formatted in an elegant typographic layout
with comfortable reading line lengths and serif headings. Users should have
access to a secure split-pane writing dashboard built using React (Vite) to
compose posts with a live preview. Compile the database backend and React
frontend, seed the database with sample data, and verify that the
application builds cleanly and all core user flows run successfully.
المحتوى الذي ينشئه "المساعد" المستنِد إلى الذكاء الاصطناعي
عند تنفيذ هذه الطلبات، يتولّى مساعدك المستند إلى الذكاء الاصطناعي تلقائيًا المهام التقنية المعقّدة، مثل:
- مخطط قاعدة البيانات (
dataconnect/schema/schema.gql): يحوّل متطلباتك إلى جداول ذات صلة باستخدام التوجيه@table، مع إدارة المفاتيح الخارجية والمفاتيح الأساسية تلقائيًا. - عمليات GraphQL (
dataconnect/[connector_name]/*.gql): تنشئ الاستعلامات والتعديلات المطلوبة بالضبط من تطبيقك، وتتم حمايتها باستخدام التوجيه@auth. - حزمة SDK التي تم إنشاؤها (
src/dataconnect/): تستخدم واجهة سطر الأوامر (CLI) من Firebase لإنشاء حزمة SDK للعميل ذات أنواع محددة بشكل فوري استنادًا إلى المخطط والعمليات. - واجهة React الأمامية (
src/): تربط تطبيق React كاملاً ومصمّمًا بشكل جميل يستخدم حزمة SDK التي تم إنشاؤها للتواصل مع الخلفية الجديدة.
النشر في الإصدار العلني
لنشر المخطط والاستعلامات والتعديلات في مرحلة الإنتاج، شغِّل الأمر التالي في الوحدة الطرفية:
firebase deploy --only dataconnect
بعد النشر، انتقِل إلى "وحدة تحكّم Firebase" لعرض المخطط النشط وتنفيذ العمليات مباشرةً على مثيل Cloud SQL.
الخطوات التالية
بعد إكمال دليل البدء السريع، إليك بعض الخطوات التالية:
- استكشاف مستودع لتطبيق سريع التشغيل وإنشاء تطبيق SQL Connect باتّباع الدروس التطبيقية حول الترميز
- أضِف البيانات إلى قاعدة البيانات، وراقِب خدمة SQL Connect في وحدة تحكّم Firebase.
- تعرَّف على مزيد من المعلومات حول تطوير المخطط والاستعلام والتعديل.
- مزيد من المعلومات عن حِزم تطوير البرامج (SDK) الخاصة بالعملاء وحِزم تطوير البرامج (SDK) الخاصة بالمشرفين