فضای کاری Firebase Studio خود را سفارشی کنید

Firebase Studio به شما این امکان را می دهد تا با تعریف یک فایل پیکربندی .idx/dev.nix که شرح می دهد، فضای کاری خود را مطابق با نیازهای منحصر به فرد پروژه خود تنظیم کنید:

  • ابزارهای سیستمی که باید بتوانید اجرا کنید (مثلاً از ترمینال)، مانند کامپایلرها یا باینری های دیگر.
  • افزونه هایی که باید نصب کنید (مثلاً پشتیبانی از زبان برنامه نویسی).
  • پیش‌نمایش‌های برنامه شما چگونه باید نمایش داده شوند (به عنوان مثال، دستورات اجرای وب سرور شما).
  • متغیرهای محیط جهانی در دسترس سرورهای محلی در حال اجرا در فضای کاری شما.

برای توضیح کامل آنچه در دسترس است به مرجع dev.nix مراجعه کنید.

Nix و Firebase Studio

Firebase Studio از Nix برای تعریف پیکربندی محیط برای هر فضای کاری استفاده می کند. به طور خاص، Firebase Studio از موارد زیر استفاده می کند:

  • زبان برنامه نویسی Nix برای توصیف محیط های فضای کاری. Nix یک زبان برنامه نویسی کاربردی است. ویژگی‌ها و کتابخانه‌های بسته‌ای که می‌توانید در فایل dev.nix تعریف کنید، از نحو مجموعه ویژگی‌های Nix پیروی می‌کنند.

  • مدیر بسته Nix برای مدیریت ابزارهای سیستم موجود در فضای کاری شما. این شبیه به مدیران بسته های خاص سیستم عامل مانند APT ( apt و apt-get )، Homebrew ( brew ) و dpkg است.

از آنجایی که محیط‌های Nix قابل تکرار و بیان هستند، در چارچوب Firebase Studio ، این بدان معناست که می‌توانید فایل پیکربندی Nix خود را به عنوان بخشی از مخزن Git خود به اشتراک بگذارید تا مطمئن شوید همه افرادی که روی پروژه شما کار می‌کنند پیکربندی محیطی یکسانی دارند.

یک مثال اساسی

مثال زیر یک پیکربندی محیطی اولیه را نشان می دهد که پیش نمایش ها را فعال می کند:

{ pkgs, ... }: {

  # Which nixpkgs channel to use.
  channel = "stable-23.11"; # or "unstable"

  # Use https://search.nixos.org/packages to find packages
  packages = [
    pkgs.nodejs_20
  ];

  # Sets environment variables in the workspace
  env = {
    SOME_ENV_VAR = "hello";
  };

  # Search for the extensions you want on https://open-vsx.org/ and use "publisher.id"
  idx.extensions = [
    "angular.ng-template"
  ];

  # Enable previews and customize configuration
  idx.previews = {
    enable = true;
    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";
      };
    };
  };
}

ابزارهای سیستم را اضافه کنید

برای افزودن ابزارهای سیستم به فضای کاری خود، مانند کامپایلرها یا برنامه‌های CLI برای سرویس‌های ابری، شناسه بسته منحصربه‌فرد را در رجیستری بسته Nix بیابید و آن را به شیء packages فایل dev.nix خود، با پیشوند «pkgs» اضافه کنید:

{ pkgs, ... }: {
  # Which nixpkgs channel to use.
  channel = "stable-23.11"; # or "unstable"

  # Use https://search.nixos.org/packages to find packages
  packages = [
    pkgs.nodejs_20
  ];
  ...
}

این با نحوه نصب بسته‌های سیستمی با استفاده از مدیران بسته خاص سیستم عامل مانند APT ( apt و apt-get )، Homebrew ( brew ) و dpkg متفاوت است. تشریح دقیق بسته‌های سیستمی مورد نیاز به این معنی است که فضاهای کاری Firebase Studio آسان‌تر برای اشتراک‌گذاری و بازتولید هستند.

