If you’ve been following this blog series and eager to finally get your web app up and running, you’ll be pleased to know that this article concludes the groundwork of our beginner’s guide. At this point you should have Amplify and CodeCommit configured and ready to go, and also have a local repository linked to CodeCommit via Git. If these concepts sound foreign to you, you may have skipped a few steps, but not to worry, you can quickly hop on over to Part 1 and Part 2 before going through Part 3. For those who are up to date and have been following our guide religiously - let’s get straight to business.  

Explore a New Branch For The Initialisation

If you’re up to date with all the steps in this blog series, you should have your project cloned to your local machine and be working off the master branch. Before we continue, we should do some repo admin. Each developer has their own approach to working on projects, but today we’ll be following the git flow process.

First we want to branch off the master branch and create a develop branch. This branch will serve as an integration branch for new features.

git checkout -b develop

The Amplify Environment

Before we dive into project initialisation, let’s take a look at using multiple environments with Amplify.

One of the noteworthy features of Amplify is the ability to create multiple environments which might have different infrastructures configured in the cloud.

The Amplify Console also has features like continuous deployment, easy custom domains + free HTTPS, multi-environment support with feature branch deploys, & allows you to manage your frontend & serverless backend in a single deployment workflow.

For a start, we’re going to create a dev environment for our development branch. This will allow us to develop features for our application and publish application changes as well as infrastructure changes to our dev environment before merging and publishing it to our production environment.

Logically the workflow for working with multiple local environments would look something like this:

1. Create feature branch

git checkout -b feature/[feature_name]

‍

2. Create Amplify environment

amplify env add feature/[feature_name]

‍

3. Make Changes to the project code and infrastructure

4. Publish the changes for testing

amplify publish

‍

You can use amplify push if you only want to push the infrastructure changes

amplify push

‍

5. Once you're happy with the updates, you can merge them into your develop branch

git checkout develop
git merge --no-ff feature/[feature_name]
git push

‍

All the code and infrastructure updates will now be available to all the team members and we can create our environment when we initialise the amplify application.

Initialising The Amplify App

To initialise a new Amplify project, run the following command from the root directory of your frontend app:

amplify init

‍

This init command goes through the following steps:

• Analyses the project and confirms the frontend settings
• Carries out the initialisation logic of the selected frontend
• If there are multiple provider plugins, prompts to select the plugins that will provide accesses to cloud resources
• Carries out, in sequence, the initialisation logic of the selected plugin(s)
• Insert amplify folder structure into the project’s root directory, with the initial project configuration
• Generate the project metadata files, with the outputs of the above-selected plugin(s)
• Creates a cloud project in the AWS Amplify Console to view and manage resources for all backend environments

When asked to choose what type of app and javascript framework you’re using, select javascript followed by angular, since we are going to be building an angular application and we’ll be running through what exactly we are building in the next lesson.

After completing these steps,  the application should be added to the Amplify console. The Amplify Console will look rather sparse at this point in time.There is not much happening here at the moment but we’ll be getting into the Amplify Console and it’s features as we build out our application.

Committing Your Changes

Run the following command to have a look at the changes that were made:

git status

‍

Commit and push your changes

git commit -am "Initialize Amplify project and setup a dev environment"
git push

‍

Where To From Here?

After carefully following the steps in our 3 part blog series, you’ll have an empty project in the cloud. During the initialisation Amplify has created some default infrastructure like added roles and an S3 bucket where our resources will be copied during deployments. At this point in time there won’t be much to show yet, but the groundwork has been laid. If you’re struggling with any of the steps or have a few unanswered questions, please feel free to reach out! If you’re keen to learn more about the dev world and interested in refining your skills, keep an eye on our social media pages and website for future blog posts and updates.