AWS AppSync is a managed service that enables developers to build and deploy scalable GraphQL APIs quickly. With AppSync, you can create APIs that run on AWS Lambda, AWS DynamoDB, and other AWS services. AppSync also comes with built-in features like offline capabilities, real-time data synchronization, and data transformation.<\/p>\n
In this tutorial, we’ll cover how to deploy a serverless backend using AWS AppSync. We’ll start by discussing the benefits of using AppSync, then go on to explain the concepts of GraphQL, and finally, move on to creating an API with AppSync.<\/p>\n
AWS AppSync offers several benefits that make it an attractive option for developers who want to build and deploy scalable GraphQL APIs. Some of these benefits include:<\/p>\n
With AWS AppSync, you can set up a GraphQL API in just a few clicks. AppSync takes care of the infrastructure, so you can focus on building your GraphQL API.<\/p>\n
AppSync integrates seamlessly with other AWS services like Lambda, DynamoDB, and Elasticsearch. This gives you the flexibility to choose the best combination of services for your API.<\/p>\n
With AppSync, you can enable real-time data synchronization between your API and your client applications. This means that your client applications can receive updates in real-time as data changes.<\/p>\n
AppSync enables offline capabilities for your API, so your users can continue to use your application even when they’re offline.<\/p>\n
GraphQL is a query language for APIs that was developed by Facebook. It enables you to define the shape of the data that your API returns and allows you to retrieve that data in a single request.<\/p>\n
GraphQL follows a single endpoint architecture, which means that all data is fetched using a single API endpoint. This is in contrast to RESTful APIs, which require multiple endpoints to retrieve different types of data.<\/p>\n
GraphQL consists of three main components: queries, mutations, and subscriptions.<\/p>\n
Queries are used to retrieve data from the server. You can think of a query as a GET request in a RESTful API.<\/p>\n
Here’s an example of a GraphQL query:<\/p>\n
query {\n getPosts {\n id,\n title,\n body\n }\n}\n<\/code><\/pre>\nIn this example, we’re retrieving an array of post objects that contain an ID, title, and body.<\/p>\n
2. Mutations<\/h3>\n
Mutations are used to modify data on the server. You can think of a mutation as a POST, PUT, or DELETE request in a RESTful API.<\/p>\n
Here’s an example of a GraphQL mutation:<\/p>\n
mutation {\n createPost(\n title: \"My new post\",\n body: \"This is the body of my new post\"\n ) {\n id,\n title,\n body\n }\n}\n<\/code><\/pre>\nIn this example, we’re creating a new post object with a title and body.<\/p>\n
3. Subscriptions<\/h3>\n
Subscriptions are used to enable real-time data synchronization between the server and the client.<\/p>\n
Here’s an example of a GraphQL subscription:<\/p>\n
subscription {\n onCreatePost {\n id,\n title,\n body\n }\n}\n<\/code><\/pre>\nIn this example, we’re subscribing to new post objects as they’re created.<\/p>\n
Creating an API with AWS AppSync<\/h1>\n
Now that we understand the concepts of GraphQL, we can move on to creating an API with AWS AppSync. In this tutorial, we’ll create a simple API that allows users to create, read, update, and delete posts.<\/p>\n
Step 1: Create an AWS AppSync API<\/h2>\n
The first step in creating an AWS AppSync API is to create a new API. To do this, follow these steps:<\/p>\n
\n- Go to the AWS Management Console and select “AppSync” under “Services.”<\/p>\n<\/li>\n
- \n
Click on “Create API.”<\/p>\n<\/li>\n
- \n
Choose the type of API that you want to create. For this tutorial, select “HTTP.”<\/p>\n<\/li>\n
- \n
Give your API a name and description.<\/p>\n<\/li>\n
- \n
Click on “Create.”<\/p>\n<\/li>\n<\/ol>\n
Step 2: Define your schema<\/h2>\n
The next step is to define your schema. Your schema defines the shape of the data that your API will return.<\/p>\n
To define your schema, follow these steps:<\/p>\n
\n- On the left-hand side of the AppSync console, click on “Schema.”<\/p>\n<\/li>\n
- \n
Click on “Edit schema.”<\/p>\n<\/li>\n
- \n
Add the following code to your schema:<\/p>\n<\/li>\n<\/ol>\n
type Post {\n id: ID!\n title: String!\n body: String!\n}\n\ntype Query {\n getPost(id: ID!): Post\n getPosts: [Post]\n}\n\ntype Mutation {\n createPost(title: String!, body: String!): Post!\n updatePost(id: ID!, title: String, body: String): Post!\n deletePost(id: ID!): ID!\n}\n<\/code><\/pre>\nIn this schema, we have defined a post object that contains an ID, title, and body. We have also defined three operations: getPost, getPosts, and createPost. The getPost operation retrieves a post object by ID, the getPosts operation retrieves an array of post objects, and the createPost operation creates a new post object.<\/p>\n
Step 3: Set up your resolvers<\/h2>\n
Now that our schema is defined, we need to set up our resolvers. Resolvers are responsible for fetching data from our backend data sources.<\/p>\n
To set up your resolvers, follow these steps:<\/p>\n
\n- On the left-hand side of the AppSync console, click on “Data sources.”<\/p>\n<\/li>\n
- \n
Click on “Create data source.”<\/p>\n<\/li>\n
- \n
Choose the type of data source that you want to create. For this tutorial, select “None.”<\/p>\n<\/li>\n
- \n
Give your data source a name and description.<\/p>\n<\/li>\n
- \n
Click on “Create.”<\/p>\n<\/li>\n
- \n
On the left-hand side of the AppSync console, click on “Resolvers.”<\/p>\n<\/li>\n
- \n
Click on “Create resolver.”<\/p>\n<\/li>\n
- \n
Choose the operation that you want to create a resolver for. For this tutorial, select “getPost.”<\/p>\n<\/li>\n
- \n
Specify the data source that you want to use. For this tutorial, select the data source that you just created.<\/p>\n<\/li>\n
- \n
Add the following code to your resolver:<\/p>\n<\/li>\n<\/ol>\n
{\n \"version\": \"2017-02-28\",\n \"operation\": \"GetItem\",\n \"key\": {\n \"id\": $util.dynamodb.toDynamoDBJson($ctx.args.id)\n }\n}\n<\/code><\/pre>\nIn this resolver, we’re telling AppSync to use the “GetItem” operation of our data source to retrieve a post object by ID.<\/p>\n
\n- Click on “Create resolver.”<\/p>\n<\/li>\n
- \n
Repeat steps 7-11 for the remaining operations: getPosts, createPost, updatePost, and deletePost. Here are the resolvers that you’ll need:<\/p>\n<\/li>\n<\/ol>\n
getPosts<\/h3>\n{\n \"version\": \"2017-02-28\",\n \"operation\": \"Scan\"\n}\n<\/code><\/pre>\ncreatePost<\/h3>\n{\n \"version\": \"2017-02-28\",\n \"operation\": \"PutItem\",\n \"key\": {\n \"id\": { \"S\": \"$util.autoId()\" }\n },\n \"attributeValues\": {\n \"title\": { \"S\": \"$ctx.args.title\" },\n \"body\": { \"S\": \"$ctx.args.body\" }\n }\n}\n<\/code><\/pre>\nupdatePost<\/h3>\n{\n \"version\": \"2017-02-28\",\n \"operation\": \"UpdateItem\",\n \"key\": {\n \"id\": $util.dynamodb.toDynamoDBJson($ctx.args.id)\n },\n \"update\": {\n \"expression\": \"SET #title = :title, #body = :body\",\n \"expressionNames\": {\n \"#title\": \"title\",\n \"#body\": \"body\"\n },\n \"expressionValues\": {\n \":title\": $util.dynamodb.toDynamoDBJson($ctx.args.title),\n \":body\": $util.dynamodb.toDynamoDBJson($ctx.args.body)\n }\n },\n \"condition\": {\n \"expression\": \"attribute_exists(id)\"\n }\n}\n<\/code><\/pre>\ndeletePost<\/h3>\n{\n \"version\": \"2017-02-28\",\n \"operation\": \"DeleteItem\",\n \"key\": {\n \"id\": $util.dynamodb.toDynamoDBJson($ctx.args.id)\n }\n}\n<\/code><\/pre>\nStep 4: Test your API<\/h2>\n
Now that our API is set up, we can test it using the AppSync console.<\/p>\n
To test your API, follow these steps:<\/p>\n
\n- On the left-hand side of the AppSync console, click on “Queries.”<\/p>\n<\/li>\n
- \n
Run the following query to retrieve all post objects:<\/p>\n<\/li>\n<\/ol>\n
query {\n getPosts {\n id,\n title,\n body\n }\n}\n<\/code><\/pre>\n\n- Run the following query to retrieve a single post object by ID:<\/li>\n<\/ol>\n
query {\n getPost(id: \"1\") {\n id,\n title,\n body\n }\n}\n<\/code><\/pre>\n