از باینری های گره محلی استفاده کنید

درست مانند ماشین محلی شما، باینری های مربوط به بسته های گره نصب شده به صورت محلی (به عنوان مثال، بسته های تعریف شده در package.json شما) را می توان با فراخوانی آنها با دستور npx در یک پنل ترمینال اجرا کرد.

به عنوان یک راحتی بیشتر، اگر در دایرکتوری با پوشه node_modules هستید (مانند دایرکتوری ریشه یک پروژه وب)، باینری های نصب شده محلی می توانند مستقیماً و بدون پیشوند npx فراخوانی شوند.

اجزای gcloud را اضافه کنید

یک پیکربندی پیش‌فرض از gcloud CLI برای Google Cloud برای همه فضاهای کاری Firebase Studio در دسترس است.

اگر به اجزای اضافی نیاز دارید، می توانید آنها را به فایل dev.nix خود اضافه کنید:

{ pkgs }: {
  packages = [
    ...
    (pkgs.google-cloud-sdk.withExtraComponents [
      pkgs.google-cloud-sdk.components.cloud-datastore-emulator
    ])
    ...
  ];
}

افزودن پسوندهای IDE

شما می توانید برنامه های افزودنی را در Firebase Studio با استفاده از رجیستری افزونه OpenVSX به دو روش نصب کنید:

  • از پنل Extensions در Firebase Studio برای کشف و نصب افزونه ها استفاده کنید. این رویکرد برای برنامه های افزودنی خاص کاربر مانند:

    • تم های رنگی سفارشی
    • شبیه سازی ویرایشگر، مانند VSCodeVim
  • پسوندها را به فایل dev.nix خود اضافه کنید . هنگامی که پیکربندی فضای کاری خود را به اشتراک می گذارید، این افزونه ها به طور خودکار نصب می شوند. این رویکرد برای برنامه های افزودنی خاص پروژه مانند:

    • پسوندهای زبان برنامه نویسی، از جمله اشکال زداهای خاص زبان
    • برنامه های افزودنی رسمی برای سرویس های ابری مورد استفاده در پروژه شما
    • فرمت کننده های کد

برای رویکرد دوم، می‌توانید پسوندهای IDE را با یافتن شناسه پسوند کاملاً واجد شرایط (از فرم <publisher>.<id> ) و افزودن آن به شی idx.extensions در فایل dev.nix خود قرار دهید:

{ pkgs, ... }: {
  ...
  # Search for the extensions you want on https://open-vsx.org/ and use the format
  # "<publisher>.<id>"
  idx.extensions = [
    "angular.ng-template"
  ];
  ...
}

خدمات مشترک را اضافه کنید

Firebase Studio همچنین تنظیمات و پیکربندی ساده‌شده‌ای را برای سرویس‌های رایجی که ممکن است در طول توسعه به آن نیاز داشته باشید، ارائه می‌دهد، از جمله:

  • ظروف
    • داکر ( services.docker.* )
  • پیام رسانی
    • شبیه ساز Pub/Sub ( services.pubsub.* )
  • پایگاه های داده
    • MySQL ( services.mysql.* )
    • Postgres ( services.postgres.* )
    • Redis ( services.redis.* )
    • آچار ( services.spanner.* )

برای جزئیات فعال کردن این سرویس‌ها در فضای کاری خود، به بخش‌های services.* از مرجع dev.nix مراجعه کنید.

سفارشی کردن پیش نمایش ها

برای جزئیات در مورد نحوه سفارشی کردن پیش‌نمایش‌های برنامه، به پیش‌نمایش برنامه خود مراجعه کنید.

نماد فضای کاری خود را تنظیم کنید

می‌توانید با قرار دادن یک فایل PNG به نام icon.png در داخل فهرست .idx در همان سطح فایل dev.nix ، یک نماد سفارشی برای فضای کاری خود انتخاب کنید. سپس Firebase Studio از این نماد برای نشان دادن فضای کاری شما در داشبورد استفاده می کند.

