Inizia a utilizzare il progetto IDX

Continua a leggere per conoscere le nozioni di base necessarie per iniziare a utilizzare Project IDX.

Prima di iniziare

Prima di iniziare, potrebbe essere necessario abilitare i cookie di terze parti per i tuoi del browser. Il progetto IDX richiede cookie di terze parti nella maggior parte dei browser per autenticare le aree di lavoro.

Chrome
  1. Apri Impostazioni.
  2. Apri la scheda Privacy e sicurezza.
  3. Verifica che l'opzione Accetta tutti i cookie sia attiva.
  4. Apri idx.google.com.
  5. Fai clic sull'icona di visibilità nella barra degli indirizzi visibility_off per aprire il Riquadro Protezione antitracciamento. Attiva Impostazione dei cookie di terze parti per consentire temporaneamente l'accesso cookie di terze parti. In questo modo vengono abilitati i cookie su IDX per 90 giorni.
Safari
  1. Apri Safari > Impostazioni....
  2. Disattiva le seguenti impostazioni:
    • Avanzate > Blocca tutti i cookie
    • Privacy > Impedire il monitoraggio tra siti
  3. Apri idx.google.com.
Firefox

Non è necessario abilitare i cookie di terze parti per Firefox. Vai a idx.google.com.

Opera
  1. Apri idx.google.com.
  2. Apri il menu e fai clic su Impostazioni.
  3. Vai alla scheda Privacy e Sicurezza ed espandi Cookie di terze parti.
  4. Seleziona Blocca cookie di terze parti in modalità di navigazione in incognito oppure Consenti cookie di terze parti.
  5. Apri idx.google.com.
Arco
  1. Vai ad arc://settings.
  2. Vai alla sezione Privacy e sicurezza ed espandi Cookie di terze parti.
  3. Seleziona Blocca cookie di terze parti in modalità di navigazione in incognito oppure Consenti cookie di terze parti.
  4. Apri idx.google.com.
Brave

Non è necessario abilitare i cookie di terze parti per Brave. Vai a idx.google.com.

Crea un'area di lavoro

Un'area di lavoro in IDX è un ambiente di sviluppo che contiene tutto per sviluppare la tua applicazione. Contiene il tuo codice, un editor di codice (con plug-in pertinenti al tuo progetto) e toolchain che supportano le app sviluppo del prodotto. È simile a creando un nuovo progetto nell'ambiente di sviluppo desktop locale, ad eccezione di avere un intero computer e sistema operativo preconfigurati e dedicati esclusivamente al creando un'applicazione.

Le aree di lavoro di Project IDX sono ottimizzate per contenere un codebase alla volta, in modo da poter mantenere gli ambienti e le dipendenze a livello di sistema isolati tra loro.

Se stai creando una nuova app, utilizza i modelli di aree di lavoro gestite in IDX per iniziare rapidamente. In alternativa, puoi importare l'applicazione esistente in IDX.

Per creare una nuova area di lavoro:

  • Uno screenshot del flusso di onboarding di IDX che accetta i termini
  • Uno screenshot del flusso di onboarding di IDX che abilita le funzionalità di IA
  • Uno screenshot del flusso di onboarding di IDX che mostra una nota su IA e privacy
  • Uno screenshot della dashboard IDX che mostra i modelli in primo piano e l’importazione da GitHub
  1. Apri Project IDX

  2. La prima volta che apri IDX, ti viene chiesto di leggere e accettare i Termini di servizio relativi ai prodotti Google, all'AI generativa e all'SDK per Android. Puoi anche attivare la ricezione di comunicazioni relative ad aggiornamenti dei prodotti e annunci o studi sugli utenti per migliorare il nostro prodotto. Seleziona le opzioni che che abbia senso per te. Fai clic sui link forniti per leggere i Termini di servizio, quindi seleziona l'opzione per accettarli e fai clic su Continua. Quindi, puoi decidere Abilita le funzionalità di IA dal tuo primo utilizzo di IDX o lasciale disattivate entro il giorno facendo clic su Non adesso (puoi sempre attivarle in un secondo momento). Se le attivi in questa schermata, leggi le su IA e privacy e fai clic su Continua per mantenere le impostazioni Torna indietro per disattivare le funzionalità di IA.

  3. Seleziona il tipo di spazio di lavoro che vuoi creare:

    • Modelli: crea un'area di lavoro precaricata con i file di base e i pacchetti di cui potresti aver bisogno. Seleziona uno dei modelli in primo piano o fai clic Visualizza tutti i modelli per un elenco completo di framework, API e API disponibili e lingue diverse. Puoi anche trovare il modello Area di lavoro vuota in nella libreria dei modelli.
    • Repository Git:seleziona Importa un repository per clonare un repository nell'area di lavoro.

