 Resources from Tomasz Łakomy in 2022

The Chrome Developer Tools (DevTools for short), are a set of web authoring and debugging tools built into Google Chrome.

chrome-devtools

Lighthouse is a tool that analyses web apps and web pages, collecting modern performance metrics and insights on developer best practices.

It's built directly into the Chrome DevTools and in this quick lesson we're going to learn how to run the audit, how to read its results and why you should always run the Lighthouse audit in Incognito mode.



Run a Lighthouse audit in Chrome Devtools

GraphQL is a query language for APIs and a runtime for fulfilling those queries with your existing data. GraphQL provides a complete and understandable description of the data in your API, gives clients the power to ask for exactly what they need and nothing more, makes it easier to evolve APIs over time, and enables powerful developer tools.

graphql

There is a slight chance that your book startup didn't work out. Or maybe you created your CDK project just as a learning exercise. Either way, it's best to clean up after yourself in order to not get hit with any surprise charges. 

You can easily destroy your stack and its resources from the command line with `cdk destroy`. But don't worry. You can easily restore your stack with `cdk deploy`. This is the power of infrastructure as code!

Delete and Restore an AWS CDK Stack 

AppSync supports GraphQL subscriptions out of the box! We don't even have to write custom code. 

All we have to do is create a Subscription type in our GraphQL schema with `@aws_subscribe()`, and pass that the mutation we want to subscribe to.

Add a GraphQL Subscription to an AWS AppSync API

Continuing with building our GraphQL CRUD API, we now need a way to update an item. We'll do this by using a mutation. 

DocumentClient update expressions are cumbersome, instead of writing them ourselves, we are going to install the **[dynoexpr](https://github.com/tuplo/dynoexpr)** library that will generate them for us. 

But, in order to be able to bundle the third-party package into our lambda function, we will use the **[Amazon Lambda Node.js Library](https://docs.aws.amazon.com/cdk/api/latest/docs/aws-lambda-nodejs-readme.html)**

Update an AWS DynamoDB Item Using a Third-Party Library In a Lambda Function

Amazon Web Services (AWS) is a powerful expansive cloud infrastructure platform for building modern web applications.

AWS provides services for data, presentation, authentication, security, video encoding, and much more. Offering over 175 fully-featured services from data centers globally, AWS powers a large percentage of the internet.

What do we do when one of our GraphQL query functions is running slow? Where do we start figuring out the problem? 

Enabling all logs with AppSync and setting up X-Ray gives you a powerful bug hunting combination. You can use the logs to find your request logs and a trace ID that you can use with X-Ray to see a graph of your requests. 

From there you can see exactly which request is having issues and investigate it further!

Use AppSync Logging and AWS X-Ray to Debug Performance Issues

We are repeating the same pattern across all of our lambda functions. We can extract the common parts into their own constant to save ourselves some time. 

By generalizing the repeated code we have now made our app easier to refactor. Let's take advantage of that by refactoring our Lambda functions to use the Arm/Graviton2 architecture which enhances cost performance by 20%. 

All you have to do is add an `architecture` prop to your lambda config with a value of `lambda.Architecture.ARM_64`

Refactor AWS Lambda Functions to Use Arm/Graviton2 Architecture in CDK

As of now, we can only create a single book or query for ALL of the books. Let's create a query that searches for a book by its ID. 

It is very similar to querying for all of the books. You can copy over the code for the list books Lambda and then create a new handler function. 

The function deviates since you need to search for a book by its ID. You will use the DynamoDB DocumentClient method, `.put` instead of `.list` . And you will pass that function an ID.

Query for AWS DynamoDB Items by ID With an AppSync GraphQL API

You may notice that sometimes when you make a query or mutation after not using your app for a while, it will be extra slow. What gives? 

There are a couple of things happening. First, a lambda function goes through a "cold-start" after being run for the first time in a while. AWS is downloading the code and spinning up an environment. 

Second, if you are using the default settings, your function doesn't have much memory to work with. You can specify the amount of memory your function has available in its configuration.

Reduce the Latency of Your AWS Lambda Functions 

Right now our database is read-only. Let's fix that! 

In GraphQL you make changes to your database using what are called *mutations*. We can define a mutation in our schema and then create a new lambda function that handles writing to our DynamoDB table.

Perform a GraphQL Mutation with an AWS Lambda Function

It would quickly get out of hand if we had to create TypeScript types for every type in our GraphQL schema. Luckily there are a couple packages from `graphql-codegen` that we can use to make our lives easier.

We'll create a `codegen.yml` file where we'll specify our GraphQL schema and choose the location of the types file we want to generate based on the schema. 

Then we can create a script in our package.json that runs the codegen.

For more on using TypeScript with AppSync Lambda Resolvers, check out Benoît Bouré blog post: [How to use TypeScript with AppSync Lambda Resolvers](https://benoitboure.com/how-to-use-typescript-with-appsync-lambda-resolvers)

Generate TypeScript Types From a GraphQL Schema

Now we have to set up our Lambda function to actually read data from our DynamoDB table. 

The hard coded data in our handler function is getting deleted and being replaced with code that scans our table and returns its contents. 

To make this happen we'll be using `aws-sdk` to get access to `DynamoDB.DocumentClient` which gives us a simple API for interacting with our tables.

Read Data From a DynamoDB Table In an AWS Lambda Resolver

Having a hardcoded source of data isn't going to work out in the short or long term. We need something a little more dynamic. 

That's why we'll be learning how to create a **DynamoDB table** to store our data instead! In this lesson, we will create a table in our CDK app, and grant our lambda function read access to the table.

Create a DynamoDB Table in an AWS CDK App 

Without data, you can't query for data 🤔

You can add data source resolvers to your GraphQL API in the AWS console, but in this lesson, we'll be doing it all in our CDK app. This is in adherence with the infrastructure as code best practice.

We'll create a lambda function entirely within our CDK app. We'll create a data source with our AppSync GraphQL API and add our lambda function as the handler. Then we have to make sure that data-source is invoked when there is a query to `listBooks`

Connect an AWS Lambda Data Source to an AppSync GraphQL API

The default key that is generated for your AppSync API expires in only 7 days. It would be a big pain in the fingers to update your app every 7 days! 

Instead, you can use AppSync to create and configure your own API key, where you can set whatever expiration date you want.

Create an API Key with AWS CDK AppSync

There are only a few steps you have to take to create a live GraphQL API with AWS CDK's AppSync package. 

First, define a GraphQL schema. This is where you define the data you want to query and create query and mutation functions. 

Then, AppSync is used to create a new GraphQL API, passing in the schema you just created. When you deploy, an API key will be generated. You will need this key to interact with the API.

Create an AWS CDK AppSync GraphQL API

Time to deploy! Learn how to use the `npm run watch` command to watch for changes and compile TypeScript to JavaScript. 

But, the main thing you'll learn is how to use the `cdk deploy` command to deploy your app to AWS and then navigate to your app through the AWS web console.

Deploy a CDK stack to AWS

You can create an AWS CDK project entirely on the command. In this lesson, you will learn how to install the AWS CLI to view all of you existing S3 bucks and to initialize a CDK app with TypeScript. 

You can find the CLI documentation here at [Configuring the AWS CLI](https://docs.aws.amazon.com/cli/latest/userguide/cli-chap-configure.html)