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

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

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

برای شرح کامل امکانات موجود، به مرجع dev.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 برای 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 به دو روش نصب کنید:

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

    • تم‌های رنگی سفارشی
    • شبیه‌ساز ویرایشگر، مانند VSCodeVim

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

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

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

{ 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.* )
    • پستگرس ( services.postgres.* )
    • ردیس ( services.redis.* )
    • آچار ( services.spanner.* )

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

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

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

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

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

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

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

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

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

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

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

برای دانلود فایل‌ها به صورت فایل زیپ:

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

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

  1. فایل > باز کردن پوشه را انتخاب کنید.

  2. دایرکتوری پیش‌فرض /home/user ‎ را بپذیرید.

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

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

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

مراحل بعدی