Val Nuccio
5 min readJan 26, 2021

--

AWS Amplify for React/React Native Development — Pt 1 Setting up your Amplify Environment

TL:DR If you already have Node, npm, and an AWS account and don’t need an explanation about what Amplify is — scroll down to the “steps” below.

As you scour the internet looking for new technologies to uncover, one of the most frequently incorporated I stumbled upon was AWS Amplify. As a new developer and also as a newbie to cloud computing services in general, seeing all the options that services like AWS can offer felt extremely overwhelming. It seemed like there was a lot to offer — maybe too much.

What is AWS AMPLIFY and why use it?

AWS defines Amplify as :

“a set of tools (open source framework, admin UI, console) and services (static web hosting) to accelerate the development of mobile and web applications on AWS”

Basically it is a framework that uses a CLI to build up a backend for serverless applications (commonly used with React) and integrate prebuilt AWS libraries and UI components.

Some common use cases would be :

  • Authentication — utilizing Amazon Cognito.
  • Storage — powered by Amazon S3
  • API creation and management and Data Store— both REST Apis and GraphQL. Powered by AWS AppSync and Amazon API Gateway.

There are also Chatbot options, Analytics, Push Notifications, and much more so check it out here : https://aws.amazon.com/amplify/features/

To simplify — AWS Amplify is to cloud technology what create-react-app is to React. Because of this simplicity it is a perfect match for development with React or React Native. Amplify was actually developed as a resource for developers to facilitate the connection of their server-less applications to AWS services without having to repetitively handle the connection and integration of AWS services.

This is ideal for tight deadlines so you don’t get caught up on getting connected to the cloud and lose time on actual development. It’s also great for those new to cloud development — getting you connected quickly and all your tools set up the right way. It also comes with the Amplify CLI which removes the annoyance of going in and out of the web console for AWS.

Most importantly — it is mostly FREE. That’s right. Free. So go ahead and sign up for an account here:

For this tutorial you will also need Node which you can get here if you don’t have it yet. https://nodejs.org/en/

STEPS START HERE!

Step 1: Once that is done you need to install AWS Amplify CLI globally.

sudo npm install -g @aws-amplify/cli

The sudo will make it so that the installation has all the administrator access it could possibly need and I have found it pretty useful for amplify installations.

Once that is done type the following into your terminal

amplify

if you see something like this:

Good to go!

Step 2:

Next you need to configure Amplify from your local machine to work directly with the AWS console.

Hit that terminal and enter

 amplify configure

You are going to be prompted to select a region for development. Some information on those regions is here:

I personally selected the us-east-1.

You will be prompted to create a user name for an IAM user.

lets say: amplify-myapp

Side note: If you are a little confused about what a Root user is vs what is an IAM user you can check out this link from AWS (https://docs.aws.amazon.com/general/latest/gr/root-vs-iam.html). Alternately, as a newbie I can describe it best by saying- the root user is your account that you sign into to manage all cloud usage and the IAM username you create manages just that application. Comment below if you feel this is too general or not a good explanation!

This is going to launch your web management console where you will see your username and show that you are creating that account with “Programmatic access”.

Click Next.

In Permissions, the default option of a user with AdministratorAccess is fine and dandy.

Click Next.

In Tags (which is optional) you can enter information on what you created this user for. For example:

On the next screen you will be able to review what you entered and then hit Create User.

Now — STOP. You need this information!

Navigate to your terminal and press enter. It is going to prompt you for the accessKey and secretAccessKey that can be found on that web console page. Once that is entered it will prompt you for a profile name.

By default, if you don’t enter anything it will override any AWS profiles you have on your machine. If you have never used AWS before then this isn’t really an issue, however, for the sake of practicing well I would enter a username that — again — is representative of what you will be working with.

Let’s call it : amplify

Now you’re all set to start actually incorporating libraries!

Stay tuned in the coming days/weeks as I’ll be doing a series on various use cases for AWS Amplify for use with React and React Native applications. First on the docket — Authentication.

--

--