از آنجایی که این فایل را می توان در کنترل منبع (مانند Git) بررسی کرد، این یک راه خوب برای کمک به همه کسانی است که روی پروژه شما کار می کنند، هنگام استفاده از Firebase Studio همان نماد پروژه شما را ببینند. و از آنجایی که فایل می‌تواند در شاخه‌های Git متفاوت باشد، می‌توانید از این نماد برای تمایز بصری بین فضای کاری برنامه‌های بتا و تولیدی و برای اهداف دیگر استفاده کنید.

سفارشی سازی های خود را به یک الگو تبدیل کنید

برای تبدیل پیکربندی محیط خود به یک "محیط آغازین" که هر کسی می تواند از آن برای ساخت پروژه های جدید استفاده کند، به اسناد ایجاد قالب های سفارشی مراجعه کنید.

تمام گزینه های سفارشی سازی را کاوش کنید

مرجع dev.nix را برای شرح مفصلی از طرح پیکربندی محیط بررسی کنید.

فایل های خود را دانلود کنید

برای دانلود فایل های خود به صورت فایل فشرده:

  • روی هر دایرکتوری در پنجره Explorer کلیک راست کرده و Zip and Download را انتخاب کنید.

برای دانلود همه چیز در فهرست پروژه خود:

  1. File > Open Folder را انتخاب کنید.

  2. پوشه پیش فرض /home/user بپذیرید.

  3. پس از بارگیری فایل ها، روی پوشه کاری خود کلیک راست کرده و Zip and Download را انتخاب کنید. اگر از App Prototyping agent استفاده می کنید، دایرکتوری کاری شما studio خواهد بود. اگر از یک الگو یا پروژه آپلود شده استفاده می کنید، این نام پروژه شما خواهد بود.

  4. هنگامی که از شما برای بازسازی محیط خواسته شد، روی لغو کلیک کنید.

  5. پس از اتمام دانلود، دایرکتوری کاری خود را از منوی File دوباره باز کنید تا به فضای کاری خود برگردید.

مراحل بعدی

،

Firebase Studio به شما این امکان را می دهد تا با تعریف یک فایل پیکربندی .idx/dev.nix که شرح می دهد، فضای کاری خود را مطابق با نیازهای منحصر به فرد پروژه خود تنظیم کنید:

  • ابزارهای سیستمی که باید بتوانید اجرا کنید (مثلاً از ترمینال)، مانند کامپایلرها یا باینری های دیگر.
  • افزونه هایی که باید نصب کنید (مثلاً پشتیبانی از زبان برنامه نویسی).
  • پیش‌نمایش‌های برنامه شما چگونه باید نمایش داده شوند (به عنوان مثال، دستورات اجرای وب سرور شما).
  • متغیرهای محیط جهانی در دسترس سرورهای محلی در حال اجرا در فضای کاری شما.

برای توضیح کامل آنچه در دسترس است به مرجع dev.nix مراجعه کنید.

Nix و Firebase Studio

Firebase Studio از Nix برای تعریف پیکربندی محیط برای هر فضای کاری استفاده می کند. به طور خاص، Firebase Studio از موارد زیر استفاده می کند:

  • زبان برنامه نویسی Nix برای توصیف محیط های فضای کاری. Nix یک زبان برنامه نویسی کاربردی است. ویژگی‌ها و کتابخانه‌های بسته‌ای که می‌توانید در فایل dev.nix تعریف کنید، از نحو مجموعه ویژگی‌های Nix پیروی می‌کنند.

  • مدیر بسته Nix برای مدیریت ابزارهای سیستم موجود در فضای کاری شما. این شبیه به مدیران بسته های خاص سیستم عامل مانند APT ( apt و apt-get )، Homebrew ( brew ) و dpkg است.

از آنجایی که محیط‌های Nix قابل تکرار و بیان هستند، در چارچوب Firebase Studio ، این بدان معناست که می‌توانید فایل پیکربندی Nix خود را به عنوان بخشی از مخزن Git خود به اشتراک بگذارید تا مطمئن شوید همه افرادی که روی پروژه شما کار می‌کنند پیکربندی محیطی یکسانی دارند.

