If you are building server-rendered Angular or Next.js apps, check out next-generation Firebase App Hosting, a full-stack solution for modern web frameworks.
קל לארגן דפים בעזרת אוספים
אפשר לשמור ולסווג תוכן על סמך ההעדפות שלך.
Firebase Hosting משתלב עם מסגרות אינטרנט מודרניות פופולריות, כולל Angular ו-Next.js. באמצעות Firebase Hosting ו-Cloud Functions for Firebase עם המסגרות האלה, אתם יכולים לפתח אפליקציות ומיקרו-שירותים בסביבת המסגרת המועדפת עליכם, ואז לפרוס אותם בסביבת שרת מנוהלת ומאובטחת.
התמיכה במהלך גרסת הטרום-השקה הזו כוללת את הפונקציות הבאות:
פריסת אפליקציות אינטרנט שמשתמשות בטרום-עיבוד או ביצירת אתרים סטטיים (SSG)
פריסת אפליקציות אינטרנט שמשתמשות ב-SSR (Server-Side Rendering) – עיבוד מלא של השרת לפי דרישה
Firebase מספקת את הפונקציונליות הזו דרך Firebase CLI. כשמפעילים את Hosting בשורת הפקודה, מספקים מידע על פרויקט האינטרנט החדש או הקיים, וממשק ה-CLI מגדיר את המשאבים המתאימים למסגרת האינטרנט שבחרתם.
לפני שמתחילים
לפני שמתחילים לפרוס את האפליקציה ב-Firebase, כדאי לעיין בדרישות ובאפשרויות הבאות:
Firebase CLI בגרסה 12.1.0 ואילך. חשוב להתקין את ה-CLI בשיטה המועדפת.
אופציונלי: חיוב מופעל בפרויקט Firebase (נדרש אם מתכננים להשתמש ב-SSR)
הצגה מקומית
כדי לבדוק את השילוב באופן מקומי, פועלים לפי השלבים הבאים:
מריצים את הפקודה firebase emulators:start מהטרמינל. הפקודה הזו בונה את האפליקציה ומפעילה אותה באמצעות Firebase CLI.
פותחים את אפליקציית האינטרנט בכתובת ה-URL המקומית שמוחזרת על ידי ה-CLI (בדרך כלל http://localhost:5000).
פריסת האפליקציה ב-Firebase Hosting
כשמוכנים לשתף את השינויים עם העולם, פורסים את האפליקציה באתר הפעיל:
מריצים את הפקודה firebase deploy מהטרמינל.
בודקים את האתר בכתובת SITE_ID.web.app או PROJECT_ID.web.app (או בדומיין המותאם אישית, אם הגדרתם אחד כזה).
הגדרת סביבות שונות
אפשר לפרוס כמה קבוצות של משתני סביבה לסביבות פרויקט שונות, כמו Staging וייצור.
בדומה ל-Cloud Functions for Firebase, ערכת הכלים הזו תומכת בפורמט הקובץ dotenv לטעינת משתני סביבה שצוינו בקובץ .env.
אם יש לכם כינוי לפרויקט staging, אתם יכולים לפרוס משתני סביבה מקובץ .env.staging.
אם יש לכם כינוי לפרויקט production, אתם יכולים לפרוס משתני סביבה מקובץ .env.production.
אם יש לכם פרויקט עם מזהה PROJECT_ID, אתם יכולים לפרוס משתני סביבה מקובץ .env.PROJECT_ID.
[[["התוכן קל להבנה","easyToUnderstand","thumb-up"],["התוכן עזר לי לפתור בעיה","solvedMyProblem","thumb-up"],["סיבה אחרת","otherUp","thumb-up"]],[["חסרים לי מידע או פרטים","missingTheInformationINeed","thumb-down"],["התוכן מורכב מדי או עם יותר מדי שלבים","tooComplicatedTooManySteps","thumb-down"],["התוכן לא עדכני","outOfDate","thumb-down"],["בעיה בתרגום","translationIssue","thumb-down"],["בעיה בדוגמאות/בקוד","samplesCodeIssue","thumb-down"],["סיבה אחרת","otherDown","thumb-down"]],["עדכון אחרון: 2025-08-31 (שעון UTC)."],[],[],null,["\u003cbr /\u003e\n\nFirebase Hosting integrates with popular modern web frameworks including Angular\nand Next.js. Using Firebase Hosting and Cloud Functions for Firebase with these\nframeworks, you can develop apps and microservices in your preferred framework\nenvironment, and then deploy them in a managed, secure server environment.\n\nSupport during this early preview includes the following functionality:\n\n- Deploy Web apps comprised of static web content\n- Deploy Web apps that use pre-rendering / Static Site Generation (SSG)\n- Deploy Web apps that use server-side Rendering (SSR)---full server rendering on demand\n\nFirebase provides this functionality through the Firebase CLI. When initializing\nHosting on the command line, you provide information about your new or existing\nWeb project, and the CLI sets up the right resources for your chosen Web\nframework.\n| **Note:** Framework-aware Hosting is an early public preview. This means that the functionality might change in backward-incompatible ways. A preview release is not subject to any SLA or deprecation policy and may receive limited or no support.\n\nBefore you begin\n\nBefore you get started deploying your app to Firebase,\nreview the following requirements and options:\n\n- Firebase CLI version 12.1.0 or later. Make sure to [install the CLI](/docs/cli#install_the_firebase_cli) using your preferred method.\n- Optional: Billing enabled on your Firebase project (required if you plan to use SSR)\n\nServe locally\n\nYou can test your integration locally by following these steps:\n\n1. Run `firebase emulators:start` from the terminal. This builds your app and serves it using the Firebase CLI.\n2. Open your web app at the local URL returned by the CLI (usually http://localhost:5000).\n\nDeploy your app to Firebase Hosting\n\nWhen you're ready to share your changes with the world, deploy your app to your\nlive site:\n\n1. Run `firebase deploy` from the terminal.\n2. Check your website on: `SITE_ID.web.app` or `PROJECT_ID.web.app` (or your custom domain, if you set one up).\n\nConfigure different environments\n\nYou can deploy multiple sets of environment variables for different project environments, such as staging and production.\n\nLike Cloud Functions for Firebase, this tooling supports the [dotenv](https://www.npmjs.com/package/dotenv) file format for loading environment variables specified in a .env file.\n\n- If you have a `staging` project alias, you can deploy environment variables from a `.env.staging` file.\n- If you have a `production` project alias, you can deploy environment variables from a `.env.production` file.\n- If you have a project with id `PROJECT_ID`, you can deploy environment variables from a `.env.PROJECT_ID` file.\n\nSee the [Cloud Functions documentation](https://firebase.google.com/docs/functions/config-env?gen=2nd#deploying_multiple_sets_of_environment_variables) for a detailed guide.\n\nNext steps\n\nSee the detailed guide for your preferred framework:\n\n- [Angular](/docs/hosting/frameworks/angular)\n- [Next.js](/docs/hosting/frameworks/nextjs)\n- [Flutter Web](/docs/hosting/frameworks/flutter)\n- [Frameworks with Express.js](/docs/hosting/frameworks/express)"]]
