Introduction to AWS and AWS Amplify

Introduction to AWS

Amazon Web Services offers a broad set of global cloud-based products including compute, storage, databases, analytics, networking, mobile, developer tools, management tools, IoT, security, and enterprise applications: on-demand, available in seconds, with pay-as-you-go pricing.  From data warehousing to deployment tools, directories to content delivery, over 175 AWS services are available.

In 2006, Amazon Web Services (AWS) began offering IT infrastructure services to businesses as web services—now commonly known as cloud computing. One of the key benefits of cloud computing is the opportunity to replace upfront capital infrastructure expenses with low variable costs that scale with your business. With the cloud, businesses no longer need to plan for and procure servers and other IT infrastructure weeks or months in advance. Instead, they can instantly spin up hundreds or thousands of servers in minutes and deliver results faster.

Services Overview

AWS is a comprehensive, easy to use computing platform offered Amazon. The platform is developed with a combination of infrastructure as a service (IaaS), platform as a service (PaaS) and packaged software as a service (SaaS) offerings.

Free Usage Limits Overview

The free tier applies to certain participating AWS services up to a specific maximum amount of usage each month. The AWS Free Usage Tier is comprised of three different types of pricing models, a 12-month Free Tier, an Always Free offer, and short term trials.

The AWS Free Usage Tier is available to everyone – students, entrepreneurs, small businesses, and Fortune 500 companies.  More importantly, the AWS free usage tier is available to new AWS accounts created on or after October 21, 2010.

Services that are available in the Free Usage Tier

1) 750 hours of Amazon EC2 Linux or RHEL or SLES t2.micro instance usage (1 GiB of memory and 32-bit and 64-bit platform support) – enough hours to run continuously each month

2) 750 hours of an Elastic Load Balancer plus 15 GB data processing

3) 750 hours of Amazon RDS Single-AZ Micro DB Instances, running MySQL, MariaDB, PostgreSQL, Oracle BYOL or SQL Server Express Edition – enough hours to run a DB Instance continuously each month. You also get 20 GB of database storage and 20 GB of backup storage

4) 750 hours of Amazon ElastiCache Micro Cache Node usage – enough hours to run continuously each month.

5) 30 GB of Amazon Elastic Block Storage in any combination of General Purpose (SSD) or Magnetic, plus 2 million I/Os (with EBS Magnetic) and 1 GB of snapshot storage

6) 5 GB of Amazon S3 standard storage, 20,000 Get Requests, and 2,000 Put Requests

7) 25 GB of Storage, 25 Units of Read Capacity and 25 Units of Write Capacity, enough to handle up to 200M requests per month with Amazon DynamoDB

8) 25 Amazon SimpleDB Machine Hours and 1 GB of Storage

9) 1,000 Amazon SWF workflow executions can be initiated for free. A total of 10,000 activity tasks, signals, timers and markers, and 30,000 workflow-days can also be used for free

10) 100,000 Requests of Amazon Simple Queue Service

11) 100,000 Requests, 100,000 HTTP notifications and 1,000 email notifications for Amazon Simple Notification Service

12) 10 Amazon Cloudwatch metrics, 10 alarms, and 1,000,000 API requests

13) 50 GB Data Transfer Out, 2,000,000 HTTP and HTTPS Requests for Amazon CloudFront

14) 15 GB of bandwidth out aggregated across all AWS services

Note: If you are linked to an Organization (under AWS Organizations), only one account within the organization can benefit from the Free Tier offers.

Prerequisites

Before we begin, make sure you have the following installed:

Steps to Create AWS Free-Tier Account

AWS Amplify

The Amplify Command Line Interface (CLI) is a unified toolchain to create AWS cloud services for your app. Let’s go ahead and install the Amplify CLI.

Option 1: Watch the video guide👇

steps to install AWS Amplify

Watch the video above to learn how to install and configure the Amplify CLI.

Option 2: Follow the Instructions

NPM
npm install -g @aws-amplify/cli                          

Note: Because we’re installing the Amplify CLI globally, you might need to run the command above with sudo depending on your system policies.

