پیش نمایش برنامه شما

Firebase Studio روش‌های مختلفی برای پیش‌نمایش و آزمایش برنامه شما در طول توسعه ارائه می‌دهد. این شامل استفاده از App Prototyping agent و بهره‌برداری از پیش‌نمایش‌گر وب داخلی و پیش‌نمایش‌گرهای وب و اندروید موجود در فضاهای کاری فایربیس استودیو می‌شود.

محیط پیش‌نمایش خود را فعال و پیکربندی کنید

اگر از یک الگو استفاده می‌کنید یا برنامه خود را با استفاده از App Prototyping agent تولید می‌کنید، پیش‌نمایش‌ها اغلب از قبل برای شما پیکربندی شده‌اند. اگر پیش‌نمایش‌ها از قبل در الگوی شما تنظیم نشده‌اند، می‌توانید آنها را در فایل پیکربندی Nix پروژه پیکربندی کنید.

1. از فضای کاری خود، .idx/dev.nix ‎ را باز کنید.

   Firebase Studio به طور خودکار این فایل را هنگام ایجاد یک فضای کاری جدید تولید می‌کند و بر اساس الگویی که انتخاب می‌کنید، هر محیط پیش‌نمایش قابل اجرا را شامل می‌شود. اگر این فایل در مخزن کد Firebase Studio شما نیست، آن را ایجاد کنید و سپس ویژگی idx.previews را روی true تنظیم کنید. سپس، ویژگی‌های پیکربندی را اضافه کنید، همانطور که در مثال زیر نشان داده شده است:

   { pkgs, ... }: {
   
     # NOTE: This is an excerpt of a complete Nix configuration example.
     # For more information about the dev.nix file in Firebase Studio, see
     # https://firebase.google.com/docs/studio/customize-workspace
   
     # Enable previews and customize configuration
     idx.previews = {
       enable = true;
       previews = {
         # The following object sets web previews
         web = {
           command = [
             "npm"
             "run"
             "start"
             "--"
             "--port"
             "$PORT"
             "--host"
             "0.0.0.0"
             "--disable-host-check"
           ];
           manager = "web";
           # Optionally, specify a directory that contains your web app
           # cwd = "app/client";
         };
         # The following object sets Android previews
         # Note that this is supported only on Flutter workspaces
         android = {
           manager = "flutter";
         };
       };
     };
   }
   

   برای لیست کامل ویژگی‌های Nix در Firebase Studio ، به Nix + Firebase Studio مراجعه کنید.

2. محیط خود را بازسازی کنید:

   • از پالت دستورات ( Cmd+Shift+P / Ctrl+Shift+P )، دستور Firebase Studio : Hard restart را اجرا کنید.
   • از اعلان به‌روزرسانی‌شده‌ی پیکربندی محیط ، روی «بازسازی محیط» کلیک کنید.

   وقتی محیط را پس از تغییر فایل dev.nix خود بازسازی می‌کنید، پنل پیش‌نمایش در فضای کاری شما ظاهر می‌شود که بسته به آنچه فعال کرده‌اید، یکی از تب‌های اندروید و وب یا هر دو را نشان می‌دهد.

استفاده از پیش‌نمایش‌های برنامه

Firebase Studio پیش‌نمایش‌های وب را در کروم و شبیه‌سازهای اندروید را در فضاهای کاری فلاتر ارائه می‌دهد که برنامه شما را در محیط پیش‌نمایش نصب می‌کنند. این به شما امکان می‌دهد برنامه خود را به طور کامل، از ابتدا تا انتها، مستقیماً از فضای کاری خود آزمایش کنید.

پیش‌نمایش‌های به‌روزرسانی‌شده برای وب و اندروید

Firebase Studio به قابلیت‌های بارگذاری مجدد در حین کار (hot reload) فریم‌ورک‌های زیرین (مانند npm run start و flutter hot-reload ) متصل می‌شود تا یک حلقه توسعه داخلی ساده را در اختیار شما قرار دهد. Firebase Studio انواع بارگذاری مجدد زیر را ارائه می‌دهد:

• بارگذاری مجدد خودکار : بارگذاری‌های مجدد خودکار هنگام ذخیره یک فایل به طور خودکار انجام می‌شوند. این بارگذاری که گاهی اوقات به عنوان جایگزینی ماژول داغ (یا HMR) شناخته می‌شود، برنامه شما را بدون بارگذاری مجدد صفحه (برای برنامه‌های وب) یا بدون راه‌اندازی مجدد یا نصب مجدد برنامه (برای شبیه‌سازها) به‌روزرسانی می‌کند. این رویکرد برای حفظ وضعیت زنده برنامه شما مفید است، اما ممکن است همیشه آنطور که در نظر گرفته شده عمل نکند.