Modelli

La pagina della raccolta di modelli IDX che mostra i modelli web disponibili

  1. Sfoglia i modelli per tipo di applicazione o utilizza casella di ricerca in alto a destra per filtrare l'intera libreria di modelli per parola chiave. L'area di lavoro vuota è disponibile nella categoria Varie.

  2. Inserisci un nome per l'area di lavoro e imposta eventuali opzioni aggiuntive.

  3. Fai clic su Crea. IDX crea una nuova area di lavoro basata su selezioni.

Poiché aggiungiamo sempre nuovi modelli, controlla di nuovo oppure dicci cosa vuoi vedere.

Importazione del repository Git

  1. Inserisci l'URL del repository. Il repository può essere ospitato su GitHub, GitLab o Bitbucket.

  2. Fai clic su Crea. IDX crea una nuova area di lavoro basata su selezioni.

  3. Per i repository privati, ti verrà chiesto di autenticarti con il rispettivo provider.

    • Per GitHub, segui le istruzioni per copiare un token di accesso
    • Per GitLab, puoi utilizzare la password del tuo account o creare un token dell'account personale
    • Per Bitbucket, usa il tuo nome utente (non l'email) e una password per l'app per l'autenticazione.
  4. Esegui npm install (o flutter pub get) nel terminale IDX dopo per importare il progetto. Per impostazione predefinita, IDX non installa npm quando importi un progetto.

Configura la tua area di lavoro

IDX utilizza Nix per definire la configurazione dell'ambiente per ogni area di lavoro. Nix è un servizio gestore di pacchetti funzionale e assegna identificatori univoci a ciascuna dipendenza, il che significa che il tuo ambiente contengono più versioni della stessa dipendenza, senza problemi. È inoltre possibile riproducibili e dichiarativi. Nel contesto di IDX, questo significa che condividi il file di configurazione Nix tra le aree di lavoro per caricare lo stesso la configurazione dell'ambiente di gestione. Scopri di più su Nix + IDX.

Crea o modifica il file .idx/dev.nix

La configurazione dell'ambiente è definita nel file .idx/dev.nix nel codice repository Git. Questo file consente di specificare i pacchetti installati, l'ambiente ed estensioni Code OSS.

Guarda il file .idx/dev.nix di esempio che segue per un ambiente dell'area di lavoro di base che abilita le anteprime dell'app in 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";
      };
    };
  };
}

Applica nuova configurazione

Ogni volta che aggiungi o aggiorni il file di configurazione dev.nix, IDX mostra un prompt nell'angolo in basso a destra per Ricreare l'ambiente. Il tempo necessario per ricreare l'ambiente dipende dal numero di pacchetti le tue esigenze di configurazione.

Errori di build dell'ambiente di debug

Poiché i file di configurazione sono codice leggibile dalle macchine, possono presentare errori. In questo caso, la creazione e l'avvio dell'ambiente potrebbero non riuscire. IDX mostra un'opzione per avviare un ambiente di ripristino. Quest'area di lavoro non includere una qualsiasi delle configurazioni che hai definito ed esegue solo Codice OSS. In questo modo avrai la possibilità di correggere gli errori in dev.nix di configurazione del deployment e ricreare l'ambiente.

IDX alla fine mostrerà errori di build dell'ambiente. Per il momento, dover risolvere autonomamente i problemi.

Passaggi successivi