Mulai menggunakan Project IDX

Baca terus untuk mengetahui dasar-dasar yang diperlukan untuk mulai menggunakan Project IDX.

Sebelum memulai

Sebelum memulai, Anda mungkin perlu mengaktifkan cookie pihak ketiga untuk browser. Project IDX memerlukan cookie pihak ketiga di sebagian besar browser untuk mengautentikasi ruang kerja.

Chrome

1. Buka Setelan.
2. Buka tab Privasi dan Keamanan.
3. Pastikan Izinkan semua cookie diaktifkan.
4. Buka idx.google.com.
5. Klik ikon visibilitas di kolom URL visibility_off untuk membuka Panel Fitur Anti-Pelacakan. Aktifkan Setelan Cookie pihak ketiga untuk mengizinkan sementara waktu cookie pihak ketiga. Tindakan ini akan mengaktifkan cookie di IDX selama 90 hari.

Safari

1. Buka Safari > Setelan....
2. Nonaktifkan setelan berikut:
   • Lanjutan > Memblokir semua cookie
   • Privasi > Mencegah pelacakan lintas situs
3. Buka idx.google.com.

Firefox

Anda tidak perlu mengaktifkan cookie pihak ketiga untuk Firefox. Buka idx.google.com.

Opera

1. Buka idx.google.com.
2. Buka menu dan klik Setelan.
3. Buka halaman Privasi & Keamanan, lalu perluas Opsi Cookie pihak ketiga.
4. Pilih Blokir cookie pihak ketiga dalam mode Samaran atau Izinkan cookie pihak ketiga.
5. Buka idx.google.com.

Busur

1. Buka arc://settings.
2. Buka bagian Privasi dan keamanan, lalu luaskan Opsi Cookie pihak ketiga.
3. Pilih Blokir cookie pihak ketiga dalam mode Samaran atau Izinkan cookie pihak ketiga.
4. Buka idx.google.com.

Brave

Anda tidak perlu mengaktifkan cookie pihak ketiga untuk Brave. Buka idx.google.com.

Membuat ruang kerja

Ruang kerja di IDX adalah lingkungan pengembangan yang berisi semuanya Anda perlu mengembangkan aplikasi. Berisi kode Anda, sebuah editor kode (dengan plugin yang relevan dengan project Anda), dan toolchain yang mendukung aplikasi pengembangan produk. Hal ini mirip dengan membuat project baru di lingkungan pengembangan Desktop lokal, kecuali jika Anda memiliki seluruh komputer dan OS yang telah dikonfigurasi dan didedikasikan secara eksklusif untuk membangun aplikasi.

Ruang kerja Project IDX dioptimalkan untuk menampung satu codebase dalam satu waktu, sehingga Anda dapat menjaga lingkungan dan dependensi tingkat sistem dari aplikasi yang saling terisolasi.

Jika Anda membangun aplikasi baru, gunakan template ruang kerja terkelola di IDX untuk memulai dengan cepat. Atau, Anda dapat mengimpor aplikasi yang ada codebase ke IDX.

Poin Penting: Ada batasan jumlah ruang kerja yang dapat Anda buat. Anda memiliki Profil Developer Google, Anda dapat membuat hingga 5 ruang kerja. Untuk membuat Profil Developer Google secara langsung dari IDX setelah Anda mencapai batas ruang kerja, klik Selesaikan Penyiapan dari notifikasi di dasbor template.

Untuk membuat ruang kerja baru, ikuti langkah-langkah berikut:

• 
• 
• 
• 

1. Buka Project IDX

2. Saat pertama kali membuka IDX, Anda diminta untuk membaca dan menyetujui persyaratan layanan untuk produk Google, AI Generatif, dan Android SDK. Anda juga dapat ikut serta untuk menerima komunikasi tentang pembaruan produk dan pengumuman atau studi pengguna untuk meningkatkan kualitas produk. Pilih opsi yang masuk akal bagi Anda. Klik link yang diberikan untuk membaca persyaratan layanan, lalu pilih opsi untuk menyetujuinya, lalu klik Lanjutkan. Selanjutnya, Anda dapat memutuskan untuk Aktifkan Fitur AI sejak penggunaan pertama IDX Anda, atau tinggalkan dengan mengklik Lain Kali (Anda selalu dapat aktifkan nanti). Jika Anda mengaktifkannya pada layar ini, baca catatan tentang AI dan privasi, lalu klik Lanjutkan untuk menyimpan setelan atau Kembali untuk menonaktifkan fitur AI.

