As traduções são geradas por tradução automática. Em caso de conflito entre o conteúdo da tradução e da versão original em inglês, a versão em inglês prevalecerá.

# Como criar um aplicativo cliente usando o cliente Amplify
<a name="building-a-client-app"></a>

Você pode se conectar à sua API AWS AppSync GraphQL usando qualquer cliente GraphQL, mas recomendamos fortemente o cliente Amplify v6. O Amplify não apenas gera automaticamente um cliente fortemente tipado para SDKs sua API do GraphQL, mas também oferece suporte para dados em tempo real e recursos aprimorados de consulta do GraphQL em aplicativos clientes. Para aplicativos web, o Amplify pode produzir um JavaScript cliente. Para aqueles que visam ambientes multiplataforma ou móveis, o Amplify é compatível com Android, iOS e React Native. Para se aprofundar na geração de código do cliente para essas plataformas, consulte a [documentação](https://docs.amplify.aws/cli/graphql/client-code-generation/) do Amplify. Aqui está um guia para começar sua jornada com um aplicativo JavaScript React: 

**nota**  
Você precisa instalar e configurar o [npm](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm) e a [Amazon CLI](https://aws.amazon.com/cli/) antes de começar. Se estiver usando o cliente Amplify v6, [siga este guia](https://docs.amplify.aws/react/build-a-backend/graphqlapi/connect-to-api/#configure-the-default-authorization-mode).

Para começar:

1. Em sua máquina local, navegue até o diretório do projeto. Instale a biblioteca do Amplify usando o comando abaixo:

   ```
   npm install aws-amplify
   ```

1. Baixe o arquivo de configuração e coloque-o na pasta do projeto. Seu arquivo de configuração normalmente conterá uma variável `config` com algumas configurações (endpoint, região, modo de autorização etc.) definidas. Por exemplo, poderia ser assim:

   ```
   const config =  {
       API: {
           GraphQL: {
             endpoint: 'https://abcdefghijklmnopqrstuvwxyz.appsync-api.us-west-2.amazonaws.com/graphql',
             region: 'us-west-2',
             defaultAuthMode: 'apiKey',
             apiKey: ''
           }
       }
   };
   
   export default config;
   ```

1. No seu código, importe a biblioteca do Amplify e sua configuração para configurar o Amplify:

   ```
   import { Amplify } from 'aws-amplify';
   import config from './aws-exports.js';
   
   Amplify.configure(config);
   ```

   Como alternativa, use o snippet na configuração da sua API para configurar o Amplify diretamente:

   ```
   import { Amplify } from 'aws-amplify';
   
   Amplify.configure({
     API: {
       GraphQL: {
         endpoint: 'https://abcdefghijklmnopqrstuvwxyz.appsync-api.us-west-2.amazonaws.com/graphql',
         region: 'us-west-2',
         defaultAuthMode: 'apiKey',
         apiKey: ''
       }
     }
   });
   ```

1. Ao usar o conjunto de ferramentas do Amplify, você tem a opção de gerar operações automaticamente com base em seu esquema, o que poupa o esforço de criação manual de scripts. No diretório raiz da sua aplicação, use o seguinte comando da CLI:

   ```
   npx @aws-amplify/cli codegen add --apiId <id goes here> --region <region goes here>
   ```

   Isso baixará o esquema da sua API e, por padrão, gerará o código auxiliar do cliente na pasta `src/graphql`. Depois de cada implantação da API, você pode executar novamente o comando a seguir para gerar instruções e tipos atualizados do GraphQL:

   ```
   npx @aws-amplify/cli codegen
   ```

1. Agora você pode gerar modelos para Android, Swift, Flutter e. JavaScript DataStore Use o comando a seguir para baixar seu esquema:

   ```
   aws appsync get-introspection-schema --api-id <id goes here> --region <region goes here> --format SDL schema.graphql
   ```

   Depois execute o comando a seguir do diretório raiz da aplicação:

   ```
   npx @aws-amplify/cli codegen models \
   --model-schema schema.graphql \
   --target [android|ios|flutter|javascript|typescript] \
   --output-dir ./
   ```