amplify-boilerplate

The below README holds some extracts and links of the AWS Amplify Documentation. In case more information is needed, you will likely find it there.

Pre-requisites

Install AWS Amplify CLI with npm install -g @aws-amplify/cli

Concerning AWS Account Creation: For the registration, go to AWS Portal Developer Registration. The first year is free, then the cost depend on the usage.

I used Ionic with React in this boilerplate project. I checked out React Native as well, but the support for ReactJS (and hence Ionic with React) in AWS Amplify seemed to me a bit better.

Ionic Framework Installation

Using Ionic is not a must, but it allows you to create a native & Progressive Web App (PWA) in one. To get started with Ionic check out the official Ionic website. (And don't let yourself hinder from the need to create an account - it is worth it :))

Getting started

The best way to try out AWS Amplify yourself is with the AWS Amplify Sandbox.

Workflow

There are two ways, you can make changes in your app:

  • In the AWS Amplify Studio you can develop your app backend graphically (to a certain extent) & add a UI library (with Figma components).
  • With the Amplify CLI and a local code repository you can develop your frontend and your backend further.

AWS Amplify Studio

Amplify Studio is a graphical interface for your AWS Amplify backend that can be opened by clicking Launch Studio in AWS Amplify console:

Open Amplify Studio

Whenever you do a change in Amplify Studio, you should update your local code repository with amplify pull or amplify pull --appId <your-app-id> --envName staging to get the latest changes.

Git-based Deployments

When configured as described here, the code gets automatically deployed when pushed to the Master/Main branch on Git. You can observe the deployment in the AWS console under AWS Amplify.

Basic Development

Figma Integration

Tip: As mentioned in best practices, the font of Figma components is not automatically taken over into the code component. To use the desired font you need to import it.

Use an Amplify Datastore

The easiest way is to create the data model inside Amplify Studio. More details about data modeling are provided here. After pulling the changes with amplify pull use the following command to configure the database locally:

# For existing APIs
amplify update api

Then follow the rest of the tutorial linked above.

Create a Python API

Checkout the inbuilt Predictions API to see what AI & ML cloud services AWS Amplify already provides.