Criar Seu Primeiro Aplicativo Automaticamente create-first-app
A plataforma transforma seu site em um aplicativo totalmente funcional. Ele propõe ações, grava código do manipulador e testa, cria widgets EDS e envia os arquivos gerados para dois repositórios GitHub que você possui.
Aguarde aproximadamente 15 minutos para a geração. No final deste tutorial, você terá um aplicativo implantado que poderá testar em uma plataforma LLM compatível, como o ChatGPT.
Jornada: Confirme os requisitos → crie dois repositórios → crie o aplicativo → revise as ações geradas → implante em Preparo → teste o plug-in → conecte os sistemas de produção.
Antes de começar
Conclua todos os requisitos de Aplicativos LLM antes de iniciar este tutorial.
Este tutorial cria um aplicativo LLM para o Frescopa Coffee.
Criar dois repositórios vazios
A plataforma precisa de dois repositórios vazios. Crie ambos na mesma conta ou organização GitHub:
- Repositório de manipulador — armazena manipuladores de ação e testes. Por exemplo,
my-brand-llm-app. - Repositório EDS — armazena blocos de widget e estilos gerados. Por exemplo,
my-brand-llm-app-eds.
Vá para github.com/new para cada repositório.
Não inicialize o repositório com um arquivo README, .gitignore ou licença. A plataforma prepara a estrutura de projeto necessária.
Iniciar o aplicativo
-
Abra os Aplicativos Adobe LLM e selecione Criar aplicativo.
-
Insira o Nome do Aplicativo LLM e uma descrição opcional.
-
Selecione a região do Analytics.
note important IMPORTANT A região de análise não pode ser alterada após a criação do aplicativo. -
Em Criar Meu Aplicativo, selecione Criar meu aplicativo automaticamente.
-
Em seu site, digite a URL do site, incluindo o protocolo
https://. A plataforma analisa esse site para determinar ações úteis e resultados de amostra representativos.
Conceder acesso aos repositórios a LLM Apps
O aplicativo Adobe LLM Apps GitHub dá a LLM Apps acesso aos repositórios selecionados.
Organização conectada
Se o aplicativo GitHub do Adobe LLM Apps já tiver sido instalado antes da criação dos repositórios:
- Selecione a organização conectada.
- Selecione Gerenciar repositórios no GitHub.
- Adicione os dois repositórios à instalação existente do Aplicativo GitHub.
- Retorne a LLM Apps e atualize as listas de repositório.
Somente primeira conexão
Se a organização não aparecer na caixa de diálogo:
- Selecione Conectar a uma organização do GitHub.
- Instalar o Aplicativo GitHub de Aplicativos Adobe LLM.
- Escolha Selecionar apenas repositórios e selecione os dois repositórios.
- Retorne à caixa de diálogo Criar aplicativo LLM.
Se não conseguir instalar ou atualizar o Aplicativo GitHub, peça a um administrador da organização.
Selecionar os repositórios
-
Em Repositório Modelo, selecione a organização e o repositório de manipuladores vazio.
-
Em Repositório EDS, selecione a organização e o repositório EDS vazio.
-
Em Termos e Condições, marque Aceito os Termos do Adobe Developer.
-
Selecione Criar aplicativo.
Conclua a configuração do EDS
Quando o repositório EDS selecionado está vazio, o LLM Apps o inicializa com o padrão AEM. A caixa de diálogo solicita que você instale a Sincronização de código do AEM antes de tentar criar o aplicativo novamente.
-
Na mensagem abaixo do repositório EDS, selecione Instalar sincronização de código do AEM.
-
Em GitHub, instale a Sincronização de Código AEM e conceda a ela acesso ao repositório EDS.
Na página de confirmação Sincronização de Código AEM registrada, em Usuários do site, selecione + Adicionar usuário e adicione o endereço de email que você usa para entrar no LLM Apps com a função de administrador. Em seguida, selecione Concluir configuração na parte inferior da página.
-
Retorne à caixa de diálogo Criar aplicativo LLM.
Você deve ser um administrador do site de EDS. Se a caixa de diálogo relatar que você não é um administrador:
-
Selecione Abrir Administrador Do AEM Live.
-
Adicione a si mesmo como administrador para o site EDS clicando no botão + Adicionar Usuário(s).
-
Retorne a LLM Apps, atualize o repositório EDS e selecione Criar Aplicativo novamente.
Depois que as verificações do repositório e do administrador forem bem-sucedidas, LLM Apps cria o aplicativo e começa a gerar ações.
Aguardar a geração de Ações
Vá para a página Ações, à esquerda. A página Ações mostra Descobrindo ações para sua experiência de conversação enquanto o agente analisa o site e gera o aplicativo. A geração geralmente leva aproximadamente 15 minutos. Você pode sair desta página e retornar mais tarde.
Durante a geração, LLM Apps:
- Analisa o site e identifica intenções úteis do cliente.
- Cria metadados de ação, incluindo descrições e parâmetros de entrada.
- Gera um manipulador e testa para cada ação no repositório do manipulador.
- Gera um dispositivo EDS para cada ação no repositório EDS.
- Prepara as ações para sua revisão.
Os manipuladores gerados usam inicialmente dados de amostra derivados do site. Eles demonstram a experiência completa, mas não se conectam aos sistemas de produção.
Revisar as ações geradas
Quando a geração termina, a página Ações exibe as ações geradas e as visualizações do widget. Cada ação tem uma ação gerada por IA, precisa da medalha review.
Para cada ação:
- Selecione Revisão.
- Revise o nome, a descrição, os parâmetros, as anotações, o manipulador gerado e o dispositivo.
- Selecione Marcar como revisado. Isso mescla as solicitações de pull geradas.
- Retorne à página Ações e repita as ações restantes.
Quando todas as ações forem revisadas, selecione Ir para a página do aplicativo.
Implantar o aplicativo
- Retorne à página Detalhes do aplicativo.
- Selecione Implantar.
- Selecione Preparo como o ambiente de destino.
- Selecione Implantar.
Aguarde enquanto LLM Apps prepara, compila e publica o aplicativo.
Após a implantação, a seção Testar o aplicativo exibe a URL do servidor MCP de preparo. Selecione Copiar URL.
Teste em ChatGPT
Siga Testar no ChatGPT para criar um plug-in usando a URL do servidor MCP de preparo.
Faça uma pergunta que corresponda a uma das ações geradas. Verifique se:
- ChatGPT seleciona a ação esperada.
- O widget é renderizado e contém os dados de amostra esperados.
- Os controles de widget produzem o comportamento de acompanhamento esperado.
- A resposta em texto resume com precisão o resultado.
Agora você tem um aplicativo completo e funcional.
Prepare o aplicativo para produção
O aplicativo gerado usa dados de amostra. Antes de usá-lo com os clientes:
- Conecte seus sistemas — personalize cada manipulador gerado para substituir dados de exemplo por chamadas para suas APIs ou fontes de dados.
- Proteger credenciais — armazene URLs de API e credenciais na configuração de tempo de execução gerenciada, nunca no código-fonte ou no widget JavaScript.
- Validar dados — valide argumentos de ação e respostas da API, adicione tempos limite de solicitação e retorne mensagens de erro seguras.
- Atualizar os widgets — mantenha cada widget alinhado com o
structuredContentdo seu manipulador e, em seguida, aplique seus requisitos de identidade visual e acessibilidade. Consulte Personalizar um widget gerado. - Testar os manipuladores — cobre entrada válida, entrada inválida, resultados vazios, falhas de API e a forma de dados esperada pelo widget.
- Verificar no Estágio — reimplante e teste cada ação por meio do plug-in ChatGPT.
- Implantar para produção — após o êxito no teste de preparo, implante para produção e crie ou atualize o plug-in com a URL do servidor MCP de produção.
Para adicionar um recurso que a plataforma não criou, consulte Criar uma ação do zero.