AWS Amplify is a JavaScript library for frontend and mobile developers building cloud-enabled applications.
AWS Amplify provides a declarative and easy-to-use interface across different categories of cloud operations. AWS Amplify goes well with any JavaScript based frontend workflow, and React Native for mobile developers.
Our default implementation works with Amazon Web Services (AWS), but AWS Amplify is designed to be open and pluggable for any custom backend or service.
Visit our Web Site to learn more about AWS Amplify.
For creating cloud powered Web apps with JavaScript, AWS Amplify is available as aws-amplify
package on npm
$ npm install aws-amplify --save
If you are developing a React app, you can install an additional package aws-amplify-react
containing Higher Order Components:
$ npm install aws-amplify --save
$ npm install aws-amplify-react --save
If you are developing an Angular app, you can install an additional package aws-amplify-angular
. This package contains an Angular module with a provider and components:
$ npm install aws-amplify --save
$ npm install aws-amplify-angular --save
Visit our Installation Guide for Web to start building your web app.
For React Native development, install aws-amplify
$ npm install aws-amplify --save
If you are developing a React Native app, you can install an additional package aws-amplify-react-native
containing Higher Order Components:
$ npm install aws-amplify-react-native --save
Visit our Installation Guide for React Native to start building your web app.
AWS Amplify supports many category scenarios such as Auth, Analytics, APIs and Storage as outlined in the Developer Guide. A couple of samples are below:
By default, AWS Amplify can collect user session tracking data with a few lines of code:
import Amplify, { Analytics } from 'aws-amplify';
import aws_exports from './aws-exports';
Amplify.configure(aws_exports);
...
Analytics.record('myCustomEvent');
See our Analytics Developer Guide for detailed information.
Adding authentication to your React or React Native app is as easy as wrapping your app's main component with our withAuthenticator
higher order component. AWS Amplify will provide you customizable UI for common use cases such as user registration and login.
...
import Amplify from 'aws-amplify';
import { withAuthenticator } from 'aws-amplify-react-native';
import aws_exports from './aws-exports';
Amplify.configure(aws_exports);
...
export default withAuthenticator(App);
To add authentication to your Angular app you can also use the built-in service provider and components:
// main.ts
import Amplify from 'aws-amplify';
import awsmobile from './aws-exports';
Amplify.configure(awsmobile); // or manual configuration, see the docs
...
// app.component.ts
import { AmplifyService } from 'aws-amplify-angular';
...
constructor( public amplify:AmplifyService ) {
// handle auth state changes
this.amplify.authStateChange$
.subscribe(authState => {
this.authenticated = authState.state === 'signedIn';
if (!authState.user) {
this.user = null;
} else {
this.user = authState.user;
}
});
}
// app.component.html
<amplify-authenticator></amplify-authenticator>
See our Angular Guide for more details on Angular setup and usage.
See our Authentication Developer Guide for detailed information.
AWS Amplify automatically signs your REST requests with AWS Signature Version 4 when using the API module :
let apiName = 'MyApiName';
let path = '/path';
let options = {
headers: {...} // OPTIONAL
}
API.get(apiName, path, options).then(response => {
// Add your code here
});
See our API Developer Guide for detailed information.
AWS Amplify provides an easy-to-use API to store and get content from public or private storage folders:
Storage.put(key, fileObj, {level: 'private'})
.then (result => console.log(result))
.catch(err => console.log(err));
// Stores data with specifying its MIME type
Storage.put(key, fileObj, {
level: 'private',
contentType: 'text/plain'
})
.then (result => console.log(result))
.catch(err => console.log(err));