Create & Configure an AWS Amplify Project with a React Application

nader dabit
Instructornader dabit
Share this video with your friends

Social Share Links

Send Tweet
Published 6 years ago
Updated 4 years ago

In this lesson we’ll create a new React application, create a new AWS Amplify project, & configure the React application to begin working with Amplify & AWS services.

Instructor: [00:01] Now that we've installed and configured the CLI, let's create a new React application, and then initialize a new Amplify project within the React application.

[00:14] To do so, we'll use create React app to create a new React application called My Amplify app. Once the new React application has been created, let's change into the new directory.

[00:31] From within the new directory, we'll run Amplify init to initialize a new Amplify project. We'll then be prompted for a few options. For the default editor, I'll choose Visual Studio code. For the type of app we're building, we can choose JavaScript. For the framework we're using, we can choose React.

[00:49] The source directory can be left as source. The distribution directory, build. The build command can be left as build. The start command can be left as start.

[01:04] Next, we're given the option to choose an AWS profile. Here, we can choose the profile that we created when we configured this CLI.

[01:18] Now, our Amplify project has been initialized. We should now see a .Amplify rc file, as well as an Amplify folder, in our root directory.

[01:29] The last thing we need to do is install the AWS Amplify and AWS Amplify React Client Libraries into our React application.

[01:39] To do so, we can either use npm or yarn to add AWS Amplify and AWS Amplify React.

[01:53] Now, the React app has been configured, the Amplify project has been created, and we're ready to begin adding new features.