Upgrade to Pro — share decks privately, control downloads, hide ads and more …

The Power of Serverless GraphQL with AppSync

The Power of Serverless GraphQL with AppSync

ServerlessDays Virtual, October 2020. https://virtual.serverlessdays.io/speakers/202010/slobodan/

Slobodan Stojanović

October 28, 2020
Tweet

More Decks by Slobodan Stojanović

Other Decks in Programming

Transcript

  1. It needs to be ready for yesterday. And it needs

    to be scalable and real-time!
  2. Slobodan Stojanović CTO @ Cloud Horizon & CTO @ Vacation

    Tracker co-author of Serverless Applications with Node.js book AWS Serverless Hero @slobodan_
  3. @slobodan_ "We were frustrated with the differences between the data

    we wanted to use in our apps and the server queries they required." L" Byron, 2015 GraphQL: A data query language article
  4. • Defines a data shape • Hierarchical • Strongly typed

    • Protocol, not storage • Introspective • Version fr"
  5. Types type Author { id: Int name: String posts: [Post]

    } type Post { id: Int title: String text: String author: Author }
  6. Resolvers getAuthor(_, args){ return sql.raw('SELECT * FROM authors WHERE id

    = %s', args.id); } posts(author){ return request(`https://api.blog.io/by_author/${author.id}`); }
  7. Queries { getAuthor(id: 5){ name posts { title author {

    # this will be the same as the name above name } } } }
  8. Result { "name": "Slobodan", "posts": [{ "title": "Hello World", "author":

    { "name": "Slobodan" } }, { "title": "GraphQL", "author": { "name": "Slobodan" } }] }
  9. AppSync is a managed service that uses GraphQL to make

    it easy for applications to get exactly the data they n"d.
  10. • Define GraphQL schema • Automatically provision a DynamoDB data

    source and connect resolvers • Write GraphQL queries and mutations • Use the API in the frontend app
  11. AppSync with CDK import * as cdk from '@aws-cdk/core'; import

    * as appsync from '@aws-cdk/aws-appsync'; export class AppsyncCdkAppStack extends cdk.Stack { constructor(scope: cdk.Construct, id: string, props?: cdk.StackProps) { super(scope, id, props); // Creates the AppSync API const api = new appsync.GraphqlApi(this, 'Api', { name: 'my-awesome-app', schema: appsync.Schema.fromAsset('graphql/schema.graphql'), }); // Prints out the AppSync GraphQL endpoint to the terminal new cdk.CfnOutput(this, "GraphQLAPIURL", { value: api.graphqlUrl }); } }
  12. AWS AppSync lets you specify which part of your data

    should be available in a real-time manner using GraphQL Subscriptions.
  13. Real-time subscriptions type Subscription { addedPost: Post @aws_subscribe(mutations: ["addPost"]) updatedPost:

    Post @aws_subscribe(mutations: ["updatePost"]) deletedPost: Post @aws_subscribe(mutations: ["deletePost"]) }
  14. AWS AppSync supports Amazon Elasticsearch! the GraphQL operations can be

    simple lookups, complex queries & mappings, fu! text searches, fuzzy/keyword searches or geo lookups.
  15. ?

  16. I would say it’s an alien language (we!, its Java-based)

    hard to test in isolation in a serverless application, especia!y in AWS CloudForamation.
  17. Testing Alien language Templates import { AppSyncMockFile } from 'amplify-appsync-simulator'

    import { VelocityTemplate } from 'amplify-appsync-simulator/lib/velocity' import { readFileSync } from 'fs' import { join } from 'path' import { getAppSyncSimulator } from './helpers/get-appsync-simulator' import { getVelocityRendererParams } from './helpers/get-velocity-renderer-params' // Read the VTL file from the disc const vtl = readFileSync(join(__dirname, '..', 'get-company-resolver-request.vtl'), 'utf8') const template: AppSyncMockFile = { content: vtl } // Create a simulator instance const simulator = getAppSyncSimulator() // Create a VelocityTemplate instance const velocity = new VelocityTemplate(template, simulator)
  18. Testing Alien language Templates describe('some-file.vtl', () => { const {

    ctxValues, requestContext, info } = getVelocityRendererParams('username', { 'custom:companyId': 'company', }) test('should render a template', () => { const result = velocity.render(ctxValues, requestContext, info) expect(result).toEqual({ errors: [], isReturn: false, stash: {}, result: { version: '2018-05-29', operation: 'GetItem', key: { id: { S: 'company' }, }, }, }) }) })
  19. It depends on your approach. It's good to have end-to-end

    tests, but you can test your Lambda code or VTL templates in isolation.
  20. Quick Summary: • GraphQL makes your frontend and backend connection

    effortless • AppSync makes GraphQL management effortless • Serverless GraphQL makes you a super hero