Trying out some queries

Open the AWS Console and click into the amplifyiosworkshop-dev API. Now we can start poking around with the API.

Click Queries in the sidebar on the left.

appsync queries

This area is AWS AppSync’s interactive query explorer. We can write queries and mutations here, execute them, and see the results. It’s a great way to test things out to make sure our resolvers are working the way we expect.

Authenticating to AppSync

Before we can issue queries, we’ll need to authenticate (because our AppSync API is configured to authenticate users via the Amazon Cognito User Pool we set up when we configured the authentication for our app.

  1. Click the Login with User Pools button at the top of the query editor.

  2. Look up the value for the ClientId field. You can either use the script below or get the client ID in the console. To use the script, in your terminal, type:

    cd $PROJECT_DIRECTORY
    ../../scripts/get_app_client.sh
    

    Copy the Client ID value returned, for example: Client ID

    Alternatively, you can retrieve the ClientID in the Amazon Cognito console:

    1. Click on the link to open the Cognito console in your Region: Northern America or Europe
    2. Select the User Pool named amplifyiosworkshopxxxxx_userpool_xxxx-dev (the xxx is generated randomly and will vary)
    3. Click App Clients on the left menu, select the client named amplifyxxxx_app_clientWeb and click Show Details to reveal both the App client id and the App client secret. Copy the App client id. The correct app client has (no secret key) as “App client secret”.
      app client id
  3. Go back to the AppSync console, in the Query section Paste the value into the ClientId field

  4. Enter your credentials for the user you created when we added authentication

  5. Click Login

appsync authentication

Trying out some queries

You should now be able to try out the following mutations and queries. Press the orange ‘play’ button to execute queries and mutations.

Add a new Landmark by copy/pasting the following and running the query:

mutation CreateLandmark($input: CreateLandmarkInput!) {
    createLandmark(input: $input) {
        id
    }
}

Open the Query Variables section on the bottom and copy / paste the following data:

{ "input" : 
    {
        "name": "Lake Umbagog",
        "category": "Lakes",
        "city": "Errol",
        "state": "New Hampshire",
        "id": 9999,
        "isFeatured": true,
        "isFavorite": false,
        "park": "Umbagog National Wildlife Refuge",
        "coordinates": {
            "longitude": -71.056816,
            "latitude": 44.747408
        },
        "imageName": "umbagog"
    }  
}

Click the orange Play button () to execute the query.

Get the Landmark we just created by running this query:

query GetLandmark {
    getLandmark(id: 9999) {
        id
        name
        category
        city
        state
        isFeatured
        isFavorite
        park
        coordinates {
            longitude
            latitude
        }
        imageName
    }
}

Click the orange Play button () to execute the query.

List all the landmarks with this query :

query ListLandmarks {
    listLandmarks {
        items {
            id
            name
            category
            city
            state
            isFeatured
            isFavorite
            park
            coordinates {
                longitude
                latitude
            }
            imageName
        }
        nextToken
    }
}

Click the orange Play button () to execute the query.

Finally, delete the landmark we created with this query:

mutation DeleteLandmark {
  deleteLandmark(input: { id: 9999 }) {
    id
    name
    category
    city
    state
    isFeatured
    isFavorite
    park
    coordinates {
      longitude
      latitude
    }
    imageName
  }
}

Click the orange Play button () to execute the query.

As you can see, we’re able to read and write data through GraphQL queries and mutations and AppSync takes care of reading and persisting data (in this case, to DynamoDB).