• بارگذاری مجدد کامل دستی : این گزینه معادل رفرش صفحه (برای برنامه‌های وب) یا راه‌اندازی مجدد برنامه (برای شبیه‌سازها) است. توصیه می‌کنیم برای ثبت تغییرات قابل توجه در کد منبع خود، مانند هنگام بازسازی بخش‌های بزرگی از کد، از بارگذاری مجدد کامل استفاده کنید.

• راه‌اندازی مجدد دستی (Manual Hard Restart ): این گزینه سیستم پیش‌نمایش Firebase Studio را به‌طور کامل راه‌اندازی مجدد می‌کند، که شامل توقف و راه‌اندازی مجدد وب سرور برنامه شما نیز می‌شود.

همه گزینه‌های بارگذاری مجدد با استفاده از نوار ابزار پیش‌نمایش یا پالت فرمان ( Cmd+Shift+P در مک یا Ctrl+Shift+P در کروم‌او‌اس، ویندوز یا لینوکس) در دسته‌بندی Firebase Studio در دسترس هستند.

برای استفاده از نوار ابزار پیش‌نمایش، مراحل زیر را دنبال کنید:

1. برای تازه‌سازی صفحه، روی نماد بارگذاری مجدد کلیک کنید. این کار باعث بارگذاری مجدد کامل صفحه می‌شود. برای نوع دیگری از تازه‌سازی، روی پیکان کنار نماد بارگذاری مجدد کلیک کنید تا منو باز شود.

2. گزینه‌ی رفرش مورد نظر خود را از منو انتخاب کنید: بارگذاری مجدد فوری (Hot Reload )، بارگذاری مجدد کامل (Full Reload ) یا راه‌اندازی مجدد سخت (Hard Restart) .

پیش‌نمایش وب خود را با دیگران به اشتراک بگذارید

شما می‌توانید پیش‌نمایش وب برنامه خود را با فعال کردن دسترسی و سپس اشتراک‌گذاری لینک مستقیم پیش‌نمایش، برای دریافت بازخورد با دیگران به اشتراک بگذارید:

1. در نوار ابزار پیش‌نمایش وب، روی آیکون پیش‌نمایش لینک اشتراک‌گذاری ، در سمت راست نوار آدرس برای باز کردن منوی اشتراک‌گذاری.

2. با استفاده از یکی از این گزینه‌ها، به دیگران اجازه دهید به فضای کاری شما دسترسی داشته باشند:

   • پیش‌نمایش را عمومی کنید : پیش‌نمایش فضای کاری خود را در دسترس عموم قرار دهید. این به هر کسی در اینترنت اجازه می‌دهد تا زمانی که فضای کاری شما فعال است و تا زمانی که دسترسی عمومی را خاموش کنید، به سرور پیش‌نمایش که در فضای کاری شما اجرا می‌شود، دسترسی داشته باشد.

   • مدیریت دسترسی به فضای کاری . فضای کاری خود را فقط با افرادی که می‌خواهید به آنها دسترسی بدهید، به اشتراک بگذارید.

3. برای کپی کردن لینک مستقیم به پیش‌نمایش فضای کاری، گزینه «کپی پیش‌نمایش URL» را انتخاب کنید تا بتوانید آن را برای کسانی که می‌خواهید از آنها بازخورد دریافت کنید، ارسال کنید. همچنین می‌توانید از کد QR که ظاهر می‌شود برای باز کردن پیش‌نمایش خود در دستگاه تلفن همراه خود استفاده کنید.

پیکربندی ذخیره خودکار و بارگذاری مجدد فوری

به طور پیش‌فرض، Firebase Studio یک ثانیه پس از توقف تایپ، کار شما را به صورت خودکار ذخیره می‌کند و باعث بارگذاری مجدد خودکار صفحه می‌شود. اگر می‌خواهید Firebase Studio کار شما را در فاصله زمانی متفاوتی ذخیره کند، تنظیمات ذخیره خودکار را تغییر دهید. همچنین می‌توانید ذخیره خودکار را خاموش کنید.

پیش‌نمایش بخش مدیریت قطع شد

شما می‌توانید با خیال راحت پیام «پیش‌نمایش اتصال به backend قطع شد» را نادیده بگیرید.

مراحل بعدی

• با فایربیس منتشر کنید .
• برنامه خود را رصد کنید .