How To Build a Full Stack Web App Using AWS Amplify | Part 1 - Integration & Configuration

June 26, 2020

How To Build a Full Stack Web App Using AWS Amplify | Part 1 - Integration & Configuration

Building Web Applications normally require a lot of work. From provisioning, configuring and managing servers to writing the application, the process can be quite time consuming and expensive. In order to skip a few steps and safe time, AWS offers a simple solution to quick and efficient web application development - AWS Amplify. By utilising the AWS serverless platform, developers can deploy cost-effective applications with built-in capabilities, allowing them to only focus on writing the application code. If you’re struggling with web application development and opting towards using AWS Amplify to develop a scalable web app, you’ve come to the right place. So without further ado, let’s dive into part 1 of this 3 part blog series, which will guide you step by step through the entire web application development process.

Prerequisites

Before you install AWS Amplify, make sure that you have an AWS account, Node.js and NPM. In order to install Amplify, you need to have version 10 of Node.js (or later), and at least version 6 of NPM. If you are unsure which version of Node.js or NPM you currently have, simply use the following commands to ensure that you adhere to the minimum version requirements: 

Node.js Version Command
NPM Version Command

Installation

Once you have the basics in place, you can install the AWS Amplify CLI. The CLI is a unified toolchain with built in best practices, helping with repetitive tasks and simplifying the setup and provisioning of cloud services with features such as Storage, Hosting, API’s, Functions and authentication. 

Configuring the AWS Amplify CLI

To configure the CLI, run the following command:

The amplify command will open your browser and will present you with the AWS Console login screen, from where you must sign into your AWS account in order to continue. Once you’ve logged in,  you can return to the command line and press enter to continue.

Amplify will now ask you to specify the AWS Region and the username of the new IAM user. As soon as you’ve supplied the username, Amplify will open your browser again and present the Add User Screen.

After you've created the user, you’ll be presented with the user’s Access Key ID and Secret Access Key. You can now go back to the command line and add the credentials above, at the prompts for each. 

Once you’ve completed these steps, you’re ready to move on to the next phase of building your web application. In Part 2 of this blog series, we’ll take a look at setting up the project repository in AWS CodeCommit. Make sure to follow us on social media and stay up to date with all our latest blogs and projects. 

Jacques Fourie

Dirk Coetzer

Solutions Architect

Swipe iX Newsletter

Subscribe to our email newsletter for useful tips and valuable resources, sent out monthly.