aws-amplify-material-ui-js-demo icon indicating copy to clipboard operation
aws-amplify-material-ui-js-demo copied to clipboard

AWS Amplify, Material UI

AWS Amplify Material UI JavaScript Demo

AWS Amplify is the fastest and easiest way to build mobile applications on AWS. Amplify allows you quickly set up authentication, analytics, and offline data sync for your mobile applications with a few commands and integrate them into your application with a few lines of code.

Material UI provides a large set of React components for faster and easier web development.

This demo shows how to quickly build an application using AWS Amplify Framework and Material UI library with authentication, API features and a modern user interface. Additionally, we will use AWS Amplify Console to deploy this cloud native application.

Prerequisite

  1. Install AWS Amplify CLI

  2. Configure AWS credentials on your local development environment

  3. Nodejs 8+

Getting started

  1. install the dependencies, type npm install in terminal

  2. Create the backend using Amplify CLI. The amplify configuration file has been created in ./amplify folder it contains a Cognito User Pool which used for authentication.

    amplify init
    amplify push
    
  3. create file src/api-config.js

    const config = {
      "orderAPIUrl": "http://<order-api-url>",
      "stageAPIUrl": "https://<stage-api-url>"
    };
    
    export default config;
    
  4. Run command npm start to run the web application locally.

  5. To build the artifact, run npm run build, the artifact will be generated in ./build folder

  6. Check the source code to see how to use AWS Amplify with Material UI library.

Screenshots

Click the menu button to open the sidebar.

Screen 2

License Summary

This sample code is made available under the MIT-0 license. See the LICENSE file.