במדריך למתחילים הזה נסביר איך להשתמש ב-Firebase SQL Connect עם כלי ה-AI שלכם לכתיבת קוד כדי לבנות במהירות אפליקציות רלציוניות מלאות. אם תציידו את הסוכן שלכם ב-Firebase Agent Skills, לא תצטרכו לכתוב קוד מסוג boilerplate למסד נתונים או להגדיר נקודות קצה באופן ידני. תלמדו איך להגדיר את הפרויקט המקומי, להגדיר את עוזר ה-AI ולהשתמש בהנחיה אחת כדי ליצור סכמת PostgreSQL מאובטחת, פעולות GraphQL וממשק קצה מלא של React. תוכלו להשתמש במה שתלמדו כאן כדי לבנות ממשקי קצה לכל הפלטפורמות ש-Firebase SQL Connect תומך בהן.
לפני שמתחילים
כדי להשלים את המדריך למתחילים הזה, צריך לוודא שהסביבה שלכם מוגדרת עם הרכיבים הבאים. אם אתם צריכים עזרה מפורטת לגבי מערכת ההפעלה הספציפית שלכם, תוכלו לעיין במדריך ההגדרה הרגיל:
- Node.js: מתקינים את Node.js כדי להריץ את Firebase CLI ולהפעיל את ממשק הקצה של React שנוצר.
Firebase CLI: מתקינים את Firebase CLI באופן גלובלי:
npm install -g firebase-toolsכלי תכנות מבוסס-AI: מתקינים עורך מודרני מבוסס-AI (כמו Antigravity, Android Studio, Cursor או Windsurf).
הגדרת סביבת העבודה
קודם פותחים את כלי ה-AI המועדף לכתיבת קוד ויוצרים ספריית פרויקט חדשה. פותחים את הטרמינל המשולב של הכלי ומריצים את פקודת האתחול:
firebase init dataconnect
הפקודה הזו תעזור לכם לאתחל את הפרויקט. כשתתבקשו, תצטרכו לבחור את האפשרויות הבאות:
- יצירת פרויקט חדש ב-Firebase
- דילוג על יצירת סכימת Gemini
- יצירת מכונה חדשה של Cloud SQL
- יצירת תבנית React
- בוחרים באפשרות כן כדי להתקין את Agent Skills for Firebase
יצירת אפליקציה באמצעות AI
אחרי שמתקינים את Firebase Agent Skills, העוזר הדיגיטלי מבוסס-AI יכול ליצור את הסכימה, הפעולות וקוד הקצה הקדמי של SQL Connect ישירות מהנחיה ברמה גבוהה.
כדי ליצור את הקצה העורפי, את קשרי מסד הנתונים ואת הקצה הקדמי של React, מעתיקים ומדביקים אחת מההנחיות הבאות בעוזר ה-AI:
דוגמה 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.
מה עוזר ה-AI יוצר
כשמריצים את ההנחיות האלה, העוזר הדיגיטלי מבוסס ה-AI מטפל באופן אוטומטי בפעולות הטכניות המורכבות:
- סכימת מסד נתונים (
dataconnect/schema/schema.gql): מתרגם את הדרישות שלכם לטבלאות יחסיות באמצעות ההנחיה@table, ומנהל באופן אוטומטי מפתחות זרים ומפתחות ראשיים. - פעולות GraphQL (
dataconnect/[connector_name]/*.gql): יוצרת את השאילתות והמוטציות המדויקות שנדרשות לאפליקציה שלכם, ומאבטחת אותן באמצעות ההנחיה@auth. - SDK שנוצר (
src/dataconnect/): משתמש ב-Firebase CLI כדי ליצור באופן מיידי SDK של לקוח עם הקלדה חזקה על סמך הסכימה והפעולות שלכם. - React Frontend (
src/): יוצר אפליקציית React מלאה עם סגנון יפהפה שמשתמשת ב-SDK שנוצר כדי לתקשר עם ה-Backend החדש.
פריסה בסביבת הייצור
כדי לפרוס את הסכימה, השאילתות והמוטציות בסביבת הייצור, מריצים את הפקודה הבאה בטרמינל:
firebase deploy --only dataconnect
אחרי הפריסה, נכנסים למסוף Firebase כדי לראות את הסכימה הפעילה ולהריץ פעולות ישירות במכונת Cloud SQL.
השלבים הבאים
אחרי שסיימתם את המדריך למתחילים, הנה כמה פעולות שאפשר לבצע:
- אפשר לעיין במאגר של אפליקציית התחלה מהירה וליצור אפליקציית SQL Connect באמצעות הדרכות הקוד שלנו.
- מוסיפים נתונים למסד הנתונים ועוקבים אחרי שירות SQL Connect ב-Firebase console.
- מידע נוסף על פיתוח סכימה, שאילתות ומוטציות
- מידע נוסף על ערכות SDK ללקוח ועל ערכות SDK לאדמין