یک مثال اساسی

مثال زیر یک پیکربندی محیطی اولیه را نشان می دهد که پیش نمایش ها را فعال می کند:

{ pkgs, ... }: {

  # Which nixpkgs channel to use.
  channel = "stable-23.11"; # or "unstable"

  # Use https://search.nixos.org/packages to find packages
  packages = [
    pkgs.nodejs_20
  ];

  # Sets environment variables in the workspace
  env = {
    SOME_ENV_VAR = "hello";
  };

  # Search for the extensions you want on https://open-vsx.org/ and use "publisher.id"
  idx.extensions = [
    "angular.ng-template"
  ];

  # Enable previews and customize configuration
  idx.previews = {
    enable = true;
    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";
      };
    };
  };
}

ابزارهای سیستم را اضافه کنید

برای افزودن ابزارهای سیستم به فضای کاری خود، مانند کامپایلرها یا برنامه‌های CLI برای سرویس‌های ابری، شناسه بسته منحصربه‌فرد را در رجیستری بسته Nix بیابید و آن را به شیء packages فایل dev.nix خود، با پیشوند «pkgs» اضافه کنید:

{ pkgs, ... }: {
  # Which nixpkgs channel to use.
  channel = "stable-23.11"; # or "unstable"

  # Use https://search.nixos.org/packages to find packages
  packages = [
    pkgs.nodejs_20
  ];
  ...
}

این با نحوه نصب بسته‌های سیستمی با استفاده از مدیران بسته خاص سیستم عامل مانند APT ( apt و apt-get )، Homebrew ( brew ) و dpkg متفاوت است. تشریح دقیق بسته‌های سیستمی مورد نیاز به این معنی است که فضاهای کاری Firebase Studio آسان‌تر برای اشتراک‌گذاری و بازتولید هستند.

از باینری های گره محلی استفاده کنید

درست مانند ماشین محلی شما، باینری های مربوط به بسته های گره نصب شده به صورت محلی (به عنوان مثال، بسته های تعریف شده در package.json شما) را می توان با فراخوانی آنها با دستور npx در یک پنل ترمینال اجرا کرد.

به عنوان یک راحتی بیشتر، اگر در دایرکتوری با پوشه node_modules هستید (مانند دایرکتوری ریشه یک پروژه وب)، باینری های نصب شده محلی می توانند مستقیماً و بدون پیشوند npx فراخوانی شوند.

اجزای gcloud را اضافه کنید

یک پیکربندی پیش‌فرض از gcloud CLI برای Google Cloud برای همه فضاهای کاری Firebase Studio در دسترس است.

اگر به اجزای اضافی نیاز دارید، می توانید آنها را به فایل dev.nix خود اضافه کنید:

{ pkgs }: {
  packages = [
    ...
    (pkgs.google-cloud-sdk.withExtraComponents [
      pkgs.google-cloud-sdk.components.cloud-datastore-emulator
    ])
    ...
  ];
}

افزودن پسوندهای IDE

شما می توانید برنامه های افزودنی را در Firebase Studio با استفاده از رجیستری افزونه OpenVSX به دو روش نصب کنید:

  • از پنل Extensions در Firebase Studio برای کشف و نصب افزونه ها استفاده کنید. این رویکرد برای برنامه های افزودنی خاص کاربر مانند:

    • تم های رنگی سفارشی
    • شبیه سازی ویرایشگر، مانند VSCodeVim
  • پسوندها را به فایل dev.nix خود اضافه کنید . هنگامی که پیکربندی فضای کاری خود را به اشتراک می گذارید، این افزونه ها به طور خودکار نصب می شوند. این رویکرد برای برنامه های افزودنی خاص پروژه مانند:

    • پسوندهای زبان برنامه نویسی، از جمله اشکال زداهای خاص زبان
    • برنامه های افزودنی رسمی برای سرویس های ابری مورد استفاده در پروژه شما
    • فرمت کننده های کد