URL (Mac and Linux)
https://aws-amplify.github.io/amplify-cli/install
URL (Windows)
https://aws-amplify.github.io/amplify-cli/install-win -o install.cmd && install.cmd

Now it’s time to setup the Amplify CLI. Configure Amplify by running the following command:

amplify configure
amplify configure will ask you to sign into the AWS console

Once you’re signed in, Amplify CLI will ask you to create an IAM user.

Amazon IAM (Identity and Access Management) enables you to manage users and user permissions in AWS. You can learn more about Amazon IAM here.

Specify the AWS Region
? region: # Your preferred region
Specify the username of the new IAM user:
? user name: # User name for Amplify IAM user
Complete the user creation using the AWS console

Create a user with AdministratorAccess to your account to provision AWS resources for you like AppSync, Cognito etc.

Once the user is created, Amplify CLI will ask you to provide the accessKeyId and the secretAccessKey to connect Amplify CLI with your newly created IAM user.

Enter the access key of the newly created user:
? accessKeyId: # YOUR_ACCESS_KEY_ID
? secretAccessKey: # YOUR_SECRET_ACCESS_KEY
This would update/create the AWS Profile in your local machine
? Profile Name: # (default)

Successfully set up the new user.

Next, we’ll set up the app and initialize Amplify!

Set up fullstack project

Create a new React App

To set up the project, we’ll first create a new React app with create-react-app, a CLI tool used to bootstrap a React app using current best practices. We’ll then add Amplify and initialize a new project.

From your projects directory, run the following commands:

1 npx create-react-app react-amplified
2 cd react-amplified

This creates a new React app in a directory called react-amplified and then switches us into that new directory.

Now that we’re in the root of the project, we can run the app by using the following command:

npm start

This runs a development server and allows us to see the output generated by the build, you can see the running app by navigating to http://localhost:3000.

Initialize a new backend

Now that we have a running React app, it’s time to set up Amplify so that we can create the necessary backend services needed to support the app.

From the root of the project, run:

amplify init

When you initialize Amplify you’ll be prompted for some information about the app:

Enter a name for the project (react-amplified)
# All AWS services you provision for your app are grouped into an “environment”
# A common naming convention is dev, staging, and production
Enter a name for the environment (dev)
# Sometimes the CLI will prompt you to edit a file, it will use this editor to open those files.
Choose your default editor

# Amplify supports JavaScript (Web & React Native), iOS, and Android apps
Choose the type of app that you’re building (javascript)

What JavaScript framework are you using (react)

Source directory path (src)

Distribution directory path (build)

Build command (npm run build)

Start command (npm start)
# This is the profile you created with the `amplify configure` command in the introduction step.
Do you want to use an AWS profile

When you initialize a new Amplify project, a few things happen:

  • It creates a top level directory called amplify that stores your backend definition. During the tutorial you’ll add capabilities such as a GraphQL API and authentication. As you add features, the amplify folder will grow with infrastructure-as-code templates that define your backend stack. Infrastructure-as-code is a best practice way to create a replicable backend stack.
  • It creates a file called aws-exports.js in the src directory that holds all the configuration for the services you create with Amplify. This is how the Amplify client is able to get the necessary information about your backend services.
  • It modifies the .gitignore file, adding some generated files to the ignore list
  • A cloud project is created for you in the AWS Amplify Console that can be accessed by running amplify console. The Console provides a list of backend environments, deep links to provisioned resources per Amplify category, status of recent deployments, and instructions on how to promote, clone, pull, and delete backend resources

Install Amplify libraries

The first step to using Amplify in the client is to install the necessary dependencies:

npm install aws-amplify @aws-amplify/ui-react
The aws-amplify package is the main library for working with Amplify in your apps. The @aws-amplify/ui-react package includes React specific UI components we’ll use as we build the app.

Setup Frontend

Next, we need to configure Amplify on the client so that we can use it to interact with our backend services.

Open src/index.js and add the following code below the last import:

1 import Amplify from “aws-amplify”;
2 import awsExports from “./aws-exports”;
3 Amplify.configure(awsExports);

Now that our React app is set up and Amplify is initialized, we’re ready to add an API.

Leave a Reply

Your email address will not be published. Required fields are marked *