Começar a usar o projeto IDX

Continue lendo para saber as noções básicas necessárias para começar a usar o Project IDX.

Antes de começar

Antes de começar, talvez seja necessário ativar cookies de terceiros nos seus navegador. O Project IDX exige cookies de terceiros na maioria dos navegadores para autenticar espaços de trabalho.

Chrome
  1. Abra Configurações.
  2. Abra a guia Privacidade e segurança.
  3. Verifique se a opção Permitir todos os cookies está ativada.
  4. Acesse idx.google.com.
  5. Clique no ícone de visibilidade na barra de endereço visibility_off para abrir a Painel Proteção antirrastreamento. Ative o Configuração Cookies de terceiros para permitir temporariamente cookies de terceiros. Isso ativa cookies no IDX por 90 dias.
Safari
  1. Abra o Safari > Configurações....
  2. Desative as seguintes configurações:
    • Avançado > Bloquear todos os cookies
    • Privacidade > Evitar o rastreamento entre sites
  3. Acesse idx.google.com.
Firefox

Não é necessário ativar cookies de terceiros para o Firefox. Acesse idx.google.com.
Opera
  1. Acesse idx.google.com.
  2. Abra o menu e clique em Configurações.
  3. Acesse a página Privacidade e Segurança e expanda a seção Opção Cookies de terceiros.
  4. Selecione Bloquear cookies de terceiros no modo de navegação anônima ou Permitir cookies de terceiros.
  5. Acesse idx.google.com.
Arco
  1. Acesse arc://settings.
  2. Vá para a seção Privacidade e segurança e expanda o Opção Cookies de terceiros.
  3. Selecione Bloquear cookies de terceiros no modo de navegação anônima ou Permitir cookies de terceiros.
  4. Acesse idx.google.com.
Corajosa

Não é necessário ativar cookies de terceiros para o Brave. Acesse idx.google.com.

Criar um espaço de trabalho

Um espaço de trabalho no IDX é um ambiente de desenvolvimento que contém tudo necessários para desenvolver o aplicativo. Ele contém seu código, um editor de código (com plug-ins relevantes para o projeto) e conjuntos de ferramentas com suporte no desenvolvimento de software. É semelhante a criar um novo projeto em seu ambiente de desenvolvimento de área de trabalho local, exceto você têm um computador completo e um sistema operacional pré-configurado e dedicado exclusivamente criar um aplicativo.

Os espaços de trabalho do Project IDX são otimizados para conter uma base de código por vez, para manter os ambientes e as dependências no nível do sistema de diferentes isolados uns dos outros.

Se você estiver criando um novo app, use modelos de espaços de trabalho gerenciados no IDX para começar logo. Como alternativa, é possível importar seu aplicativo bases de código em IDX.

Para criar um novo espaço de trabalho, siga estas etapas:

  • Uma captura de tela do fluxo de integração do IDX aceitando os termos
  • Uma captura de tela do fluxo de integração do IDX ativando recursos de IA
  • Uma captura de tela do fluxo de integração do IDX mostrando uma observação sobre IA e privacidade
  • Uma captura de tela do painel do IDX mostrando modelos em destaque e importação do GitHub

  1. Abra o Project IDX.

  2. Na primeira vez que você abrir o IDX, vai receber uma solicitação para ler e aceitar os Termos de Serviço dos produtos do Google, da IA generativa e do SDK do Android. Você também pode optar por receber comunicados sobre atualizações de produtos e anúncios ou estudos com usuários para melhorar nosso produto. Selecione as opções que que faça sentido para você. Clique nos links fornecidos para ler os Termos de Serviço e selecione a opção para aceitá-los e clique em Continuar. Em seguida, você pode decidir Ative os recursos de IA no primeiro uso do IDX ou deixe-os desativados clicando em Agora não (é possível ative-as mais tarde). Se você as ativar nesta tela, leia a observação sobre IA e privacidade e clique em Continuar para manter suas configurações ou Volte para desativar os recursos de IA.

  3. Selecione o tipo de espaço de trabalho que você quer criar:

    • Modelos:crie um espaço de trabalho pré-carregado com os arquivos básicos e os pacotes que você pode precisar. Selecione um dos modelos em destaque ou clique Confira todos os modelos para uma lista completa de frameworks, APIs e e idiomas. Você também encontra o modelo Espaço de trabalho em branco em a biblioteca de modelos.
    • Git Repository:selecione Import a repo para clonar um repositório no seu espaço de trabalho.

Modelos

A página da biblioteca de modelos do IDX mostrando os modelos da Web disponíveis

  1. Procure modelos por tipo de aplicativo ou use o caixa de pesquisa no canto superior direito para filtrar toda a biblioteca de modelos palavra-chave. O espaço de trabalho em branco modelo está disponível na categoria Diversos.

  2. Digite um nome para o espaço de trabalho e defina outras opções.

  3. Clique em Criar. O IDX cria um novo espaço de trabalho com base seleções

Estamos sempre adicionando novos modelos, então não deixe de conferir ou nos diga o que você quer ver.

Importação de repositório Git

  1. Insira o URL do repo. O repositório pode ser hospedado no GitHub, GitLab ou Bitbucket.

  2. Clique em Criar. O IDX cria um novo espaço de trabalho com base seleções

  3. Nos repositórios privados, a autenticação será solicitada no respectivo provedor.

    • Para o GitHub, siga as instruções para copiar um token de acesso
    • No GitLab, você pode usar a senha da sua conta ou criar um token de conta pessoal.
    • No caso do Bitbucket, use seu nome de usuário (não o e-mail) e uma senha de app para fazer a autenticação.

  4. Execute npm install (ou flutter pub get) no terminal IDX após ao importar seu projeto. Por padrão, o IDX não instala o npm dependências ao importar um projeto.

Configurar seu espaço de trabalho

O IDX usa o Nix para definir a configuração do ambiente para cada espaço de trabalho. Nix é puramente gerenciador de pacotes funcional e atribui identificadores exclusivos a cada dependência, o que significa que seu ambiente pode contêm várias versões da mesma dependência de forma integrada. Também é reproduzíveis e declarativas. No contexto do IDX, isso significa que é possível compartilhe seu arquivo de configuração Nix em vários espaços de trabalho para carregar o mesmo na configuração do ambiente de execução. Saiba mais sobre Nix + IDX.

Crie ou edite o arquivo .idx/dev.nix

A configuração do ambiente é definida no arquivo .idx/dev.nix no código. repositório de dados. Esse arquivo permite especificar pacotes instalados, variáveis e extensões Code OSS.

Confira o arquivo .idx/dev.nix de exemplo a seguir para um ambiente básico de espaço de trabalho que ativa visualizações de apps no 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";
      };
    };
  };
}

Aplicar nova configuração

Sempre que você adicionar ou atualizar o arquivo de configuração dev.nix, o IDX mostra um comando no canto inferior direito para Recriar o ambiente. O tempo necessário para recriar o ambiente depende do número de pacotes suas necessidades de configuração.

Depurar falhas de build do ambiente

Como os arquivos de configuração são códigos legíveis por máquina, eles podem conter erros. Se isso acontecer, pode ocorrer falha na criação e inicialização do ambiente. IDX exibe uma opção para iniciar um ambiente de recuperação. Este espaço de trabalho não incluir qualquer uma das configurações definidas e apenas executar configurações básicas Código OSS. Assim, você tem a chance de corrigir erros no dev.nix de configuração do Terraform e recriar o ambiente.

O IDX vai exibir erros de build do ambiente. Por enquanto, resolver problemas por conta própria.

Próximas etapas