برای رویکرد دوم، می‌توانید پسوندهای IDE را با یافتن شناسه پسوند کاملاً واجد شرایط (از فرم <publisher>.<id> ) و افزودن آن به شی idx.extensions در فایل dev.nix خود قرار دهید:

{ pkgs, ... }: {
  ...
  # Search for the extensions you want on https://open-vsx.org/ and use the format
  # "<publisher>.<id>"
  idx.extensions = [
    "angular.ng-template"
  ];
  ...
}

خدمات مشترک را اضافه کنید

Firebase Studio همچنین تنظیمات و پیکربندی ساده‌شده‌ای را برای سرویس‌های رایجی که ممکن است در طول توسعه به آن نیاز داشته باشید، ارائه می‌دهد، از جمله:

  • ظروف
    • داکر ( services.docker.* )
  • پیام رسانی
    • شبیه ساز Pub/Sub ( services.pubsub.* )
  • پایگاه های داده
    • MySQL ( services.mysql.* )
    • Postgres ( services.postgres.* )
    • Redis ( services.redis.* )
    • آچار ( services.spanner.* )

برای جزئیات فعال کردن این سرویس‌ها در فضای کاری خود، به بخش‌های services.* از مرجع dev.nix مراجعه کنید.

سفارشی کردن پیش نمایش ها

برای جزئیات در مورد نحوه سفارشی کردن پیش‌نمایش‌های برنامه، به پیش‌نمایش برنامه خود مراجعه کنید.

نماد فضای کاری خود را تنظیم کنید

می‌توانید با قرار دادن یک فایل PNG به نام icon.png در داخل فهرست .idx در همان سطح فایل dev.nix ، یک نماد سفارشی برای فضای کاری خود انتخاب کنید. سپس Firebase Studio از این نماد برای نشان دادن فضای کاری شما در داشبورد استفاده می کند.

از آنجایی که این فایل را می توان در کنترل منبع (مانند Git) بررسی کرد، این یک راه خوب برای کمک به همه کسانی است که روی پروژه شما کار می کنند، هنگام استفاده از Firebase Studio همان نماد پروژه شما را ببینند. و از آنجایی که فایل می‌تواند در شاخه‌های Git متفاوت باشد، می‌توانید از این نماد برای تمایز بصری بین فضای کاری برنامه‌های بتا و تولیدی و برای اهداف دیگر استفاده کنید.

سفارشی سازی های خود را به یک الگو تبدیل کنید

برای تبدیل پیکربندی محیط خود به یک "محیط آغازین" که هر کسی می تواند از آن برای ساخت پروژه های جدید استفاده کند، به اسناد ایجاد قالب های سفارشی مراجعه کنید.

تمام گزینه های سفارشی سازی را کاوش کنید

مرجع dev.nix را برای شرح مفصلی از طرح پیکربندی محیط بررسی کنید.

فایل های خود را دانلود کنید

برای دانلود فایل های خود به صورت فایل فشرده:

  • روی هر دایرکتوری در پنجره Explorer کلیک راست کرده و Zip and Download را انتخاب کنید.

برای دانلود همه چیز در فهرست پروژه خود:

  1. File > Open Folder را انتخاب کنید.

  2. پوشه پیش فرض /home/user بپذیرید.

  3. پس از بارگیری فایل ها، روی پوشه کاری خود کلیک راست کرده و Zip and Download را انتخاب کنید. اگر از App Prototyping agent استفاده می کنید، دایرکتوری کاری شما studio خواهد بود. اگر از یک الگو یا پروژه آپلود شده استفاده می کنید، این نام پروژه شما خواهد بود.

  4. هنگامی که از شما برای بازسازی محیط خواسته شد، روی لغو کلیک کنید.

  5. پس از اتمام دانلود، دایرکتوری کاری خود را از منوی File دوباره باز کنید تا به فضای کاری خود برگردید.

مراحل بعدی