3. Pilih jenis ruang kerja yang ingin dibuat:

   • Template: Buat ruang kerja yang telah dimuat sebelumnya dengan file dasar dan paket yang mungkin Anda perlukan. Pilih salah satu template unggulan atau klik Lihat semua template untuk daftar lengkap framework, API, dan dan bahasa. Anda juga dapat menemukan template Ruang kerja kosong di di library template.
   • Git Repository: Pilih Import a repo untuk meng-clone repositori ke ruang kerja Anda.

Template

1. Jelajahi template menurut jenis aplikasi atau gunakan kotak penelusuran di kanan atas untuk memfilter pustaka template lengkap berdasarkan kata kunci. Ruang kerja kosong template tersedia dalam kategori Lain-Lain.

2. Masukkan nama untuk ruang kerja Anda dan tetapkan opsi tambahan.

3. Klik Buat. IDX membuat ruang kerja baru berdasarkan pilihan.

Kami selalu menambahkan template baru, jadi terus periksa kembali atau beri tahu kami apa yang ingin Anda lihat.

Impor Repositori Git

1. Masukkan URL Repo. Repositori dapat dihosting di GitHub, GitLab, atau Bitbucket.

2. Klik Buat. IDX membuat ruang kerja baru berdasarkan pilihan.

3. Untuk repositori pribadi, Anda akan diminta untuk melakukan autentikasi ke penyedia masing-masing.

   • Untuk GitHub, ikuti petunjuk untuk menyalin token akses
   • Untuk GitLab, Anda dapat menggunakan sandi akun atau membuat token akun pribadi
   • Untuk Bitbucket, gunakan nama pengguna Anda (bukan email) dan sandi aplikasi untuk melakukan autentikasi.

4. Jalankan npm install (atau flutter pub get) di terminal IDX setelah mengimpor project Anda. Secara default, IDX tidak menginstal npm dependensi saat Anda mengimpor project.

Mengonfigurasi ruang kerja Anda

IDX menggunakan Nix untuk menentukan konfigurasi lingkungan untuk setiap ruang kerja. Nix adalah pengelola paket fungsional dan menetapkan ID unik untuk setiap dependensi, yang pada akhirnya berarti lingkungan Anda dapat berisi beberapa versi dependensi yang sama, tanpa hambatan. Ini juga direproduksi dan deklaratif. Dalam konteks BEI, ini berarti Anda dapat bagikan file konfigurasi Nix ke seluruh ruang kerja untuk memuat konfigurasi lingkungan. Pelajari selengkapnya tentang Nix + IDX.

Membuat atau mengedit file .idx/dev.nix

Konfigurasi lingkungan ditentukan di file .idx/dev.nix dalam kode Anda repositori resource. File ini memungkinkan Anda menentukan paket yang diinstal, lingkungan variabel, dan ekstensi Code OSS.

Lihat contoh file .idx/dev.nix berikut untuk lingkungan Workspace dasar yang mengaktifkan pratinjau aplikasi di IDX:

{ pkgs, ... }: {

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

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

  # 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";
      };
    };
  };
}

Terapkan konfigurasi baru

Setiap kali Anda menambahkan atau memperbarui file konfigurasi dev.nix, IDX menampilkan perintah di pojok kanan bawah untuk Rebuild the environment. Waktu yang diperlukan untuk membangun ulang lingkungan bergantung pada jumlah paket kebutuhan konfigurasi Anda.

Men-debug kegagalan build lingkungan

Mengingat bahwa file konfigurasi adalah kode yang dapat dibaca mesin, file dapat mengalami error. Jika hal ini terjadi, lingkungan mungkin gagal dibangun dan tidak dimulai. IDX menampilkan opsi untuk memulai lingkungan Pemulihan. Ruang kerja ini tidak menyertakan semua konfigurasi yang telah Anda tentukan dan menjalankan perintah Membuat kode OSS. Hal ini memberi Anda kesempatan untuk memperbaiki error di dev.nix file konfigurasi dan membangun ulang lingkungan.

IDX pada akhirnya akan menampilkan error build lingkungan. Untuk saat ini, Anda harus memecahkan masalahnya sendiri.

Langkah berikutnya

• Lihat pratinjau aplikasi Anda.

• Bagikan ruang kerja Anda.