I am old in IT but new in development, and I've been spending time researching what tools and platforms to use for a social-good app I am making. I have some idea now around which Javascript framework to use, and am diving in to deployment, integration, and hosting environments. So it was a natural step to check out what AWS are doing in the mobile integration cloud space.

Searching the web and online training, it didn't take long for Amplify and AppSync to pop out. But what do they do? I will try and answer, starting with a diagram then getting into more of a breakdown.

Amplify and AppSync summary - what are they for, and what they are made up of

AWS Amplify - summary

Amplify is a tool to integrate your frontend code with the cloud, and execute creation of back end resources including authentication, API, and hosting which includes a deployment pipeline.

Amplify has a client-installed CLI (similar to the main AWS CLI), some snippets to install in your code, and a suite of cloudformation scripts it runs in the cloud when instructed. It also has an AWS console interface.

AWS AppSync - summary

AppSync is a data aggregator serving GraphQL query results. It also has the power feature of allowing real time subscriptions via the Apollo JS library, so apps can have live changes when upstream data changes. And offline mode.

AppSync lives in the cloud, is managed from the AWS Console (or cloudformation) where you can define the query schemas, and "resolvers" for the data feeds. It provides the Apollo SDK for you to add to your codebase to enable subscriptions and offline mode.

How do Amplify and AppSync work together?

They have both been designed with each other in mind. A GraphQL API can be created in the AppSync Console, or created with Amplify for use by AppSync. The AppSync documentation recommends using Amplify if building a complete application.. which I am.

AWS Amplify detail

I ran through this tutorial provided by AWS, and it's pretty good. I like the broad framework selection, which you can find in a drop-box at the top left: Javascript, Android, Angular, Ionic, iOS, React, React Native and Vue.

The Amplify CLI is set up as a one off, much like the core AWS CLI.

In your chosen dev project folder, amplify runs an init to set up the cloud connection, and inject the necessary credentials to talk cloud (with gitignore).

Then the Amplfy libraries specific to your framework are installed, which allows some UI features like login fields, the basic Auth state, logout buttons etc. A quick update to import the new resources into your code, and the frontend config is complete.

With the frontend connected, the core functions you could then add are:

  • Create a cloud API and database
  • Add authentication, using Cognito
  • Configure hosting

They are all optional. Any of these created resources can be examined and manipulated in the AWS Console, with a frontend/backend context.

An Amplify / React pipeline-based tutorial

I also ran through this tutorial from AWS, which is React specific, and builds with Github / hosting pipeline integration. If you are thinking about using Github directly integrated and don't mind a bit of React, it's definitely worth checking out.

One gotcha with this tutorial - the steps for creating Auth broke the deployment pipeline build (AWS spin up deployment servers and install npm etc on the fly) with a Cannot find file './aws-exports' error, I had to delete and recreate the link to the branch for it to pick up the new dependencies. This could also have probably been fixed in the settings of course.

When it works it's quite good, as you can update your desired release branch and the automagic happens, your new version appears in production. Then there the other benefits of automated deployment, such as automated testing, etc.

You don't have to use the AWS pipeline for hosting of course, bear in mind build and hosting options are not free though the framework is.

It's a good time to mention that Amplify has a CLI option to scrub nicely whatever it built in the cloud, by rewinding the cloudformations - it's in the tutorials. At least you can run up tutorial resources knowing you can easily scrub them afterwards, on a project basis.

AWS AppSync detail

AppSync represents an excellent data aggregation point, able to "fan out" to multiple data sources and provide a single query point for an app via a GraphQL API.

I didn't run through a tutorial for AppSync, but did set an hour aside to watch the AWS configurotron video where all you might want to know is explained.

Key takeaways:

  • Specific DynamoDB, Elasticsearch, Lambda data source / resolver integrations
  • Amplify integration for e.g. Authentication: API, users, groups
  • Declarative interface
  • Schema definitions - GUI Schema generation
  • Query construction - automatic introspections / autocomplete
  • Offline data rendering and real-time updates with Apollo
  • Client image handling - database has pointers to S3 Objects
  • Potential for mocking query results using local resolvers - a la Postman

There are clear benefits with integrations within the AWS ecosystem. E.g. running a mutation from the console can yield result in a direct AWS-api-based result in DynamoDB.

It's not free of course, with prices detailed here.

Will I use these products for my app?

I have already decided GraphQL is the way to go in preference to REST, it seems a really good match for my data-heavy app.

AWS Amplify - yes. It ticks the box for configuring and heavy lifting for authentication, which was one of my main concerns overall. Although I won't use the chargeable pipeline and hosting options just yet, when I get closer to a working prototype I'll think about implementing it. And the broad JS framework support is the icing on the cake.

AWS AppSync - probably. Looking at the pricing model, it seems AppSync will incur some standing costs even for a tiny prototype usage model. When making a social-good app, keeping costs low or finding free options is essential.

I did debate an alternative, self-hosted in a container on a cheap VPS. In the end, as a one-man-band with not much development background, the user-friendliness and integration wins out. AppSync will for sure be a faster option to get to prototype and eventually MVP.

AWS GraphQL API - yes. This isn't a standalone product as such, but I will use it. I am not super thrilled with the lack of visibility around the endpoint, but there are some decent options for designing a public-user access model. Architecturally it seems a bit of an appendage - I would expect this to be integrated with the mainstream AWS API Gateway service, perhaps it's going to be.

Alternatives

An alternative to Appsync I like the look of is Hasura. It's open source, actively being developed, also offers realtime app-state updates, claims to be the fastest API there is, and there are Docker containers available for self hosting. I might yet use it should I get past prototype + MVP, and start looking at a more substantial production build.

More adventures to come!

Main amplifier photo courtesy of Caught In Joy on Unsplash