npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@ttoss/aws-appsync-backend

v0.2.2

Published

AWS AppSync client for backend.

Downloads

7

Readme

AWS AppSync Backend

AWS AppSync client for a NodeJS App. This package is a wrap of this tutorial.

This client is a Apollo JavaScript client plus the authentication method that we need to access AWS AppSync URL (more details about authentication method can be found on the AWS AppSync JavaScript SDK docs). Also, this backend client adds fetch polyfills and WebSocket to perform subscriptions.


Installation

npm

npm install --save @ttoss/aws-appsync-backend

yarn

yarn add @ttoss/aws-appsync-backend

Getting Started

You must have AWS CLI installed and have the permissions to create AWS AppSync resources.

*note: in this section, we'll use AWSAppSyncBackendCoolChat as the stack name, but you may choose any name you want.

Deploy AWS AppSync API

We've provided a simple chat example using a CloudFormation template which creates an AWS AppSync API with few GraphQL operations.

To deploy the API, run this command:

$ aws cloudformation deploy --stack-name AWSAppSyncBackendCoolChat --template-file ./path_to_template/cloudformation.yml

Also, you may clone this project and run the command:

$ npm run example:deploy

Get the URL and API key

After deployed, you can get the URL and API key accessing the AWS AppSync or the CloudFormation console and check the stack outputs.

Also, you can get them running the command:

$ aws cloudformation describe-stacks --stack-name AWSAppSyncBackendCoolChat --query 'Stacks[0].Outputs'

Which will return something like this:

- OutputKey: ApiKey
  OutputValue: da2-rvbbc6xzkXXXXXXX
- OutputKey: Url
  OutputValue: https://vnkglexXXXXX.appsync-api.us-east-1.amazonaws.com/graphql

GraphQL operations

Create the client

import { AwsAppSyncBackend, AuthOptions, AUTH_TYPE, gql } from '@ttoss/aws-appsync-backend';

const url = ... // your URL here

const auth: AuthOptions = {
  type: AUTH_TYPE.API_KEY,
  apiKey: ... // your API key here
};

const awsAppSyncBackend = AwsAppSyncBackend({ url, auth });

Query

awsAppSyncBackend
  .query({
    query: gql`
      query {
        oldMessages {
          author
          dateTime
          content
        }
      }
    `,
  })
  .then(({ data }) => {
    console.log(data.oldMessages);
  })
  .catch((err) => {
    console.error('Occurred an error.');
    console.log(err);
  });

Mutation

const author = 'Pedro';
const content = 'Hello again!';

awsAppSyncBackend
  .mutate({
    mutation: gql`
      mutation sendMessageMutation($author: String!, $content: String!) {
        sendMessage(author: $author, content: $content) {
          author
          dateTime
          content
        }
      }
    `,
    variables: { author, content },
  })
  .then(({ data }) => {
    console.log(data.sendMessage);
  })
  .catch((err) => {
    console.error('Occurred an error.');
    console.log(err);
  });

Subscription

awsAppSyncBackend
  .subscribe({
    query: gql`
      subscription {
        sentMessage {
          author
          dateTime
          content
        }
      }
    `,
  })
  .subscribe({
    next: ({ data }) => console.log(data.sentMessage),
    error: (err) => {
      console.error('Occurred an error.');
      console.log(err);
    },
    complete: () => console.log('Completed.'),
  });

Using the provided example

If you want to use the example we've created, you just need to run these commands:

$ npm run example:query
$ npm run example:mutation -- --author Pedro --content "Hi"
$ npm run example:subscription

Destroy AWS AppSync API

Finally, you may want to destroy the stack created running the command:

$ aws cloudformation destroy --stack-name AWSAppSyncBackendCoolChat

If you're using our example:

$ npm run destroy

Author


License

MIT