Exercise 9: Connect meetup group queries

Once you manage to integrate mutations, queries will be simple, as the integration is similar.

Task

Pull the list of all meetups and single meetup details from your GraphQL endpoint.

Hints

• Amplify and AppSync generated following queries for your MeetupGroup model:

  query GetMeetupGroup($id: ID!)
  query ListMeetupGroups($filter: ModelMeetupGroupFilterInput, $limit: Int, $nextToken: String)
  query GetEvent($id: ID!)
  query ListEvents($filter: ModelEventFilterInput, $limit: Int, $nextToken: String)
  query GetAttendee($id: ID!)
  query ListAttendees($filter: ModelAttendeeFilterInput, $limit: Int, $nextToken: String)
  

  Note the pagination, it's included out-of-the-box!

• You can see the details for all queries in AWS Web Console. Navigate to AppSync (here's a direct link: link), select your AppSync project (it should be named meetup or something similar) and select "Schema" from the menu on the right.
• You can also see the details for all queries in a local GraphQL mock, see the exercise 7.
• You can import queries to your React code using the following line:

  import { listMeetupGroups } from '../graphql/queries'
  

• You will invoke query in your pages/meetups.js file.
• See the documentation for more examples: https://aws-amplify.github.io/docs/js/api#simple-query.