+ Flutter and the related logo are trademarks of Google LLC. We are not endorsed by or affiliated with Google LLC.
diff --git a/client/src/docs-ui/footer/footer.tsx b/client/src/docs-ui/footer/footer.tsx
index 8eafbf72ab5..ccde8bb4f44 100644
--- a/client/src/docs-ui/footer/footer.tsx
+++ b/client/src/docs-ui/footer/footer.tsx
@@ -69,6 +69,8 @@ export class DocsFooter {
privacy policy
.
+
+ {'Flutter and the related logo are trademarks of Google LLC. We are not endorsed by or affiliated with Google LLC.'}
diff --git a/client/src/docs-ui/landing-hero-cta/landing-hero-cta.tsx b/client/src/docs-ui/landing-hero-cta/landing-hero-cta.tsx
index 6eca44faccb..784a1a64738 100644
--- a/client/src/docs-ui/landing-hero-cta/landing-hero-cta.tsx
+++ b/client/src/docs-ui/landing-hero-cta/landing-hero-cta.tsx
@@ -44,6 +44,16 @@ export class DocsLandingHeroCTA {
alt="Android Icon"
/>
+
+
+
);
diff --git a/client/src/utils/filter-data.ts b/client/src/utils/filter-data.ts
index 1212d6160ce..3fbda5262df 100644
--- a/client/src/utils/filter-data.ts
+++ b/client/src/utils/filter-data.ts
@@ -17,7 +17,12 @@ type FilterMetadataByOption = Record<
* platform filter constants
*/
-export const PLATFORM_FILTER_OPTIONS = ["js", "android", "ios"] as const;
+export const PLATFORM_FILTER_OPTIONS = [
+ "js",
+ "android",
+ "ios",
+ "flutter",
+] as const;
export const platformFilterMetadataByOption: FilterMetadataByOption = {
js: {
@@ -32,6 +37,10 @@ export const platformFilterMetadataByOption: FilterMetadataByOption
+
+
+
+
+
+
\ No newline at end of file
diff --git a/docs/fragments/lib/flutter.md b/docs/fragments/lib/flutter.md
new file mode 100644
index 00000000000..f24da9f29c6
--- /dev/null
+++ b/docs/fragments/lib/flutter.md
@@ -0,0 +1,14 @@
+
+
+Welcome to Flutter Developer Preview documentation.
+
+
+
+## Amplify Flutter
+
+This guide shows how to build an app using our Amplify Libraries for Flutter and the Amplify CLI toolchain.
+
+
+
+ Get Started 🚀
+
\ No newline at end of file
diff --git a/docs/images/lib/getting-started/flutter/set-up-android-studio-configure-successful.png b/docs/images/lib/getting-started/flutter/set-up-android-studio-configure-successful.png
new file mode 100644
index 00000000000..16735c6a34a
Binary files /dev/null and b/docs/images/lib/getting-started/flutter/set-up-android-studio-configure-successful.png differ
diff --git a/docs/images/lib/getting-started/flutter/set-up-android-studio-configure-your-project.png b/docs/images/lib/getting-started/flutter/set-up-android-studio-configure-your-project.png
new file mode 100644
index 00000000000..a8625b13966
Binary files /dev/null and b/docs/images/lib/getting-started/flutter/set-up-android-studio-configure-your-project.png differ
diff --git a/docs/images/lib/getting-started/flutter/set-up-android-studio-pub-get.png b/docs/images/lib/getting-started/flutter/set-up-android-studio-pub-get.png
new file mode 100644
index 00000000000..87274b1ec7a
Binary files /dev/null and b/docs/images/lib/getting-started/flutter/set-up-android-studio-pub-get.png differ
diff --git a/docs/images/lib/getting-started/flutter/set-up-android-studio-select-project-template.png b/docs/images/lib/getting-started/flutter/set-up-android-studio-select-project-template.png
new file mode 100644
index 00000000000..7eda0374fb8
Binary files /dev/null and b/docs/images/lib/getting-started/flutter/set-up-android-studio-select-project-template.png differ
diff --git a/docs/images/lib/getting-started/flutter/set-up-android-studio-welcome.png b/docs/images/lib/getting-started/flutter/set-up-android-studio-welcome.png
new file mode 100644
index 00000000000..2b827d95e8f
Binary files /dev/null and b/docs/images/lib/getting-started/flutter/set-up-android-studio-welcome.png differ
diff --git a/docs/lib/analytics/autotrack.md b/docs/lib/analytics/autotrack.md
index 6f7651b2e22..9947f8b27ec 100644
--- a/docs/lib/analytics/autotrack.md
+++ b/docs/lib/analytics/autotrack.md
@@ -5,4 +5,5 @@ description: The Amplify analytics plugin records when an application opens and
-
\ No newline at end of file
+
+
\ No newline at end of file
diff --git a/docs/lib/analytics/existing-resources.md b/docs/lib/analytics/existing-resources.md
index 1314de2b403..db5438d1f4c 100644
--- a/docs/lib/analytics/existing-resources.md
+++ b/docs/lib/analytics/existing-resources.md
@@ -5,3 +5,4 @@ description: Configure the Amplify Libraries to use existing Amazon Pinpoint res
+
diff --git a/docs/lib/analytics/fragments/existing-resources.md b/docs/lib/analytics/fragments/existing-resources.md
index 1333142adc5..36ce3234802 100644
--- a/docs/lib/analytics/fragments/existing-resources.md
+++ b/docs/lib/analytics/fragments/existing-resources.md
@@ -1,6 +1,6 @@
Existing Amazon Pinpoint resources can be used with the Amplify Libraries by referencing your **Application ID** and **Region** in your `amplifyconfiguration.json` file.
-```json
+```dart
{
"analytics": {
"plugins": {
diff --git a/docs/lib/analytics/fragments/flutter/getting-started/10_preReq.md b/docs/lib/analytics/fragments/flutter/getting-started/10_preReq.md
new file mode 100644
index 00000000000..c879e837899
--- /dev/null
+++ b/docs/lib/analytics/fragments/flutter/getting-started/10_preReq.md
@@ -0,0 +1,3 @@
+* [Install and configure Amplify CLI](https://docs.amplify.aws/cli/start/install)
+* A Flutter application targeting Flutter SDK >= 1.20 with Amplify libraries integrated
+ * For a full example of please follow the [project setup walkthrough](~/lib/project-setup/create-application.md)
diff --git a/docs/lib/analytics/fragments/flutter/getting-started/20_installLib.md b/docs/lib/analytics/fragments/flutter/getting-started/20_installLib.md
new file mode 100644
index 00000000000..4a8f38f753e
--- /dev/null
+++ b/docs/lib/analytics/fragments/flutter/getting-started/20_installLib.md
@@ -0,0 +1,17 @@
+In your Flutter project directory, open **pubspec.yaml**.
+
+> You will already have configured Amplify by following the steps in the project setup.
+
+Add Analytics by adding these libraries into your dependencies block:
+
+```yaml
+dependencies:
+
+ # Should already be added during Project Setup walkthrough
+ amplify_core:
+ path: '<1.0.0'
+
+ # Add these lines in `dependencies`
+ amplify_analytics_pinpoint:
+ path: '<1.0.0'
+```
\ No newline at end of file
diff --git a/docs/lib/analytics/fragments/flutter/getting-started/30_initAnalytics.md b/docs/lib/analytics/fragments/flutter/getting-started/30_initAnalytics.md
new file mode 100644
index 00000000000..8201b348538
--- /dev/null
+++ b/docs/lib/analytics/fragments/flutter/getting-started/30_initAnalytics.md
@@ -0,0 +1,37 @@
+To initialize the Amplify Auth and Analytics categories call the `Amplify.addPlugin()` method for each category. To complete initialization call `Amplify.configure()`.
+
+Add the following code to the `initState` method
+
+
+```dart
+Amplify.addPlugin(new AWSCognitoAuthPlugin());
+Amplify.addPlugin(new AmplifyAnalyticsPinpointPlugin());
+```
+
+(VERIFY, To be determined) Make sure that the amplifyconfiguration.dart file generated in the project setup is included and sent to Amplify.configure:
+
+```dart
+import 'amplifyconfiguration.dart';
+
+Amplify.configure( amplifyConfig )
+```
+
+Your class will look like this:
+
+```dart
+import 'amplifyconfiguration.dart';
+
+class MyAmplifyApp extends StatefulWidget {
+
+ @override
+ void initState() {
+ super.initState();
+
+ Amplify.addPlugin(new AWSCognitoAuthPlugin());
+ Amplify.addPlugin(new AWSPinpointAnalyticsPlugin(this));
+
+ Amplify.configure( amplifyConfig );
+
+ }
+}
+```
\ No newline at end of file
diff --git a/docs/lib/analytics/fragments/flutter/getting-started/40_record.md b/docs/lib/analytics/fragments/flutter/getting-started/40_record.md
new file mode 100644
index 00000000000..27c20c1c8a8
--- /dev/null
+++ b/docs/lib/analytics/fragments/flutter/getting-started/40_record.md
@@ -0,0 +1,12 @@
+To record an event, create an `AnalyticsEvent` and call `Amplify.Analytics.recordEvent()`:
+
+```dart
+AnalyticsEvent event = AnalyticsEvent("test");
+
+event.properties.addBoolProperty("boolKey", true);
+event.properties.addDoubleProperty("doubleKey", 10.0);
+event.properties.addIntProperty("intKey", 10);
+event.properties.addStringProperty("stringKey", "stringValue");
+
+Amplify.Analytics.recordEvent(event: event);
+```
\ No newline at end of file
diff --git a/docs/lib/analytics/fragments/flutter/identifyuser.md b/docs/lib/analytics/fragments/flutter/identifyuser.md
new file mode 100644
index 00000000000..0df33a03476
--- /dev/null
+++ b/docs/lib/analytics/fragments/flutter/identifyuser.md
@@ -0,0 +1,28 @@
+This call sends information that you have specified about a user to Amazon Pinpoint. This could be for an unauthenticated (guest) or an authenticated user.
+
+You can get the current user's ID from the Amplify Auth category as shown below. Be sure you have it added and setup per the Auth category documentation.
+
+If you have asked for location access and received permission, you can also provide that in `AnalyticsUserProfileLocation`
+
+
+```dart
+
+AnalyticsUserProfileLocation location = new AnalyticsUserProfileLocation();
+ location.latitude = 47.606209;
+ location.longitude = -122.332069;
+ location.postalCode = "98122";
+ location.city = "Seattle";
+ location.region = "WA";
+ location.country = "USA";
+
+AnalyticsProperties properties = new AnalyticsProperties();
+ properties.addStringProperty("phoneNumber", "+11234567890");
+ properties.addIntProperty("age", 25);
+
+AnalyticsUserProfile userProfile = new AnalyticsUserProfile();
+ userProfile.name = username;
+ userProfile.email = "name@example.com";
+ userProfile.location = location;
+
+Amplify.Analytics.identifyUser(userId: userId, userProfile: profile);
+```
\ No newline at end of file
diff --git a/docs/lib/analytics/fragments/flutter/record.md b/docs/lib/analytics/fragments/flutter/record.md
new file mode 100644
index 00000000000..263f6e4e805
--- /dev/null
+++ b/docs/lib/analytics/fragments/flutter/record.md
@@ -0,0 +1,96 @@
+## Record event
+
+The Amplify analytics plugin also makes it easy to record custom events within the app. The plugin handles retry logic in the event the device looses network connectivity and automatically batches requests to reduce network bandwidth.
+
+
+
+
+```dart
+AnalyticsEvent event = AnalyticsEvent("PasswordReset");
+event.properties.addStringProperty("Channel", "SMS");
+event.properties.addBoolProperty("Successful", true);
+event.properties.addIntProperty("ProcessDuration", 792);
+event.properties.addDoubleProperty("doubleKey", 120.3);
+
+Amplify.Analytics.recordEvent(event: event);
+```
+
+## Flush events
+
+Events have default configuration to flush out to the network every 30 seconds. If you would like to change this, update `amplifyconfiguration.json` with the value in milliseconds you would like for `autoFlushEventsInterval`. This configuration will flush events every 10 seconds:
+
+```json
+{
+ "UserAgent": "aws-amplify-cli/2.0",
+ "Version": "1.0",
+ "analytics": {
+ "plugins": {
+ "awsPinpointAnalyticsPlugin": {
+ "pinpointAnalytics": {
+ "appId": "AppID",
+ "region": "Region"
+ },
+ "pinpointTargeting": {
+ "region": "Region"
+ },
+ "autoFlushEventsInterval": 10000
+ }
+ }
+ }
+}
+```
+
+To manually flush events, call:
+
+
+
+
+```dart
+Amplify.Analytics.flushEvents();
+```
+
+
+## Global Properties
+
+You can register global properties which will be sent along with all invocations of `Amplify.Analytics.recordEvent`.
+
+
+
+```dart
+AnalyticsProperties properties = new AnalyticsProperties();
+properties.addStringProperty("AppStyle", "DarkMode");
+Amplify.Analytics.registerGlobalProperties(globalProperties: properties);
+```
+
+To unregister a global property, call `Amplify.Analytics.unregisterGlobalProperties()`:
+
+
+
+
+```dart
+Amplify.Analytics.unregisterGlobalProperties(propertyName: ["AppStyle", "OtherProperty"]);
+```
+
+## Disable Analytics
+
+To disable analytics, call:
+
+
+
+
+```dart
+Amplify.Analytics.disable();
+```
+
+
+## Enable Analytics
+
+To re-enable, call:
+
+
+
+
+```dart
+Amplify.Analytics.enable();
+```
+
diff --git a/docs/lib/analytics/fragments/native_common/getting-started/common.md b/docs/lib/analytics/fragments/native_common/getting-started/common.md
index 51930c13d05..818caa42738 100644
--- a/docs/lib/analytics/fragments/native_common/getting-started/common.md
+++ b/docs/lib/analytics/fragments/native_common/getting-started/common.md
@@ -8,6 +8,7 @@ To setup and configure your application with Amplify Analytics and record an ana
+
## Set up Analytics backend
@@ -40,16 +41,19 @@ Upon completion, `amplifyconfiguration.json` should be updated to reference prov
+
## Initialize Amplify Analytics
+
## Record events
+
## View Analytics console
diff --git a/docs/lib/analytics/getting-started.md b/docs/lib/analytics/getting-started.md
index 05af4e163df..97673abec55 100644
--- a/docs/lib/analytics/getting-started.md
+++ b/docs/lib/analytics/getting-started.md
@@ -6,4 +6,4 @@ description: The Analytics category enables you to collect analytics data for yo
-
+
diff --git a/docs/lib/analytics/identifyuser.md b/docs/lib/analytics/identifyuser.md
index 42b385d0693..94b9b490c2a 100644
--- a/docs/lib/analytics/identifyuser.md
+++ b/docs/lib/analytics/identifyuser.md
@@ -4,4 +4,5 @@ description: Use the Amplify analytics plugin to inform Pinpoint about your user
---
-
\ No newline at end of file
+
+
\ No newline at end of file
diff --git a/docs/lib/analytics/record.md b/docs/lib/analytics/record.md
index 4b9e623bdd7..67453c5ad7b 100644
--- a/docs/lib/analytics/record.md
+++ b/docs/lib/analytics/record.md
@@ -5,4 +5,5 @@ description: Learn how to record analytics events using Amplify.
-
\ No newline at end of file
+
+
\ No newline at end of file
diff --git a/docs/lib/auth/access_credentials.md b/docs/lib/auth/access_credentials.md
index 32add5e27bd..1842d9e4cc6 100644
--- a/docs/lib/auth/access_credentials.md
+++ b/docs/lib/auth/access_credentials.md
@@ -5,3 +5,4 @@ description: Use AWS Cognito Auth plugin to access auth credentials
+
diff --git a/docs/lib/auth/auth-events.md b/docs/lib/auth/auth-events.md
index 2f66c17b8dd..7f084f7bf03 100644
--- a/docs/lib/auth/auth-events.md
+++ b/docs/lib/auth/auth-events.md
@@ -5,3 +5,4 @@ description: Listen to various auth events
+
diff --git a/docs/lib/auth/escapehatch.md b/docs/lib/auth/escapehatch.md
index c944dd335e4..926b9e7d0fc 100644
--- a/docs/lib/auth/escapehatch.md
+++ b/docs/lib/auth/escapehatch.md
@@ -5,4 +5,3 @@ description: Underlying service
-
diff --git a/docs/lib/auth/existing-resources.md b/docs/lib/auth/existing-resources.md
index 2f7184cc9b4..ac287501585 100644
--- a/docs/lib/auth/existing-resources.md
+++ b/docs/lib/auth/existing-resources.md
@@ -5,3 +5,4 @@ description: Configure the Amplify Libraries to use existing Amazon Cognito reso
+
diff --git a/docs/lib/auth/fragments/android/access_credentials/10_fetchAuthSession.md b/docs/lib/auth/fragments/android/access_credentials/10_fetchAuthSession.md
index 6455be53550..47e50c9c1ee 100644
--- a/docs/lib/auth/fragments/android/access_credentials/10_fetchAuthSession.md
+++ b/docs/lib/auth/fragments/android/access_credentials/10_fetchAuthSession.md
@@ -1,3 +1,6 @@
+However, if you need to access them in relation to working with an API outside Amplify or want access to AWS specific identifying information (e.g. IdentityId),
+you can access these implementation details by casting the result of fetchAuthSession as follows:
+
diff --git a/docs/lib/auth/fragments/flutter/access_credentials/10_fetchAuthSession.md b/docs/lib/auth/fragments/flutter/access_credentials/10_fetchAuthSession.md
new file mode 100644
index 00000000000..e46bb6d1541
--- /dev/null
+++ b/docs/lib/auth/fragments/flutter/access_credentials/10_fetchAuthSession.md
@@ -0,0 +1,14 @@
+However, if needed you can directly access the credentials as follows:
+
+```dart
+ void _fetchSession() async {
+ try {
+ AuthSession res = await Amplify.Auth.fetchAuthSession(
+ options: CognitoSessionOptions(getAWSCredentials: true)
+ ); } on AuthError catch (e) {
+ print(e);
+ }
+ }
+```
+
+If the `getAWSCredentials` option is true, the result will contain AWS credentials and tokens. If it is set to false, the result will contain a simple `isSignedIn` flag.
\ No newline at end of file
diff --git a/docs/lib/auth/fragments/flutter/common_prereq.md b/docs/lib/auth/fragments/flutter/common_prereq.md
new file mode 100644
index 00000000000..8e530e95207
--- /dev/null
+++ b/docs/lib/auth/fragments/flutter/common_prereq.md
@@ -0,0 +1 @@
+* An app setup according to the [getting started walkthrough](~/lib/auth/getting-started.md)
\ No newline at end of file
diff --git a/docs/lib/auth/fragments/flutter/existing-resources.md b/docs/lib/auth/fragments/flutter/existing-resources.md
new file mode 100644
index 00000000000..f82c8b7cf56
--- /dev/null
+++ b/docs/lib/auth/fragments/flutter/existing-resources.md
@@ -0,0 +1,50 @@
+Existing Amazon Cognito identity and user pools can be used with the Amplify Libraries by referencing them in your `amplifyconfiguration.dart` file.
+
+```dart
+const amplifyconfig = ''' {
+ "UserAgent": "aws-amplify-cli/2.0",
+ "Version": "1.0",
+ "auth": {
+ "plugins": {
+ "awsCognitoAuthPlugin": {
+ "IdentityManager": {
+ "Default": {}
+ },
+ "CredentialsProvider": {
+ "CognitoIdentity": {
+ "Default": {
+ "PoolId": "[COGNITO IDENTITY POOL ID]",
+ "Region": "[REGION]"
+ }
+ }
+ },
+ "CognitoUserPool": {
+ "Default": {
+ "PoolId": "[COGNITO USER POOL ID]",
+ "AppClientId": "[COGNITO USER POOL APP CLIENT ID]",
+ "AppClientSecret": "[COGNITO USER POOL APP CLIENT SECRET]",
+ "Region": "[REGION]"
+ }
+ },
+ "Auth": {
+ "Default": {
+ "authenticationFlowType": "USER_SRP_AUTH"
+ }
+ }
+ }
+ }
+ }
+}''';
+```
+
+- **CredentialsProvider**:
+ - **Cognito Identity**:
+ - **Default**:
+ - **PoolID**: ID of the Amazon Cognito Identity Pool (e.g. `us-east-1:123e4567-e89b-12d3-a456-426614174000`)
+ - **Region**: AWS Region where the resources are provisioned (e.g. `us-east-1`)
+- **CognitoUserPool**:
+ - **Default**:
+ - **PoolId**: ID of the Amazon Cognito User Pool (e.g. `us-east-1_abcdefghi`)
+ - **AppClientId**: ID for the client used to authenticate against the user pool
+ - **AppClientSecret**: Secret for the client used to authenticate against the user pool
+ - **Region**: AWS Region where the resources are provisioned (e.g. `us-east-1`)
\ No newline at end of file
diff --git a/docs/lib/auth/fragments/flutter/getting_started/10_preReq.md b/docs/lib/auth/fragments/flutter/getting_started/10_preReq.md
new file mode 100644
index 00000000000..450b71c861f
--- /dev/null
+++ b/docs/lib/auth/fragments/flutter/getting_started/10_preReq.md
@@ -0,0 +1,2 @@
+* A Flutter application targeting Flutter SDK >= 1.20 with Amplify libraries integrated
+ * For a full example of please follow the [project setup walkthrough](~/lib/project-setup/create-application.md)
diff --git a/docs/lib/auth/fragments/flutter/getting_started/20_installLib.md b/docs/lib/auth/fragments/flutter/getting_started/20_installLib.md
new file mode 100644
index 00000000000..5fcdd9314d6
--- /dev/null
+++ b/docs/lib/auth/fragments/flutter/getting_started/20_installLib.md
@@ -0,0 +1,9 @@
+Add the following dependency to your **app**'s `pubspec.yaml` along with others you added above in **Prerequisites**:
+
+```yaml
+dependencies:
+ flutter:
+ sdk: flutter
+ amplify_auth_cognito: '<1.0.0'
+}
+```
diff --git a/docs/lib/auth/fragments/flutter/getting_started/30_initAuth.md b/docs/lib/auth/fragments/flutter/getting_started/30_initAuth.md
new file mode 100644
index 00000000000..048a5822d4f
--- /dev/null
+++ b/docs/lib/auth/fragments/flutter/getting_started/30_initAuth.md
@@ -0,0 +1,7 @@
+Add the Auth plugin, along with any other plugins you may have added as described in the **Prerequisites** section.
+
+```dart
+// Add this line, to include the Auth plugin.
+AmplifyAuthCognito auth = AmplifyAuthCognito();
+amplify.addPlugin(authPlugins: [auth]);
+```
diff --git a/docs/lib/auth/fragments/flutter/hub_events/10_listen_events.md b/docs/lib/auth/fragments/flutter/hub_events/10_listen_events.md
new file mode 100644
index 00000000000..8d9f0ae68a8
--- /dev/null
+++ b/docs/lib/auth/fragments/flutter/hub_events/10_listen_events.md
@@ -0,0 +1,18 @@
+```dart
+auth.events.startListening((hubEvent) {
+ switch(hubEvent["eventName"]) {
+ case "SIGNED_IN": {
+ print("USER IS SIGNED IN");
+ }
+ break;
+ case "SIGNED_OUT": {
+ print("USER IS SIGNED OUT");
+ }
+ break;
+ case "SESSION_EXPIRED": {
+ print("USER IS SIGNED IN");
+ }
+ break;
+ }
+});
+```
\ No newline at end of file
diff --git a/docs/lib/auth/fragments/flutter/password_management/10_reset_password.md b/docs/lib/auth/fragments/flutter/password_management/10_reset_password.md
new file mode 100644
index 00000000000..d42ea53a7f6
--- /dev/null
+++ b/docs/lib/auth/fragments/flutter/password_management/10_reset_password.md
@@ -0,0 +1,12 @@
+```dart
+try {
+ ResetPasswordResult res = await Amplify.Auth.resetPassword(
+ username: "myusername",
+ );
+ setState(() {
+ isPasswordReset = res.isPasswordReset;
+ });
+} on AuthError catch (e) {
+ print(e);
+}
+```
\ No newline at end of file
diff --git a/docs/lib/auth/fragments/flutter/password_management/20_confirm_reset_password.md b/docs/lib/auth/fragments/flutter/password_management/20_confirm_reset_password.md
new file mode 100644
index 00000000000..13777e8f9ee
--- /dev/null
+++ b/docs/lib/auth/fragments/flutter/password_management/20_confirm_reset_password.md
@@ -0,0 +1,11 @@
+```dart
+try {
+ await Amplify.Auth.confirmPassword(
+ username: "myusername",
+ newPassword: "mynewpassword",
+ confirmationCode: "123456"
+ );
+} on AuthError catch (e) {
+ print(e);
+}
+```
\ No newline at end of file
diff --git a/docs/lib/auth/fragments/flutter/password_management/30_change_password.md b/docs/lib/auth/fragments/flutter/password_management/30_change_password.md
new file mode 100644
index 00000000000..9771cc24f6b
--- /dev/null
+++ b/docs/lib/auth/fragments/flutter/password_management/30_change_password.md
@@ -0,0 +1,10 @@
+```dart
+try {
+ await Amplify.Auth.updatePassword(
+ newPassword: "mynewpassword",
+ oldPassword: "myoldpassword"
+ );
+} on AuthError catch (e) {
+ print(e);
+}
+```
\ No newline at end of file
diff --git a/docs/lib/auth/fragments/flutter/signin/10_signUp.md b/docs/lib/auth/fragments/flutter/signin/10_signUp.md
new file mode 100644
index 00000000000..2366c595def
--- /dev/null
+++ b/docs/lib/auth/fragments/flutter/signin/10_signUp.md
@@ -0,0 +1,23 @@
+ ```dart
+try {
+ Map userAttributes = {
+ "email": emailController.text,
+ "phone_number": phoneController.text,
+ // additional attributes as needed
+ };
+ SignUpResult res = await Amplify.Auth.signUp(
+ username: "myusername",
+ password: "mysupersecurepassword",
+ options: CognitoSignUpOptions(
+ userAttributes: userAttributes
+ )
+ );
+ setState(() {
+ isSignUpComplete = res.isSignUpComplete;
+ });
+} on AuthError catch (e) {
+ print(e);
+}
+
+```
+
diff --git a/docs/lib/auth/fragments/flutter/signin/20_confirmSignUp.md b/docs/lib/auth/fragments/flutter/signin/20_confirmSignUp.md
new file mode 100644
index 00000000000..0e1501ef50a
--- /dev/null
+++ b/docs/lib/auth/fragments/flutter/signin/20_confirmSignUp.md
@@ -0,0 +1,14 @@
+```dart
+try {
+ SignUpResult res = await Amplify.Auth.confirmSignUp(
+ username: "myusername",
+ confirmationCode: "123456"
+ );
+ setState(() {
+ isSignUpComplete = res.isSignUpComplete;
+ });
+} on AuthError catch (e) {
+ print(e);
+}
+```
+
diff --git a/docs/lib/auth/fragments/flutter/signin/30_signIn.md b/docs/lib/auth/fragments/flutter/signin/30_signIn.md
new file mode 100644
index 00000000000..67ef96905f5
--- /dev/null
+++ b/docs/lib/auth/fragments/flutter/signin/30_signIn.md
@@ -0,0 +1,15 @@
+```dart
+try {
+ SignInResult res = await Amplify.Auth.signIn(
+ username: usernameController.text.trim(),
+ password: passwordController.text.trim(),
+ );
+ setState(() {
+ isSignedIn = res.isSignedIn;
+ });
+} on AuthError catch (e) {
+ print(e);
+}
+```
+
+
diff --git a/docs/lib/auth/fragments/flutter/signin/40_multi_factor_signup.md b/docs/lib/auth/fragments/flutter/signin/40_multi_factor_signup.md
new file mode 100644
index 00000000000..1cf5c0655cf
--- /dev/null
+++ b/docs/lib/auth/fragments/flutter/signin/40_multi_factor_signup.md
@@ -0,0 +1,23 @@
+```dart
+try {
+ Map userAttributes = {
+ "email": "email@domain.com",
+ // Note: phone_number requires country code
+ "phone_number": "+15551234",
+ };
+ SignUpResult res = await Amplify.Auth.signUp(
+ username: "myusername",
+ password: "mysupersecurepassword",
+ options: CognitoSignUpOptions(
+ userAttributes: userAttributes
+ )
+ );
+ setState(() {
+ isSignUpComplete = res.isSignUpComplete;
+ });
+} on AuthError catch (e) {
+ print(e);
+}
+```
+
+
diff --git a/docs/lib/auth/fragments/flutter/signin/50_multi_factor_confirm_signin.md b/docs/lib/auth/fragments/flutter/signin/50_multi_factor_confirm_signin.md
new file mode 100644
index 00000000000..b3d62a3bdfa
--- /dev/null
+++ b/docs/lib/auth/fragments/flutter/signin/50_multi_factor_confirm_signin.md
@@ -0,0 +1,12 @@
+```dart
+try {
+ SignInResult res = await Amplify.Auth.confirmSignIn(
+ confirmationValue: "123456"
+ );
+ setState(() {
+ isSignedIn = res.isSignedIn;
+ });
+} on AuthError catch (e) {
+ print(e);
+}
+```
\ No newline at end of file
diff --git a/docs/lib/auth/fragments/flutter/signout/10_local_signout.md b/docs/lib/auth/fragments/flutter/signout/10_local_signout.md
new file mode 100644
index 00000000000..2a0428a06b6
--- /dev/null
+++ b/docs/lib/auth/fragments/flutter/signout/10_local_signout.md
@@ -0,0 +1,8 @@
+```dart
+try {
+ Amplify.Auth.signOut()
+} on AuthError catch (e) {
+ print(e);
+}
+```
+
diff --git a/docs/lib/auth/fragments/flutter/signout/20_global_signout.md b/docs/lib/auth/fragments/flutter/signout/20_global_signout.md
new file mode 100644
index 00000000000..7d1b8864be9
--- /dev/null
+++ b/docs/lib/auth/fragments/flutter/signout/20_global_signout.md
@@ -0,0 +1,9 @@
+```dart
+try {
+ Amplify.Auth.signOut(
+ globalSignOut: true
+ );
+} on AuthError catch (e) {
+ print(e);
+}
+```
\ No newline at end of file
diff --git a/docs/lib/auth/fragments/flutter/user_attributes/10_fetch_attributes.md b/docs/lib/auth/fragments/flutter/user_attributes/10_fetch_attributes.md
new file mode 100644
index 00000000000..1575dd66ac0
--- /dev/null
+++ b/docs/lib/auth/fragments/flutter/user_attributes/10_fetch_attributes.md
@@ -0,0 +1,3 @@
+
+This functionality has not yet been implemented for Flutter, this section will be updated once it has been added.
+
diff --git a/docs/lib/auth/fragments/flutter/user_attributes/20_update_user_attribute.md b/docs/lib/auth/fragments/flutter/user_attributes/20_update_user_attribute.md
new file mode 100644
index 00000000000..1575dd66ac0
--- /dev/null
+++ b/docs/lib/auth/fragments/flutter/user_attributes/20_update_user_attribute.md
@@ -0,0 +1,3 @@
+
+This functionality has not yet been implemented for Flutter, this section will be updated once it has been added.
+
diff --git a/docs/lib/auth/fragments/flutter/user_attributes/30_confirm_attribute.md b/docs/lib/auth/fragments/flutter/user_attributes/30_confirm_attribute.md
new file mode 100644
index 00000000000..1575dd66ac0
--- /dev/null
+++ b/docs/lib/auth/fragments/flutter/user_attributes/30_confirm_attribute.md
@@ -0,0 +1,3 @@
+
+This functionality has not yet been implemented for Flutter, this section will be updated once it has been added.
+
diff --git a/docs/lib/auth/fragments/flutter/user_attributes/40_resend_code.md b/docs/lib/auth/fragments/flutter/user_attributes/40_resend_code.md
new file mode 100644
index 00000000000..c2dec32d3b3
--- /dev/null
+++ b/docs/lib/auth/fragments/flutter/user_attributes/40_resend_code.md
@@ -0,0 +1,9 @@
+ ```dart
+try {
+ ResendSignUpCodeResult res = await Amplify.Auth.resendSignUpCode(
+ username: "myusername"
+ );
+} on AuthError catch (e) {
+ print(e);
+}
+```
diff --git a/docs/lib/auth/fragments/ios/access_credentials/10_fetchAuthSession.md b/docs/lib/auth/fragments/ios/access_credentials/10_fetchAuthSession.md
index ea495865790..92b48955139 100644
--- a/docs/lib/auth/fragments/ios/access_credentials/10_fetchAuthSession.md
+++ b/docs/lib/auth/fragments/ios/access_credentials/10_fetchAuthSession.md
@@ -1,3 +1,6 @@
+However, if you need to access them in relation to working with an API outside Amplify or want access to AWS specific identifying information (e.g. IdentityId),
+you can access these implementation details by casting the result of fetchAuthSession as follows:
+
```swift
import AWSPluginsCore
diff --git a/docs/lib/auth/fragments/native_common/access_credentials/common.md b/docs/lib/auth/fragments/native_common/access_credentials/common.md
index 47c0ee323d7..4f8cdf6df0e 100644
--- a/docs/lib/auth/fragments/native_common/access_credentials/common.md
+++ b/docs/lib/auth/fragments/native_common/access_credentials/common.md
@@ -2,8 +2,6 @@ An intentional decision with Amplify Auth was to avoid any public methods exposi
With Auth, you simply sign in and it handles everything else needed to keep the credentials up to date and vend them to the other categories.
-However, if you need to access them in relation to working with an API outside Amplify or want access to AWS specific identifying information (e.g. IdentityId),
-you can access these implementation details by casting the result of fetchAuthSession as follows:
-
+
diff --git a/docs/lib/auth/fragments/native_common/auth_events/common.md b/docs/lib/auth/fragments/native_common/auth_events/common.md
index 97d9d1847ef..f09e3e6a768 100644
--- a/docs/lib/auth/fragments/native_common/auth_events/common.md
+++ b/docs/lib/auth/fragments/native_common/auth_events/common.md
@@ -2,3 +2,4 @@ AWS Cognito Auth Plugin sends important events through Amplify Hub.
+
diff --git a/docs/lib/auth/fragments/native_common/getting_started/common.md b/docs/lib/auth/fragments/native_common/getting_started/common.md
index cd0443877d4..7f65faa582e 100644
--- a/docs/lib/auth/fragments/native_common/getting_started/common.md
+++ b/docs/lib/auth/fragments/native_common/getting_started/common.md
@@ -7,6 +7,7 @@ To setup and configure your application with Amplify Auth and go through a simpl
+
## Configure Auth Category
@@ -38,10 +39,12 @@ Upon completion, `amplifyconfiguration.json` should be updated to reference prov
+
## Initialize Amplify Auth
+
## Check the current auth session
diff --git a/docs/lib/auth/fragments/native_common/password_management/common.md b/docs/lib/auth/fragments/native_common/password_management/common.md
index 04b0ec0b0ea..05872d9dbb1 100644
--- a/docs/lib/auth/fragments/native_common/password_management/common.md
+++ b/docs/lib/auth/fragments/native_common/password_management/common.md
@@ -3,6 +3,7 @@ In order to reset your password, use the resetPassword api - this will send a co
+
To complete the password reset process, invoke the confirmResetPassword api with the code you were sent and the new password you want.
@@ -13,9 +14,11 @@ As a result, for testing purposes, you'll at least need an input field where you
+
## Change password
A signed in user can update their password using the updatePassword api:
+
diff --git a/docs/lib/auth/fragments/native_common/signin/common.md b/docs/lib/auth/fragments/native_common/signin/common.md
index 55dc814b129..b0e430def5c 100644
--- a/docs/lib/auth/fragments/native_common/signin/common.md
+++ b/docs/lib/auth/fragments/native_common/signin/common.md
@@ -5,6 +5,7 @@ The Auth category can be used to register a user, confirm attributes like email/
+
## Register a user
@@ -12,11 +13,13 @@ The default CLI flow as mentioned in the [getting started guide](~/lib/auth/gett
+
The next step in the sign up flow is to confirm the user. A confirmation code will be sent to the email id provided during sign up. Enter the confirmation code received via email in the `confirmSignUp` call.
+
You will know the sign up flow is complete if you see the following in your console window:
@@ -30,6 +33,7 @@ Implement a UI to get the username and password from the user. After the user en
+
You will know the sign in flow is complete if you see the following in your console window:
@@ -100,6 +104,7 @@ When you sign up, be sure to include both email and phone attributes with the ph
+
You'll then confirm signup, sign in, and get back a nextStep in the sign in result of type `CONFIRM_SIGN_IN_WITH_SMS_MFA_CODE`.
A confirmation code will also be texted to the phone number provided above. Pass the code you received to the confirmSignIn api:
@@ -111,3 +116,4 @@ As a result, for testing purposes, you'll at least need an input field where you
+
diff --git a/docs/lib/auth/fragments/native_common/signout/common.md b/docs/lib/auth/fragments/native_common/signout/common.md
index b3a822b7e2e..35dc57ae1f7 100644
--- a/docs/lib/auth/fragments/native_common/signout/common.md
+++ b/docs/lib/auth/fragments/native_common/signout/common.md
@@ -2,11 +2,13 @@ Invoke the `signOut` api to sign out a user from the Auth category. You can only
+
Calling signOut without any options will just delete the local cache and keychain of the user. If you would like to sign out of all devices, invoke the signOut api with advanced options.
+
Calling signout with `globalSignOut = true` will invalidate all the Cognito User Pool tokens of the signed in user. If the user is signed into a device, they won't be authorized to perform a task that requires a valid token when a global signout is called from some other device. They need to sign in again to get valid tokens.
diff --git a/docs/lib/auth/fragments/native_common/user_attributes/common.md b/docs/lib/auth/fragments/native_common/user_attributes/common.md
index 8ab4a015a37..dd0bf736c76 100644
--- a/docs/lib/auth/fragments/native_common/user_attributes/common.md
+++ b/docs/lib/auth/fragments/native_common/user_attributes/common.md
@@ -4,6 +4,7 @@ Invoke the following api to get the list of attributes assigned to the user.
+
## Update user attribute
@@ -11,6 +12,7 @@ Invoke the update api for creating new or updating existing user attributes.
+
## Verify user attribute
Some attributes require confirmation for the attribute update to complete. If the attribute need to be confirmed, the result of the above api will be `confirmAttributeWithCode`. A confirmation code will be sent to the delivery medium mentioned in the delivery details.
@@ -18,9 +20,11 @@ When the user gets the confirmation code, you can present a UI to the user to en
+
## Resend verification code
If the code has expired or the user needs to resend the confirmation code, invoke the resend api as shown below:
+
diff --git a/docs/lib/auth/getting-started.md b/docs/lib/auth/getting-started.md
index a913943cade..9644df1f8b0 100644
--- a/docs/lib/auth/getting-started.md
+++ b/docs/lib/auth/getting-started.md
@@ -6,3 +6,4 @@ description: The Amplify Framework uses Amazon Cognito as the main authenticatio
+
\ No newline at end of file
diff --git a/docs/lib/auth/password_management.md b/docs/lib/auth/password_management.md
index 919d620136a..6b23896a982 100644
--- a/docs/lib/auth/password_management.md
+++ b/docs/lib/auth/password_management.md
@@ -5,3 +5,4 @@ description: Use AWS Cognito Auth plugin to update or reset user password
+
diff --git a/docs/lib/auth/signOut.md b/docs/lib/auth/signOut.md
index 10115750eea..0ff96e1a8d1 100644
--- a/docs/lib/auth/signOut.md
+++ b/docs/lib/auth/signOut.md
@@ -6,3 +6,4 @@ description: SignOut a user
+
diff --git a/docs/lib/auth/signin.md b/docs/lib/auth/signin.md
index c7a16e13110..2198dd37fa4 100644
--- a/docs/lib/auth/signin.md
+++ b/docs/lib/auth/signin.md
@@ -5,3 +5,4 @@ description: Use AWS Cognito Auth plugin to sign in a user into AWS Cognito User
+
diff --git a/docs/lib/auth/user-attributes.md b/docs/lib/auth/user-attributes.md
index 40de14967e8..078b821e0aa 100644
--- a/docs/lib/auth/user-attributes.md
+++ b/docs/lib/auth/user-attributes.md
@@ -6,3 +6,4 @@ description: Access and update user attributes
+
diff --git a/docs/lib/datastore/conflict.md b/docs/lib/datastore/conflict.md
index fa765f9e88d..248e11cbc34 100644
--- a/docs/lib/datastore/conflict.md
+++ b/docs/lib/datastore/conflict.md
@@ -3,48 +3,6 @@ title: Conflict resolution
description: Learn more about how conflict resolution in DataStore is managed and how to configure it.
---
-If data synchronization is enabled via [AppSync](https://aws.amazon.com/appsync/), there can be different versions of the same object on the client and server. Multiple clients may have updated their respective copies of an object. DataStore will converge different object versions by applying conflict detection and resolution strategies. The default resolution is called `Auto Merge`. This strategy allows collections to grow, and prefers server-side versions of single-field data. Other strategies include `Optimistic Concurrency` control and `Custom Lambda` functions. For more information, see the [AWS AppSync documentation on conflict handling](https://docs.aws.amazon.com/appsync/latest/devguide/conflict-detection-and-sync.html).
-
-## Custom conflict resolution
-
-To select a different conflict resolution strategy, navigate into your project from a terminal and run `amplify update api`. Choose *Yes* when prompted to change the conflict detection and resolution strategies.
-
-```console
-? Please select from one of the below mentioned services:
- `GraphQL`
-...
-? Do you want to configure advanced settings for the GraphQL API
- `Yes, I want to make some additional changes.`
-? Configure additional auth types?
- `No`
-? Configure conflict detection?
- `Yes`
-? Select the default resolution strategy
- Auto Merge
-❯ Optimistic Concurrency
- Custom Lambda
- Learn More
-```
-
-### Per model configuration
-
-Note that this flow will also allow you to change the strategy on each individual GraphQL type, though it is recommended to use the same strategy for your whole schema unless you have an advanced use case:
-
-```
-? Do you want to override default per model settings? Yes
-? Select the models from below:
-❯◉ Post
- ◯ PostEditor
- ◯ User
-
-? Select the resolution strategy for Post model Custom Lambda
-? Select from the options below (Use arrow keys)
-❯ Create a new Lambda Function
- Existing Lambda Function
-```
-
-## Custom configuration
-
-
-
-
+
+
+
\ No newline at end of file
diff --git a/docs/lib/datastore/data-access.md b/docs/lib/datastore/data-access.md
index 8b7c63bd3ff..c905c24abb2 100644
--- a/docs/lib/datastore/data-access.md
+++ b/docs/lib/datastore/data-access.md
@@ -2,72 +2,7 @@
title: Manipulating data
description: Learn how to save, query, paginate, update, delete and observe data in DataStore.
---
-
-## Create and update
-
-To write data to the DataStore, pass an instance of a model to `Amplify.DataStore.save()`:
-
-
-
-
-
-The `save` method creates a new record, or in the event that one already exists in the local store, it updates the record.
-
-
-
-
-
-## Delete
-
-To delete an item simply pass in an instance.
-
-
-
-
-
-## Query Data
-
-Queries are performed against the _local store_. When cloud synchronization is enabled, the local store is updated in the background by the DataStore Sync Engine.
-
-You can narrow the results of your query by specifying a model type of interest. For more advanced filtering, such as matching arbitrary field values on an object, you can supply a query predicate.
-
-
-
-
-
-### Predicates
-
-Predicates are filters that can be used to match items in the DataStore. When applied to a query(), they constrain the returned results. When applied to a save(), they act as a pre-requisite for updating the data. You can match against fields in your schema by using the following predicates:
-
-**Strings:** `eq | ne | le | lt | ge | gt | contains | notContains | beginsWith | between`
-
-**Numbers:** `eq | ne | le | lt | ge | gt | between`
-
-**Lists:** `contains | notContains`
-
-For example if you wanted a list of all `Post` Models that have a `rating` greater than 4:
-
-
-
-
-
-Multiple conditions can also be used, like the ones defined in [GraphQL Transform condition statements](~/cli/graphql-transformer/resolvers.md). For example, fetch all posts that has a rating greater than `4` and are `PUBLISHED`:
-
-
-
-
-
-Alternatively, the `or` logical operator can also be used:
-
-
-
-
-
-### Pagination
-
-Query results can also be paginated by passing in a `page` number (starting at 0) and an optional `limit` (defaults to 100). This will return a list of the first 100 items:
-
-
-
-
+
+
+
\ No newline at end of file
diff --git a/docs/lib/datastore/fragments/native_common/conflict.md b/docs/lib/datastore/fragments/native_common/conflict.md
new file mode 100644
index 00000000000..5ee4ec1a281
--- /dev/null
+++ b/docs/lib/datastore/fragments/native_common/conflict.md
@@ -0,0 +1,46 @@
+
+If data synchronization is enabled via [AppSync](https://aws.amazon.com/appsync/), there can be different versions of the same object on the client and server. Multiple clients may have updated their respective copies of an object. DataStore will converge different object versions by applying conflict detection and resolution strategies. The default resolution is called `Auto Merge`. This strategy allows collections to grow, and prefers server-side versions of single-field data. Other strategies include `Optimistic Concurrency` control and `Custom Lambda` functions. For more information, see the [AWS AppSync documentation on conflict handling](https://docs.aws.amazon.com/appsync/latest/devguide/conflict-detection-and-sync.html).
+
+## Custom conflict resolution
+
+To select a different conflict resolution strategy, navigate into your project from a terminal and run `amplify update api`. Choose *Yes* when prompted to change the conflict detection and resolution strategies.
+
+```console
+? Please select from one of the below mentioned services:
+ `GraphQL`
+...
+? Do you want to configure advanced settings for the GraphQL API
+ `Yes, I want to make some additional changes.`
+? Configure additional auth types?
+ `No`
+? Configure conflict detection?
+ `Yes`
+? Select the default resolution strategy
+ Auto Merge
+❯ Optimistic Concurrency
+ Custom Lambda
+ Learn More
+```
+
+### Per model configuration
+
+Note that this flow will also allow you to change the strategy on each individual GraphQL type, though it is recommended to use the same strategy for your whole schema unless you have an advanced use case:
+
+```
+? Do you want to override default per model settings? Yes
+? Select the models from below:
+❯◉ Post
+ ◯ PostEditor
+ ◯ User
+
+? Select the resolution strategy for Post model Custom Lambda
+? Select from the options below (Use arrow keys)
+❯ Create a new Lambda Function
+ Existing Lambda Function
+```
+
+## Custom configuration
+
+
+
+
diff --git a/docs/lib/datastore/fragments/native_common/data-access.md b/docs/lib/datastore/fragments/native_common/data-access.md
new file mode 100644
index 00000000000..cf3da799ed9
--- /dev/null
+++ b/docs/lib/datastore/fragments/native_common/data-access.md
@@ -0,0 +1,70 @@
+
+
+
+## Create and update
+
+To write data to the DataStore, pass an instance of a model to `Amplify.DataStore.save()`:
+
+
+
+
+
+The `save` method creates a new record, or in the event that one already exists in the local store, it updates the record.
+
+
+
+
+
+## Delete
+
+To delete an item simply pass in an instance.
+
+
+
+
+
+## Query Data
+
+Queries are performed against the _local store_. When cloud synchronization is enabled, the local store is updated in the background by the DataStore Sync Engine.
+
+You can narrow the results of your query by specifying a model type of interest. For more advanced filtering, such as matching arbitrary field values on an object, you can supply a query predicate.
+
+
+
+
+
+### Predicates
+
+Predicates are filters that can be used to match items in the DataStore. When applied to a query(), they constrain the returned results. When applied to a save(), they act as a pre-requisite for updating the data. You can match against fields in your schema by using the following predicates:
+
+**Strings:** `eq | ne | le | lt | ge | gt | contains | notContains | beginsWith | between`
+
+**Numbers:** `eq | ne | le | lt | ge | gt | between`
+
+**Lists:** `contains | notContains`
+
+For example if you wanted a list of all `Post` Models that have a `rating` greater than 4:
+
+
+
+
+
+Multiple conditions can also be used, like the ones defined in [GraphQL Transform condition statements](~/cli/graphql-transformer/resolvers.md). For example, fetch all posts that has a rating greater than `4` and are `PUBLISHED`:
+
+
+
+
+
+Alternatively, the `or` logical operator can also be used:
+
+
+
+
+
+### Pagination
+
+Query results can also be paginated by passing in a `page` number (starting at 0) and an optional `limit` (defaults to 100). This will return a list of the first 100 items:
+
+
+
+
diff --git a/docs/lib/datastore/fragments/native_common/getting-started.md b/docs/lib/datastore/fragments/native_common/getting-started.md
new file mode 100644
index 00000000000..2996624282e
--- /dev/null
+++ b/docs/lib/datastore/fragments/native_common/getting-started.md
@@ -0,0 +1,167 @@
+
+## Datastore with Amplify
+
+Amplify DataStore provides a programming model for leveraging shared and distributed data without writing additional code for offline and online scenarios, which makes working with distributed, cross-user data just as simple as working with local-only data.
+
+
+
+**Note:** this allows you to start persisting data locally to your device with DataStore, even without an AWS account.
+
+
+
+## Goal
+To setup and configure your application with Amplify DataStore and use it to persist data locally on a device.
+
+## Prerequisites
+
+
+
+
+
+
+
+
+There are two options to integrate the Amplify build process with the project.
+
+## Option 1: Platform integration
+
+
+
+
+
+## Option 2: Use Amplify CLI
+
+Instead of using the platform integration, you can alternatively use the Amplify CLI on its own to accomplish the same thing that Amplify Tools is doing for you. This option is particularly useful for **existing projects** where Amplify is already configured.
+
+The base structure for a DataStore app is created by adding a new GraphQL API to your app.
+
+```console
+# For new APIs
+amplify add api
+
+# For existing APIs
+amplify update api
+```
+
+During the API configuration process select **GraphQL** as the API type and reply to the questions as follows. Make sure you respond **Yes, I want to make some additional changes** when prompted for **advanced settings** and turn on **conflict detection**. This setting is **required** when syncing data to the cloud since the conflict resolution strategy is what allows local data to be reconciled with data from the cloud backend.
+
+```console
+? Please select from one of the below mentioned services:
+ `GraphQL`
+? Provide API name:
+ `BlogAppApi`
+? Choose the default authorization type for the API
+ `API key`
+? Enter a description for the API key:
+ `BlogAPIKey`
+? After how many days from now the API key should expire (1-365):
+ `365`
+? Do you want to configure advanced settings for the GraphQL API
+ `Yes, I want to make some additional changes.`
+? Configure additional auth types?
+ `No`
+? Configure conflict detection?
+ `Yes`
+? Select the default resolution strategy
+ `Auto Merge`
+? Do you have an annotated GraphQL schema?
+ `No`
+? Do you want a guided schema creation?
+ `No`
+? Provide a custom type name
+ `Post`
+```
+
+
+
+**Troubleshooting:** without the **conflict detection** configuration cloud sync will fail. In that case use `amplify update api` and choose **Enable DataStore for entire API** (this option will enable the conflict detection as described above).
+
+
+
+## Idiomatic persistence
+
+DataStore relies on platform standard data structures to represent the data schema in an idiomatic way. The persistence language is composed by data types that satisfies the `Model` interface and operations defined by common verbs such as `save`, `query` and `delete`.
+
+### Data schema
+
+The first step to create an app backed by a persistent datastore is to **define a schema**. DataStore uses GraphQL schema files as the definition of the application data model. The schema contains data types and relationships that represent the app's functionality.
+
+### Sample schema
+
+For the next steps, let's start with a schema for a small blog application. It has a single model, a `Post`. New types and constructs will be added to this base schema as more concepts are presented.
+
+Open the `schema.graphql` file located by default at `amplify/backend/{api_name}/` and **define the model** `Post` as follows.
+
+```graphql
+type Post @model {
+ id: ID!
+ title: String!
+ status: PostStatus!
+ rating: Int
+ content: String
+}
+
+enum PostStatus {
+ DRAFT
+ PUBLISHED
+}
+```
+
+Now you will to convert the platform-agnostic `schema.graphql` into platform-specific data structures. DataStore relies on code generation to guarantee schemas are correctly converted to platform code.
+
+Like the initial setup, models can be generated either using the IDE integration or Amplify CLI directly.
+
+### Code generation: Platform integration
+
+
+
+
+
+### Code generation: Amplify CLI
+
+Models can also be generated using the Amplify CLI directly.
+
+1. In your terminal, change directories to your project's folder and **execute the codegen command**:
+ ```console
+ amplify codegen models
+ ```
+2. **Locate the generated files** at `amplify/generated/models/`.
+3. **Add the files** to the Xcode project.
+
+## Initialize Amplify DataStore
+
+
+
+
+
+## Persistence operations
+
+Now the application is ready to execute persistence operations. The data will be persisted to a local database, enabling offline-first use cases by default.
+
+Even though a GraphQL API is already added to your project, the cloud synchronization will only be enabled when the API plugin is initialized and the backend provisioned. See the [Next steps](#next-steps) for more info.
+
+### Writing to the database
+
+To write to the database, create an instance of the `Post` model and save it.
+
+
+
+
+
+### Reading from the database
+
+To read from the database, the simplest approach is to query for all records of a given model type.
+
+
+
+
+
+## Next steps
+
+Congratulations! You’ve created and retrieved data from the local database. Check out the following links to see other Amplify DataStore use cases and advanced concepts:
+
+- [Write data](~/lib/datastore/data-access.md#create-and-update)
+- [Query data](~/lib/datastore/data-access.md#query-data)
+- [Model associations](~/lib/datastore/relational.md)
+- [Cloud synchronization](~/lib/datastore/sync.md)
+- [Clear local data](~/lib/datastore/sync.md#clear-local-data)
diff --git a/docs/lib/datastore/fragments/native_common/how-it-works.md b/docs/lib/datastore/fragments/native_common/how-it-works.md
new file mode 100644
index 00000000000..006579616d3
--- /dev/null
+++ b/docs/lib/datastore/fragments/native_common/how-it-works.md
@@ -0,0 +1,63 @@
+
+Amplify DataStore provides a persistent on-device storage repository for you to write, read, and observe changes to data if you are online or offline, and seamlessly sync to the cloud as well as across devices. Data modeling for your application is using GraphQL and converted to Models that are used in JavaScript, iOS, or Android applications. You can use DataStore for your offline use cases in a “local only” mode without an AWS account or provision an entire backend using AWS AppSync and Amazon DynamoDB. DataStore includes Delta Sync using your GraphQL backend and several conflict resolution strategies.
+
+## How it Works
+
+
+
+Amplify DataStore is an on device persistent repository for interacting with your local data while it synchronizes with the cloud. The core idea is to focus on your data modeling in your application with GraphQL, adding any authorization rules or business logic into your application when needed. This can be done using Amplify CLI project functionality (`amplify add auth` or `amplify add function`) as well as the [GraphQL Transformer](~/cli/graphql-transformer/overview.md).
+
+## Model data locally
+
+Starting with GraphQL schema (with or without an AWS account) a code generation process creates *Models* which are domain native constructs for a programming platform (TypeScript, Java, Swift classes). This "modelgen" process happens using the Amplify CLI which is either done manually in your terminal or using build tools that will invoke the CLI process (NPX scripts, Gradle, Xcode build phase).
+
+Once Models have been generated, you can operate on these instances with the DataStore API to save, query, update, delete, or observe changes. At runtime models are passed into a *Storage Engine* that has a *Storage Adapter*. The Storage Engine manages a "Model Repository" of Models which were defined by the developer's GraphQL schema as well as "System Models" which are used for both metadata (such as settings) and queueing updates over the network when syncing to the cloud. Amplify ships with default Storage Adapter implementations, such as SQLite and IndexedDB, however the pattern allows for more in the future for community contributions and is not specific to one technology (e.g. SQL vs NoSQL).
+
+
+
+When developer application code interacts with the DataStore API the it is the responsibility of the Storage Engine to store the specific Model for a GraphQL type in the Model Repository as well as serialize & deserialize as appropriate for persistence in the specific Storage Adapter representation. This includes conversion from a GraphQL specific type the appropriate structure in that database engine (e.g. `Int` to `Int64`).
+
+## Sync data to cloud
+
+If a developer chooses to sync with the cloud, the Amplify CLI will use the GraphQL schema to deploy an AWS AppSync backend with DynamoDB tables for each type and an additional table used for *Delta Sync*. Other AWS services such as Amazon Cognito or AWS Lambda will also be deployed if added to the project. Once this completes the local configuration for the platform (`aws-exports.js` or `amplifyconfiguration.json`) will be generated inside the project and updated with settings and endpoint information.
+
+If the DataStore starts up and sees API information to sync with an AppSync endpoint, it will start an instance of its *Sync Engine*. This component interfaces with the Storage Engine to get updates from the Model Repository. These components use an *Observer* pattern where the Sync Engine publishes events whenever updates happen in it (such as data being added, updated, or deleted) and both the DataStore API and Sync Engine subscribe to this publication stream. This is how the developer knows when updates have happened from the cloud by interacting with the DataStore API, and conversely how the Sync Engine knows when to communicate with the cloud when applications have made updates to data.
+
+
+
+As notifications come into the Sync Engine from the Storage Engine it converts information from the Model Repository into GraphQL statements at runtime. This includes subscribing to all create/update/delete operations for each type, as well as running queries or mutations.
+
+The Sync Engine will run a GraphQL query on first start that hydrates the Storage Engine from the network using a *Base Query*. This defaults to a limit of 100 items at a time and will paginate through up to 1000 items. It will then store a *Last Sync Time* and each time the device goes from an offline to online state, it will use this as an argument in a *Delta Query*. When AppSync receives this Last Sync Time in its argument list it will only returned the changes that have been missed by pulling items in a Delta Table.
+
+All items (or "objects") are versioned by *Sync Enabled Resolvers* in AppSync using monotonically increasing counters. Clients never update versions, only the service controls versions. The Sync Engine receives new items or updates from GraphQL operations and applies them with their versions to the Storage Engine. When items are updated by application code they are always written to a queue and the Sync Engine sends them to AppSync using the currently known version as an argument (`_version`) in the mutation.
+
+## Conflict resolution
+
+When multiple clients send concurrent updates using the same version and conflict resolution is configured, a strategy for conflict resolution will be entered. The default strategy for clients is Automerge where the GraphQL type information is used to inspect the update and compare it to the current item that has been written to your table. Any non-conflicting fields are merged with the item and any lists will have values appended, with the service updating the item version as appropriate. You can change this default to apply version checks to the entire object with *Optimistic Concurrency* where the latest written item to your database will be used with a version check against the incoming record, or alternatively you can use a Lambda function and apply any custom business logic you wish to the process when merging or rejecting updates. In all cases the service controls the versions. For more information on how these conflict resolution rules work please [see the AWS AppSync documentation](https://docs.aws.amazon.com/appsync/latest/devguide/conflict-detection-and-sync.html).
+
+## Writing data from the AppSync console
+
+DataStore is designed primarily for developers to not have to focus on the backend and let your application code and workflow create everything. However, there will be some use cases where you will use the AppSync console, a Lambda function, or other out of band processes to write data (such as batch actions or data migrations) and you might send GraphQL operations without the DataStore client.
+
+In these cases it's important that the selection set of your GraphQL mutation includes all the required fields of the model, including: `_lastChangedAt`, `_version`, and `_deleted` so that the DataStore clients can react to these updates. You will also need to send the **current** object version in the mutation input argument as `_version` so that the service can act accordingly. If you do not send this information the clients will still eventually catch up during the global sync process, but you will not see realtime updates to the client DataStore repositories. An example mutation:
+
+```graphql
+mutation UpdatePost {
+ updatePost(input: {
+ id: "12345"
+ title: "updated title 19:40"
+ status: ACTIVE
+ rating: 5
+ _version: 7
+ }) {
+ id
+ title
+ status
+ rating
+ _lastChangedAt
+ _version
+ _deleted
+ }
+}
+```
diff --git a/docs/lib/datastore/fragments/native_common/real-time.md b/docs/lib/datastore/fragments/native_common/real-time.md
new file mode 100644
index 00000000000..2c52e5aa4cb
--- /dev/null
+++ b/docs/lib/datastore/fragments/native_common/real-time.md
@@ -0,0 +1,8 @@
+
+## Observe Data in real-time
+
+You can subscribe to changes on your Models. This reacts dynamically to updates of data to the underlying Storage Engine, which could be the result of GraphQL Subscriptions as well as Queries or Mutations that run against the backing AppSync API if you are synchronizing with the cloud.
+
+
+
+
diff --git a/docs/lib/datastore/fragments/native_common/relational.md b/docs/lib/datastore/fragments/native_common/relational.md
new file mode 100644
index 00000000000..6f7527b341b
--- /dev/null
+++ b/docs/lib/datastore/fragments/native_common/relational.md
@@ -0,0 +1,80 @@
+
+DataStore has the capability to handle relationships between Models, such as *has one*, *has many*, *belongs to*. In GraphQL this is done with the `@connection` and `@key` directives as defined in the [GraphQL Transformer documentation](~/cli/graphql-transformer/directives.md#connection).
+
+
+
+When using the `@key` directive with DataStore, as long as you specify a `name` you can use any value(s) in `fields`. However, if the `name` property is omitted, the first item in the `fields` array must be `"id"`. E.g., `@key(fields: ["id", "content"])`.
+
+
+
+## Updated schema
+
+
+
+
+
+## Saving relations
+
+In order to save connected models you will create an instance of the model you wish to connect and pass it's ID to `DataStore.save`:
+
+
+
+
+
+## Querying relations
+
+
+
+
+
+## Deleting relations
+
+When you delete a parent object in a one to many relationship, the children will also be removed from the DataStore and mutations for this deletion will be sent over the network. For example the following operation would remove the Post with id *123* as well as any related comments:
+
+
+
+
+
+However, in a many to many relationship the children are not removed and you must explicitly delete them.
+
+### Many-to-many
+
+The above example shows how to use a *one-to-many* schema and save connected models. For *many-to-many* relations, such as the one shows in the [GraphQL Transformer examples](~/cli/graphql-transformer/directives.md#connection).
+
+In this case, you save instances of models from each side of the relationship and then join them together by connecting type on a field defined with `@connection`. Consider the following schema:
+
+```graphql
+enum PostStatus {
+ ACTIVE
+ INACTIVE
+}
+
+type Post @model {
+ id: ID!
+ title: String!
+ rating: Int
+ status: PostStatus
+ editors: [PostEditor] @connection(keyName: "byPost", fields: ["id"])
+}
+
+type PostEditor
+ @model(queries: null)
+ @key(name: "byPost", fields: ["postID", "editorID"])
+ @key(name: "byEditor", fields: ["editorID", "postID"]) {
+ id: ID!
+ postID: ID!
+ editorID: ID!
+ post: Post! @connection(fields: ["postID"])
+ editor: User! @connection(fields: ["editorID"])
+}
+
+type User @model {
+ id: ID!
+ username: String!
+ posts: [PostEditor] @connection(keyName: "byEditor", fields: ["id"])
+}
+```
+
+
+
+
diff --git a/docs/lib/datastore/fragments/native_common/schema-updates.md b/docs/lib/datastore/fragments/native_common/schema-updates.md
new file mode 100644
index 00000000000..d381fe85720
--- /dev/null
+++ b/docs/lib/datastore/fragments/native_common/schema-updates.md
@@ -0,0 +1,33 @@
+
+## Update the schema
+
+Edit the schema and re-run `amplify codegen models`.
+
+```graphql
+enum PostStatus {
+ ACTIVE
+ INACTIVE
+ STAGED # new enum value
+}
+
+type Post @model {
+ id: ID!
+ title: String!
+ rating: Int!
+ status: PostStatus!
+}
+```
+
+This will evaluate the changes and create a versioned hash if any changes are detected which impact the underlying on-device storage structure. For example, types being added/deleted or fields becoming required/optional. DataStore evaluates this version on startup and if there are changes the **local items on device will be removed and a full sync from AppSync will take place** if you are syncing with the cloud.
+
+## Local migrations
+
+Local migrations (i.e. migrations controlled by the developer) on device are not currently supported. Therefore, your local data will be lost when the schema changes.
+
+If you are syncing with the cloud the structure and items of that **data in your AppSync backend will not be touched** as part of this process.
+
+
+
+**Troubleshooting:** due to a limitation in DynamoDB, you can only add one `@key` at a time. Make sure you run `amplify push` in between changes when cloud sync is enabled.
+
+
diff --git a/docs/lib/datastore/fragments/native_common/sync.md b/docs/lib/datastore/fragments/native_common/sync.md
new file mode 100644
index 00000000000..269f306a88a
--- /dev/null
+++ b/docs/lib/datastore/fragments/native_common/sync.md
@@ -0,0 +1,95 @@
+
+Once you're happy with your application, you can start syncing with the cloud by provisioning a backend from your project. DataStore can connect to remote backend and automatically sync all locally saved data using GraphQL as a data protocol.
+
+
+
+**Best practice:** it is recommended to develop without cloud synchronization enabled initially so you can change the schema as your application takes shape without the impact of having to update the provisioned backend. Once you are satisfied with the stability of your data schema, setup cloud synchronization as described below and the data saved locally will be synchronized to the cloud automatically.
+
+
+
+## Setup cloud sync
+
+Synchronization between offline and online data can be tricky. DataStore goal is to remove that burden from the application code and handle all data consistency and reconciliation between local and remote behind the scenes, while developers focus on their application logic. Up to this point the focus was to setup a local datastore that works offline and has all the capabilities you would expect from a data persistence framework.
+
+The next step is to make sure the local saved data is synchronized with a cloud backend powered by [AWS AppSync](https://aws.amazon.com/appsync/).
+
+
+
+
+### Push the backend to the cloud
+
+By now you should have a backend created with conflict detection enabled, as described in the [Getting started](~/lib/datastore/getting-started.md) guide.
+
+**Check the status of the backend** to verify if it is already provisioned in the cloud.
+
+```console
+amplify status
+```
+
+You should see a table similar to this one.
+
+```plain
+| Category | Resource name | Operation | Provider plugin |
+| -------- | ----------------- | --------- | ----------------- |
+| Api | amplifyDatasource | No Change | awscloudformation |
+```
+
+In case `Operation` says `Create` or `Update` you need to **push the backend to the cloud**.
+
+```console
+amplify push
+```
+
+
+
+**AWS credentials needed.** At this point an AWS account is required. If you have never run `amplify configure` before, do it so and follow the steps to configure Amplify with your AWS account. Details can be found in the [Configure the Amplify CLI](~/cli/start/install.md#configure-the-amplify-cli) guide.
+
+
+
+## Existing backend
+
+DataStore can connect to an existing AWS AppSync backend that has been deployed from another project, no matter the platform it was originally created in. In these workflows it is best to work with the CLI directly by running an `amplify pull` command from your terminal and then generating models afterwards, using the process described in the [Getting started](~/lib/datastore/getting-started.md#idiomatic-persistence-models) guide.
+
+For more information on this workflow please see the [Multiple Frontends documentation](~/cli/teams/multi-frontend.md).
+
+## Distributed data
+
+When working with distributed data it is important to be mindful about the state of the local and the remote systems. DataStore tries to make that as transparent as possible to you; however, some scenarios might require some consideration
+
+For instance, when updating or deleting data, one has to consider that the state of the local data might be out-of-sync with the backend and that scenario can affect how conditions should be implemented..
+
+### Update and delete with predicate
+
+For such scenarios both the `save()` and the `delete()` APIs support an optional predicate which will be sent to the backend and executed against the remote state.
+
+
+
+
+
+There's a difference between the traditional local condition check using `if/else` constructs and the predicate in the aforementioned APIs as you can see in the example below.
+
+
+
+
+
+### Conflict detection and resolution
+
+When concurrently updating the data in multiple places, it is likely that some conflict might happen. For most of the cases the default *Auto-merge* algorithm should be able to resolve conflicts. However, there are scenarios where the algorithm won't be able to be resolved, and in these cases, a more advanced option is available and will be described in detail in the next section.
+
+## Clear local data
+
+`Amplify.DataStore.clear()` provides a way for you to clear all local data if needed. This is a destructive operation but the **remote data will remain intact**. When the next sync happens, data will be pulled into the local storage again and reconstruct the local data.
+
+One common use for `clear()` is to manage different users sharing the same device or even as a development-time utility.
+
+
+
+**Note:** In case multiple users share the same device and your schema defines user-specific data, make sure you call `Amplify.DataStore.clear()` when switching users. Visit [Auth events](~/lib/auth/auth-events.md) for all authentication related events.
+
+
+
+
+
+
+
+This is a simple yet effective example. However, in a real scenario you might want to only call `clear()` when a different user is `signedIn` in order to avoid clearing the database for a repeated sign-in of the same user.
diff --git a/docs/lib/datastore/getting-started.md b/docs/lib/datastore/getting-started.md
index 9083eaea1af..c0d4bd109aa 100644
--- a/docs/lib/datastore/getting-started.md
+++ b/docs/lib/datastore/getting-started.md
@@ -3,169 +3,6 @@ title: Getting started
description: Amplify DataStore provides a programming model for leveraging shared and distributed data without writing additional code for offline and online scenarios, which makes working with distributed, cross-user data just as simple as working with local-only data.
---
-## Datastore with Amplify
-
-Amplify DataStore provides a programming model for leveraging shared and distributed data without writing additional code for offline and online scenarios, which makes working with distributed, cross-user data just as simple as working with local-only data.
-
-
-
-**Note:** this allows you to start persisting data locally to your device with DataStore, even without an AWS account.
-
-
-
-## Goal
-To setup and configure your application with Amplify DataStore and use it to persist data locally on a device.
-
-## Prerequisites
-
-
-
-
-
-
-
-
-There are two options to integrate the Amplify build process with the project.
-
-## Option 1: Platform integration
-
-
-
-
-
-## Option 2: Use Amplify CLI
-
-Instead of using the platform integration, you can alternatively use the Amplify CLI on its own to accomplish the same thing that Amplify Tools is doing for you. This option is particularly useful for **existing projects** where Amplify is already configured.
-
-The base structure for a DataStore app is created by adding a new GraphQL API to your app.
-
-```console
-# For new APIs
-amplify add api
-
-# For existing APIs
-amplify update api
-```
-
-During the API configuration process select **GraphQL** as the API type and reply to the questions as follows. Make sure you respond **Yes, I want to make some additional changes** when prompted for **advanced settings** and turn on **conflict detection**. This setting is **required** when syncing data to the cloud since the conflict resolution strategy is what allows local data to be reconciled with data from the cloud backend.
-
-```console
-? Please select from one of the below mentioned services:
- `GraphQL`
-? Provide API name:
- `BlogAppApi`
-? Choose the default authorization type for the API
- `API key`
-? Enter a description for the API key:
- `BlogAPIKey`
-? After how many days from now the API key should expire (1-365):
- `365`
-? Do you want to configure advanced settings for the GraphQL API
- `Yes, I want to make some additional changes.`
-? Configure additional auth types?
- `No`
-? Configure conflict detection?
- `Yes`
-? Select the default resolution strategy
- `Auto Merge`
-? Do you have an annotated GraphQL schema?
- `No`
-? Do you want a guided schema creation?
- `No`
-? Provide a custom type name
- `Post`
-```
-
-
-
-**Troubleshooting:** without the **conflict detection** configuration cloud sync will fail. In that case use `amplify update api` and choose **Enable DataStore for entire API** (this option will enable the conflict detection as described above).
-
-
-
-## Idiomatic persistence
-
-DataStore relies on platform standard data structures to represent the data schema in an idiomatic way. The persistence language is composed by data types that satisfies the `Model` interface and operations defined by common verbs such as `save`, `query` and `delete`.
-
-### Data schema
-
-The first step to create an app backed by a persistent datastore is to **define a schema**. DataStore uses GraphQL schema files as the definition of the application data model. The schema contains data types and relationships that represent the app's functionality.
-
-### Sample schema
-
-For the next steps, let's start with a schema for a small blog application. It has a single model, a `Post`. New types and constructs will be added to this base schema as more concepts are presented.
-
-Open the `schema.graphql` file located by default at `amplify/backend/{api_name}/` and **define the model** `Post` as follows.
-
-```graphql
-type Post @model {
- id: ID!
- title: String!
- status: PostStatus!
- rating: Int
- content: String
-}
-
-enum PostStatus {
- DRAFT
- PUBLISHED
-}
-```
-
-Now you will to convert the platform-agnostic `schema.graphql` into platform-specific data structures. DataStore relies on code generation to guarantee schemas are correctly converted to platform code.
-
-Like the initial setup, models can be generated either using the IDE integration or Amplify CLI directly.
-
-### Code generation: Platform integration
-
-
-
-
-
-### Code generation: Amplify CLI
-
-Models can also be generated using the Amplify CLI directly.
-
-1. In your terminal, change directories to your project's folder and **execute the codegen command**:
- ```console
- amplify codegen models
- ```
-2. **Locate the generated files** at `amplify/generated/models/`.
-3. **Add the files** to the Xcode project.
-
-## Initialize Amplify DataStore
-
-
-
-
-
-## Persistence operations
-
-Now the application is ready to execute persistence operations. The data will be persisted to a local database, enabling offline-first use cases by default.
-
-Even though a GraphQL API is already added to your project, the cloud synchronization will only be enabled when the API plugin is initialized and the backend provisioned. See the [Next steps](#next-steps) for more info.
-
-### Writing to the database
-
-To write to the database, create an instance of the `Post` model and save it.
-
-
-
-
-
-### Reading from the database
-
-To read from the database, the simplest approach is to query for all records of a given model type.
-
-
-
-
-
-## Next steps
-
-Congratulations! You’ve created and retrieved data from the local database. Check out the following links to see other Amplify DataStore use cases and advanced concepts:
-
-- [Write data](~/lib/datastore/data-access.md#create-and-update)
-- [Query data](~/lib/datastore/data-access.md#query-data)
-- [Model associations](~/lib/datastore/relational.md)
-- [Cloud synchronization](~/lib/datastore/sync.md)
-- [Clear local data](~/lib/datastore/sync.md#clear-local-data)
+
+
+
\ No newline at end of file
diff --git a/docs/lib/datastore/how-it-works.md b/docs/lib/datastore/how-it-works.md
index 37ab29e7f7c..6cdcfa19ef2 100644
--- a/docs/lib/datastore/how-it-works.md
+++ b/docs/lib/datastore/how-it-works.md
@@ -3,65 +3,6 @@ title: How it works
description: Amplify DataStore provides a persistent on-device storage repository for you to write, read, and observe changes to data if you are online or offline, and seamlessly sync to the cloud as well as across devices. Learn more about how it works.
---
-Amplify DataStore provides a persistent on-device storage repository for you to write, read, and observe changes to data if you are online or offline, and seamlessly sync to the cloud as well as across devices. Data modeling for your application is using GraphQL and converted to Models that are used in JavaScript, iOS, or Android applications. You can use DataStore for your offline use cases in a “local only” mode without an AWS account or provision an entire backend using AWS AppSync and Amazon DynamoDB. DataStore includes Delta Sync using your GraphQL backend and several conflict resolution strategies.
-
-## How it Works
-
-
-
-Amplify DataStore is an on device persistent repository for interacting with your local data while it synchronizes with the cloud. The core idea is to focus on your data modeling in your application with GraphQL, adding any authorization rules or business logic into your application when needed. This can be done using Amplify CLI project functionality (`amplify add auth` or `amplify add function`) as well as the [GraphQL Transformer](~/cli/graphql-transformer/overview.md).
-
-## Model data locally
-
-Starting with GraphQL schema (with or without an AWS account) a code generation process creates *Models* which are domain native constructs for a programming platform (TypeScript, Java, Swift classes). This "modelgen" process happens using the Amplify CLI which is either done manually in your terminal or using build tools that will invoke the CLI process (NPX scripts, Gradle, Xcode build phase).
-
-Once Models have been generated, you can operate on these instances with the DataStore API to save, query, update, delete, or observe changes. At runtime models are passed into a *Storage Engine* that has a *Storage Adapter*. The Storage Engine manages a "Model Repository" of Models which were defined by the developer's GraphQL schema as well as "System Models" which are used for both metadata (such as settings) and queueing updates over the network when syncing to the cloud. Amplify ships with default Storage Adapter implementations, such as SQLite and IndexedDB, however the pattern allows for more in the future for community contributions and is not specific to one technology (e.g. SQL vs NoSQL).
-
-
-
-When developer application code interacts with the DataStore API the it is the responsibility of the Storage Engine to store the specific Model for a GraphQL type in the Model Repository as well as serialize & deserialize as appropriate for persistence in the specific Storage Adapter representation. This includes conversion from a GraphQL specific type the appropriate structure in that database engine (e.g. `Int` to `Int64`).
-
-## Sync data to cloud
-
-If a developer chooses to sync with the cloud, the Amplify CLI will use the GraphQL schema to deploy an AWS AppSync backend with DynamoDB tables for each type and an additional table used for *Delta Sync*. Other AWS services such as Amazon Cognito or AWS Lambda will also be deployed if added to the project. Once this completes the local configuration for the platform (`aws-exports.js` or `amplifyconfiguration.json`) will be generated inside the project and updated with settings and endpoint information.
-
-If the DataStore starts up and sees API information to sync with an AppSync endpoint, it will start an instance of its *Sync Engine*. This component interfaces with the Storage Engine to get updates from the Model Repository. These components use an *Observer* pattern where the Sync Engine publishes events whenever updates happen in it (such as data being added, updated, or deleted) and both the DataStore API and Sync Engine subscribe to this publication stream. This is how the developer knows when updates have happened from the cloud by interacting with the DataStore API, and conversely how the Sync Engine knows when to communicate with the cloud when applications have made updates to data.
-
-
-
-As notifications come into the Sync Engine from the Storage Engine it converts information from the Model Repository into GraphQL statements at runtime. This includes subscribing to all create/update/delete operations for each type, as well as running queries or mutations.
-
-The Sync Engine will run a GraphQL query on first start that hydrates the Storage Engine from the network using a *Base Query*. This defaults to a limit of 100 items at a time and will paginate through up to 1000 items. It will then store a *Last Sync Time* and each time the device goes from an offline to online state, it will use this as an argument in a *Delta Query*. When AppSync receives this Last Sync Time in its argument list it will only returned the changes that have been missed by pulling items in a Delta Table.
-
-All items (or "objects") are versioned by *Sync Enabled Resolvers* in AppSync using monotonically increasing counters. Clients never update versions, only the service controls versions. The Sync Engine receives new items or updates from GraphQL operations and applies them with their versions to the Storage Engine. When items are updated by application code they are always written to a queue and the Sync Engine sends them to AppSync using the currently known version as an argument (`_version`) in the mutation.
-
-## Conflict resolution
-
-When multiple clients send concurrent updates using the same version and conflict resolution is configured, a strategy for conflict resolution will be entered. The default strategy for clients is Automerge where the GraphQL type information is used to inspect the update and compare it to the current item that has been written to your table. Any non-conflicting fields are merged with the item and any lists will have values appended, with the service updating the item version as appropriate. You can change this default to apply version checks to the entire object with *Optimistic Concurrency* where the latest written item to your database will be used with a version check against the incoming record, or alternatively you can use a Lambda function and apply any custom business logic you wish to the process when merging or rejecting updates. In all cases the service controls the versions. For more information on how these conflict resolution rules work please [see the AWS AppSync documentation](https://docs.aws.amazon.com/appsync/latest/devguide/conflict-detection-and-sync.html).
-
-## Writing data from the AppSync console
-
-DataStore is designed primarily for developers to not have to focus on the backend and let your application code and workflow create everything. However, there will be some use cases where you will use the AppSync console, a Lambda function, or other out of band processes to write data (such as batch actions or data migrations) and you might send GraphQL operations without the DataStore client.
-
-In these cases it's important that the selection set of your GraphQL mutation includes all the required fields of the model, including: `_lastChangedAt`, `_version`, and `_deleted` so that the DataStore clients can react to these updates. You will also need to send the **current** object version in the mutation input argument as `_version` so that the service can act accordingly. If you do not send this information the clients will still eventually catch up during the global sync process, but you will not see realtime updates to the client DataStore repositories. An example mutation:
-
-```graphql
-mutation UpdatePost {
- updatePost(input: {
- id: "12345"
- title: "updated title 19:40"
- status: ACTIVE
- rating: 5
- _version: 7
- }) {
- id
- title
- status
- rating
- _lastChangedAt
- _version
- _deleted
- }
-}
-```
+
+
+
\ No newline at end of file
diff --git a/docs/lib/datastore/real-time.md b/docs/lib/datastore/real-time.md
index 24ce8e1e820..9de996d764d 100644
--- a/docs/lib/datastore/real-time.md
+++ b/docs/lib/datastore/real-time.md
@@ -3,10 +3,7 @@ title: Real time
description: Learn more about how DataStore handles data changes in real-time.
---
-## Observe Data in real-time
+
+
+## Observe Data in real-time
-You can subscribe to changes on your Models. This reacts dynamically to updates of data to the underlying Storage Engine, which could be the result of GraphQL Subscriptions as well as Queries or Mutations that run against the backing AppSync API if you are synchronizing with the cloud.
-
-
-
-
diff --git a/docs/lib/datastore/relational.md b/docs/lib/datastore/relational.md
index dc257de1927..0e41d225db9 100644
--- a/docs/lib/datastore/relational.md
+++ b/docs/lib/datastore/relational.md
@@ -3,82 +3,6 @@ title: Relational models
description: Learn more about how DataStore handles relationships between Models, such as "has one", "has many", "belongs to".
---
-DataStore has the capability to handle relationships between Models, such as *has one*, *has many*, *belongs to*. In GraphQL this is done with the `@connection` and `@key` directives as defined in the [GraphQL Transformer documentation](~/cli/graphql-transformer/directives.md#connection).
-
-
-
-When using the `@key` directive with DataStore, as long as you specify a `name` you can use any value(s) in `fields`. However, if the `name` property is omitted, the first item in the `fields` array must be `"id"`. E.g., `@key(fields: ["id", "content"])`.
-
-
-
-## Updated schema
-
-
-
-
-
-## Saving relations
-
-In order to save connected models you will create an instance of the model you wish to connect and pass it's ID to `DataStore.save`:
-
-
-
-
-
-## Querying relations
-
-
-
-
-
-## Deleting relations
-
-When you delete a parent object in a one to many relationship, the children will also be removed from the DataStore and mutations for this deletion will be sent over the network. For example the following operation would remove the Post with id *123* as well as any related comments:
-
-
-
-
-
-However, in a many to many relationship the children are not removed and you must explicitly delete them.
-
-### Many-to-many
-
-The above example shows how to use a *one-to-many* schema and save connected models. For *many-to-many* relations, such as the one shows in the [GraphQL Transformer examples](~/cli/graphql-transformer/directives.md#connection).
-
-In this case, you save instances of models from each side of the relationship and then join them together by connecting type on a field defined with `@connection`. Consider the following schema:
-
-```graphql
-enum PostStatus {
- ACTIVE
- INACTIVE
-}
-
-type Post @model {
- id: ID!
- title: String!
- rating: Int
- status: PostStatus
- editors: [PostEditor] @connection(keyName: "byPost", fields: ["id"])
-}
-
-type PostEditor
- @model(queries: null)
- @key(name: "byPost", fields: ["postID", "editorID"])
- @key(name: "byEditor", fields: ["editorID", "postID"]) {
- id: ID!
- postID: ID!
- editorID: ID!
- post: Post! @connection(fields: ["postID"])
- editor: User! @connection(fields: ["editorID"])
-}
-
-type User @model {
- id: ID!
- username: String!
- posts: [PostEditor] @connection(keyName: "byEditor", fields: ["id"])
-}
-```
-
-
-
-
+
+
+
\ No newline at end of file
diff --git a/docs/lib/datastore/schema-updates.md b/docs/lib/datastore/schema-updates.md
index ef09229f717..9ef194110f5 100644
--- a/docs/lib/datastore/schema-updates.md
+++ b/docs/lib/datastore/schema-updates.md
@@ -3,35 +3,6 @@ title: Schema updates
description: Learn more about how to issue schema updates for DataStore
---
-## Update the schema
-
-Edit the schema and re-run `amplify codegen models`.
-
-```graphql
-enum PostStatus {
- ACTIVE
- INACTIVE
- STAGED # new enum value
-}
-
-type Post @model {
- id: ID!
- title: String!
- rating: Int!
- status: PostStatus!
-}
-```
-
-This will evaluate the changes and create a versioned hash if any changes are detected which impact the underlying on-device storage structure. For example, types being added/deleted or fields becoming required/optional. DataStore evaluates this version on startup and if there are changes the **local items on device will be removed and a full sync from AppSync will take place** if you are syncing with the cloud.
-
-## Local migrations
-
-Local migrations (i.e. migrations controlled by the developer) on device are not currently supported. Therefore, your local data will be lost when the schema changes.
-
-If you are syncing with the cloud the structure and items of that **data in your AppSync backend will not be touched** as part of this process.
-
-
-
-**Troubleshooting:** due to a limitation in DynamoDB, you can only add one `@key` at a time. Make sure you run `amplify push` in between changes when cloud sync is enabled.
-
-
+
+
+
\ No newline at end of file
diff --git a/docs/lib/datastore/sync.md b/docs/lib/datastore/sync.md
index becdceb936c..89cb14ca562 100644
--- a/docs/lib/datastore/sync.md
+++ b/docs/lib/datastore/sync.md
@@ -3,97 +3,6 @@ title: Syncing data to cloud
description: Learn more about how DataStore connects to an AppSync backend and automatically syncs all locally saved data using GraphQL.
---
-Once you're happy with your application, you can start syncing with the cloud by provisioning a backend from your project. DataStore can connect to remote backend and automatically sync all locally saved data using GraphQL as a data protocol.
-
-
-
-**Best practice:** it is recommended to develop without cloud synchronization enabled initially so you can change the schema as your application takes shape without the impact of having to update the provisioned backend. Once you are satisfied with the stability of your data schema, setup cloud synchronization as described below and the data saved locally will be synchronized to the cloud automatically.
-
-
-
-## Setup cloud sync
-
-Synchronization between offline and online data can be tricky. DataStore goal is to remove that burden from the application code and handle all data consistency and reconciliation between local and remote behind the scenes, while developers focus on their application logic. Up to this point the focus was to setup a local datastore that works offline and has all the capabilities you would expect from a data persistence framework.
-
-The next step is to make sure the local saved data is synchronized with a cloud backend powered by [AWS AppSync](https://aws.amazon.com/appsync/).
-
-
-
-
-### Push the backend to the cloud
-
-By now you should have a backend created with conflict detection enabled, as described in the [Getting started](~/lib/datastore/getting-started.md) guide.
-
-**Check the status of the backend** to verify if it is already provisioned in the cloud.
-
-```console
-amplify status
-```
-
-You should see a table similar to this one.
-
-```plain
-| Category | Resource name | Operation | Provider plugin |
-| -------- | ----------------- | --------- | ----------------- |
-| Api | amplifyDatasource | No Change | awscloudformation |
-```
-
-In case `Operation` says `Create` or `Update` you need to **push the backend to the cloud**.
-
-```console
-amplify push
-```
-
-
-
-**AWS credentials needed.** At this point an AWS account is required. If you have never run `amplify configure` before, do it so and follow the steps to configure Amplify with your AWS account. Details can be found in the [Configure the Amplify CLI](~/cli/start/install.md#configure-the-amplify-cli) guide.
-
-
-
-## Existing backend
-
-DataStore can connect to an existing AWS AppSync backend that has been deployed from another project, no matter the platform it was originally created in. In these workflows it is best to work with the CLI directly by running an `amplify pull` command from your terminal and then generating models afterwards, using the process described in the [Getting started](~/lib/datastore/getting-started.md#idiomatic-persistence-models) guide.
-
-For more information on this workflow please see the [Multiple Frontends documentation](~/cli/teams/multi-frontend.md).
-
-## Distributed data
-
-When working with distributed data it is important to be mindful about the state of the local and the remote systems. DataStore tries to make that as transparent as possible to you; however, some scenarios might require some consideration
-
-For instance, when updating or deleting data, one has to consider that the state of the local data might be out-of-sync with the backend and that scenario can affect how conditions should be implemented..
-
-### Update and delete with predicate
-
-For such scenarios both the `save()` and the `delete()` APIs support an optional predicate which will be sent to the backend and executed against the remote state.
-
-
-
-
-
-There's a difference between the traditional local condition check using `if/else` constructs and the predicate in the aforementioned APIs as you can see in the example below.
-
-
-
-
-
-### Conflict detection and resolution
-
-When concurrently updating the data in multiple places, it is likely that some conflict might happen. For most of the cases the default *Auto-merge* algorithm should be able to resolve conflicts. However, there are scenarios where the algorithm won't be able to be resolved, and in these cases, a more advanced option is available and will be described in detail in the next section.
-
-## Clear local data
-
-`Amplify.DataStore.clear()` provides a way for you to clear all local data if needed. This is a destructive operation but the **remote data will remain intact**. When the next sync happens, data will be pulled into the local storage again and reconstruct the local data.
-
-One common use for `clear()` is to manage different users sharing the same device or even as a development-time utility.
-
-
-
-**Note:** In case multiple users share the same device and your schema defines user-specific data, make sure you call `Amplify.DataStore.clear()` when switching users. Visit [Auth events](~/lib/auth/auth-events.md) for all authentication related events.
-
-
-
-
-
-
-
-This is a simple yet effective example. However, in a real scenario you might want to only call `clear()` when a different user is `signedIn` in order to avoid clearing the database for a repeated sign-in of the same user.
+
+
+
\ No newline at end of file
diff --git a/docs/lib/graphqlapi/concepts.md b/docs/lib/graphqlapi/concepts.md
index 2f11a188d9f..83527239442 100644
--- a/docs/lib/graphqlapi/concepts.md
+++ b/docs/lib/graphqlapi/concepts.md
@@ -3,40 +3,6 @@ title: Concepts
description: Learn more about the foundation concepts of Amplify Framework's API category.
---
-## AWS AppSync
-
-The Amplify Framework uses AWS AppSync, a managed service that uses GraphQL to make it easy for applications to get exactly the data they need. With AppSync, you can build scalable applications, including those requiring real-time updates, on a range of data sources such as NoSQL data stores, relational databases, HTTP APIs, and your custom data sources with AWS Lambda.
-
-For mobile and web apps, AppSync additionally provides SDKs that support local data access when devices go offline, and data synchronization with customizable conflict resolution, when they are back online.
-
-### The API Category
-
-The API category provides a solution for making HTTP requests to both GraphQL as well as REST endpoints. It includes a [AWS Signature Version 4](http://docs.aws.amazon.com/general/latest/gr/signature-version-4.html) signer class which automatically signs all AWS API requests for you as well as methods to use API Keys, Amazon Cognito User Pools, or 3rd party OIDC providers.
-
-The AWS Amplify API module supports AWS AppSync or any other GraphQL backends.
-
-
-
-To learn more about GraphQL, please visit the [GraphQL website](http://graphql.org/learn/).
-
-
-
-## Using AWS AppSync
-
-AWS AppSync helps you build data-driven apps with real-time and offline capabilities. Learn more about [AWS AppSync](https://aws.amazon.com/appsync/) by visiting [AWS AppSync Developer Guide](https://docs.aws.amazon.com/appsync/latest/devguide/welcome.html).
-
-The Amplify Framework offers three SDK options for AppSync.
-
-__[Amplify GraphQL client](~/lib/graphqlapi/query-data.md)__ - a light weight option if you're looking for a simple way to leverage GraphQL features and do not need the offline capabilities or caching. If you need those features, please look at [Amplify DataStore](~/lib/datastore/getting-started.md).
-
-__[Amplify DataStore](~/lib/datastore/getting-started.md)__ - makes it easy to build apps that need to support offline and low-latency scenarios. DataStore also makes working with distributed, cross-user data just as simple as working with local-only data by providing a programming model for leveraging shared and distributed data without writing additional code.
-
-__[AWS AppSync SDK](https://github.com/awslabs/aws-mobile-appsync-sdk-js/)__ - provides offline support and enables you to integrate your app with the AWS AppSync service and integrates with the Apollo client found [here](https://github.com/apollographql/apollo-client/).
-
-You can integrate with AWS AppSync using the following steps:
-
-1. Set up the API endpoint and authentication information in the client side configuration.
-2. Generate TypeScript/JavaScript code from the API schema. (optional)
-3. Write app code to run queries, mutations and subscriptions.
-
-The Amplify CLI provides support for AppSync that make this process easy. Using the CLI, you can configure an AWS AppSync API, download required client side configuration files, and generate client side code within minutes by running a few simple commands on the command line.
\ No newline at end of file
+
+
+
diff --git a/docs/lib/graphqlapi/fragments/native_common/concepts.md b/docs/lib/graphqlapi/fragments/native_common/concepts.md
new file mode 100644
index 00000000000..12dafa0224b
--- /dev/null
+++ b/docs/lib/graphqlapi/fragments/native_common/concepts.md
@@ -0,0 +1,38 @@
+
+## AWS AppSync
+
+The Amplify Framework uses AWS AppSync, a managed service that uses GraphQL to make it easy for applications to get exactly the data they need. With AppSync, you can build scalable applications, including those requiring real-time updates, on a range of data sources such as NoSQL data stores, relational databases, HTTP APIs, and your custom data sources with AWS Lambda.
+
+For mobile and web apps, AppSync additionally provides SDKs that support local data access when devices go offline, and data synchronization with customizable conflict resolution, when they are back online.
+
+### The API Category
+
+The API category provides a solution for making HTTP requests to both GraphQL as well as REST endpoints. It includes a [AWS Signature Version 4](http://docs.aws.amazon.com/general/latest/gr/signature-version-4.html) signer class which automatically signs all AWS API requests for you as well as methods to use API Keys, Amazon Cognito User Pools, or 3rd party OIDC providers.
+
+The AWS Amplify API module supports AWS AppSync or any other GraphQL backends.
+
+
+
+To learn more about GraphQL, please visit the [GraphQL website](http://graphql.org/learn/).
+
+
+
+## Using AWS AppSync
+
+AWS AppSync helps you build data-driven apps with real-time and offline capabilities. Learn more about [AWS AppSync](https://aws.amazon.com/appsync/) by visiting [AWS AppSync Developer Guide](https://docs.aws.amazon.com/appsync/latest/devguide/welcome.html).
+
+The Amplify Framework offers three SDK options for AppSync.
+
+__[Amplify GraphQL client](~/lib/graphqlapi/query-data.md)__ - a light weight option if you're looking for a simple way to leverage GraphQL features and do not need the offline capabilities or caching. If you need those features, please look at [Amplify DataStore](~/lib/datastore/getting-started.md).
+
+__[Amplify DataStore](~/lib/datastore/getting-started.md)__ - makes it easy to build apps that need to support offline and low-latency scenarios. DataStore also makes working with distributed, cross-user data just as simple as working with local-only data by providing a programming model for leveraging shared and distributed data without writing additional code.
+
+__[AWS AppSync SDK](https://github.com/awslabs/aws-mobile-appsync-sdk-js/)__ - provides offline support and enables you to integrate your app with the AWS AppSync service and integrates with the Apollo client found [here](https://github.com/apollographql/apollo-client/).
+
+You can integrate with AWS AppSync using the following steps:
+
+1. Set up the API endpoint and authentication information in the client side configuration.
+2. Generate TypeScript/JavaScript code from the API schema. (optional)
+3. Write app code to run queries, mutations and subscriptions.
+
+The Amplify CLI provides support for AppSync that make this process easy. Using the CLI, you can configure an AWS AppSync API, download required client side configuration files, and generate client side code within minutes by running a few simple commands on the command line.
\ No newline at end of file
diff --git a/docs/lib/lib.md b/docs/lib/lib.md
index 81ccce4feea..c06e664df96 100644
--- a/docs/lib/lib.md
+++ b/docs/lib/lib.md
@@ -9,4 +9,5 @@ The Amplify open-source client libraries provide use-case centric, opinionated,
-
+
+
\ No newline at end of file
diff --git a/docs/lib/project-setup/create-application.md b/docs/lib/project-setup/create-application.md
index 1d79bcf01a0..e0a348ab13f 100644
--- a/docs/lib/project-setup/create-application.md
+++ b/docs/lib/project-setup/create-application.md
@@ -4,3 +4,4 @@ description: Project setup for Amplify prior to adding category specific example
---
+
\ No newline at end of file
diff --git a/docs/lib/project-setup/fragments/flutter/create-application/10_createProject.md b/docs/lib/project-setup/fragments/flutter/create-application/10_createProject.md
new file mode 100644
index 00000000000..21ae5203bce
--- /dev/null
+++ b/docs/lib/project-setup/fragments/flutter/create-application/10_createProject.md
@@ -0,0 +1,17 @@
+**Open Android Studio.** Select **+ Start a new Flutter project**
+
+
+
+ In **Select a Project Template**, select **Flutter Application**. Press **Next**.
+
+Next, configure your project:
+
+1. Enter *MyAmplifyApp* in the **Name** field
+2. Make sure your Flutter SDK path is set correctly to where it is installed on your machine
+3. Press **Next**. On the next screen, press **Finish**.
+
+ 
+
+Android Studio will open your project with a tab opened to *main.dart*
+
+You now have an empty Flutter project into which you'll add Amplify in the next steps.
diff --git a/docs/lib/project-setup/fragments/flutter/create-application/20_pubspec.md b/docs/lib/project-setup/fragments/flutter/create-application/20_pubspec.md
new file mode 100644
index 00000000000..add8b79d4f1
--- /dev/null
+++ b/docs/lib/project-setup/fragments/flutter/create-application/20_pubspec.md
@@ -0,0 +1,29 @@
+Amplify for Flutter is distributed via **pub.dev**.
+
+Open your **app**'s `pubspec.yaml` and add the following 3 dependencies below the line "sdk:flutter".
+
+```yaml
+dependencies:
+ flutter:
+ sdk: flutter
+
+ amplify_core: '<1.0.0'
+ amplify_auth_cognito: '<1.0.0'
+ amplify_analytics_pinpoint: '<1.0.0'
+```
+
+Run **Flutter Pub Get**
+
+Android Studio requires you to sync your project with your new configuration. To do this, you can click **Flutter** in the notification bar above the file editor.
+
+
+
+Alternatively, you can open a terminal window, cd into your project's root directory (where you pubspec.yaml is) and run:
+
+```bash
+flutter pub get
+```
+
+When complete, you will see *Process finished with exit code 0* in the output of the *Messages* tab at the bottom of your screen.
+
+
\ No newline at end of file
diff --git a/docs/lib/project-setup/fragments/flutter/create-application/30_provisionBackend.md b/docs/lib/project-setup/fragments/flutter/create-application/30_provisionBackend.md
new file mode 100644
index 00000000000..e76193b1332
--- /dev/null
+++ b/docs/lib/project-setup/fragments/flutter/create-application/30_provisionBackend.md
@@ -0,0 +1,31 @@
+To start provisioning resources in the backend, change directories to your project directory and run `amplify init`:
+
+```bash
+amplify init
+```
+
+Enter the following when prompted:
+
+```console
+? Enter a name for the environment
+ `dev`
+? Choose your default editor:
+ `IntelliJ IDEA`
+? Choose the type of app that you're building:
+ 'flutter'
+⚠️ Flutter project support in the Amplify CLI is in DEVELOPER PREVIEW.
+Only the following categories are supported:
+ * Auth
+ * Analytics
+ * Storage
+? Where do you want to store your configuration file?
+ ./lib/
+? Do you want to use an AWS profile?
+ `Yes`
+? Please choose the profile you want to use
+ `default`
+```
+
+Upon successfully running `amplify init`, you will see a configuration file created in `./lib/` called `amplifyconfiguration.dart`.
+
+This file will be bundled into your application so that the Amplify libraries know how to reach your provisioned backend resources at runtime.
\ No newline at end of file
diff --git a/docs/lib/project-setup/fragments/flutter/create-application/40_verifyAmplifyLibraries.md b/docs/lib/project-setup/fragments/flutter/create-application/40_verifyAmplifyLibraries.md
new file mode 100644
index 00000000000..191b2021f54
--- /dev/null
+++ b/docs/lib/project-setup/fragments/flutter/create-application/40_verifyAmplifyLibraries.md
@@ -0,0 +1,29 @@
+
+Before using any methods in the Amplify Flutter Library, it's important to add all necessary plugins and to call configure. These init methods should only be called once at the root level of your flutter app.
+
+Add the following method to your application and call it:
+
+```dart
+void _configureAmplify() async {
+ if (!mounted) return;
+
+ // Add Pinpoint and Cognito Plugins, or any other plugins you want to use
+ AmplifyAnalyticsPinpointPlugin analyticsPlugin = new AmplifyAnalyticsPinpointPlugin();
+ AmplifyAuthCognito authPlugin = new AmplifyAuthCognito();
+ amplifyInstance.addPlugin(authPlugins: [authPlugin]);
+ amplifyInstance.addPlugin(analyticsPlugins: [analyticsPlugin]);
+
+ // Once Plugins are added, configure Amplify
+ await amplifyInstance.configure(amplifyconfig);
+ try {
+ setState(() {
+ _amplifyConfigured = true;
+ });
+ } catch (e) {
+ print(e);
+ }
+
+}
+```
+
+Note that all calls to `addPlugin` are made before `amplify.configure` is called.
\ No newline at end of file
diff --git a/docs/lib/project-setup/fragments/flutter/create-application/50_nextSteps.md b/docs/lib/project-setup/fragments/flutter/create-application/50_nextSteps.md
new file mode 100644
index 00000000000..1bf85a88498
--- /dev/null
+++ b/docs/lib/project-setup/fragments/flutter/create-application/50_nextSteps.md
@@ -0,0 +1,5 @@
+Congratulations! You've created a skeleton app and are ready to start adding Amplify categories to your application. The following are some categories that you can start to build into your application:
+
+* [Analytics](~/lib/analytics/getting-started.md) - for logging metrics and understanding your users
+* [Authentication](~/lib/auth/getting-started.md) - for managing your users
+* [Storage](~/lib/storage/getting-started.md) - store complex objects like pictures and videos to the cloud.
diff --git a/docs/lib/project-setup/fragments/flutter/prereq/cliInstall.md b/docs/lib/project-setup/fragments/flutter/prereq/cliInstall.md
new file mode 100644
index 00000000000..04523b789b9
--- /dev/null
+++ b/docs/lib/project-setup/fragments/flutter/prereq/cliInstall.md
@@ -0,0 +1,3 @@
+```bash
+npm install -g @aws-amplify/cli@flutter-preview
+```
\ No newline at end of file
diff --git a/docs/lib/project-setup/fragments/flutter/prereq/prereq.md b/docs/lib/project-setup/fragments/flutter/prereq/prereq.md
new file mode 100644
index 00000000000..95c02dcafbc
--- /dev/null
+++ b/docs/lib/project-setup/fragments/flutter/prereq/prereq.md
@@ -0,0 +1 @@
+- [Flutter SDK](https://flutter.dev/docs/get-started/install) version >= 1.20
\ No newline at end of file
diff --git a/docs/lib/project-setup/fragments/native_common/create-application/common.md b/docs/lib/project-setup/fragments/native_common/create-application/common.md
index f0220f6b5e6..0ee79d1aef6 100644
--- a/docs/lib/project-setup/fragments/native_common/create-application/common.md
+++ b/docs/lib/project-setup/fragments/native_common/create-application/common.md
@@ -8,24 +8,29 @@ Setup a skeleton project so that Amplify categories can be added to it
+
### 2. Install Amplify Libraries
+
### 3. Provision the backend with Amplify CLI
+
### 4. Initialize Amplify in the application
+
### Next steps
-
\ No newline at end of file
+
+
\ No newline at end of file
diff --git a/docs/lib/project-setup/fragments/native_common/prereq/cliInstall.md b/docs/lib/project-setup/fragments/native_common/prereq/cliInstall.md
new file mode 100644
index 00000000000..6522c564e4d
--- /dev/null
+++ b/docs/lib/project-setup/fragments/native_common/prereq/cliInstall.md
@@ -0,0 +1,3 @@
+```bash
+npm install -g @aws-amplify/cli
+```
\ No newline at end of file
diff --git a/docs/lib/project-setup/fragments/native_common/prereq/common_body.md b/docs/lib/project-setup/fragments/native_common/prereq/common_body.md
index a8bb04c8d9d..655430baa78 100644
--- a/docs/lib/project-setup/fragments/native_common/prereq/common_body.md
+++ b/docs/lib/project-setup/fragments/native_common/prereq/common_body.md
@@ -20,9 +20,9 @@ Watch the video below to learn how to install and configure the Amplify CLI or s
>
### Option 2: Follow the instructions
-```bash
-npm install -g @aws-amplify/cli
-```
+
+
+
> Because we're installing the Amplify CLI globally, you might need to run the command above with `sudo`.
diff --git a/docs/lib/project-setup/prereq.md b/docs/lib/project-setup/prereq.md
index 044fb8fd401..423c324bc46 100644
--- a/docs/lib/project-setup/prereq.md
+++ b/docs/lib/project-setup/prereq.md
@@ -5,9 +5,12 @@ description: Project Setup with Amplify Framework - Prerequisites
+
+
+
diff --git a/docs/lib/storage/configureaccess.md b/docs/lib/storage/configureaccess.md
index ddaaa25434d..544238d1226 100644
--- a/docs/lib/storage/configureaccess.md
+++ b/docs/lib/storage/configureaccess.md
@@ -6,3 +6,4 @@ description: Learn about configuring different access levels in Amplify Storage.
+
diff --git a/docs/lib/storage/download.md b/docs/lib/storage/download.md
index 374f029fe96..80475d6e0e9 100644
--- a/docs/lib/storage/download.md
+++ b/docs/lib/storage/download.md
@@ -6,3 +6,4 @@ description: Learn more about how to download / retrieve files using the Storage
+
diff --git a/docs/lib/storage/existing-resources.md b/docs/lib/storage/existing-resources.md
index 996bed67151..dad8fc12d91 100644
--- a/docs/lib/storage/existing-resources.md
+++ b/docs/lib/storage/existing-resources.md
@@ -5,3 +5,4 @@ description: Configure the Amplify Libraries to use an existing Amazon S3 bucket
+
\ No newline at end of file
diff --git a/docs/lib/storage/fragments/flutter/configureaccess.md b/docs/lib/storage/fragments/flutter/configureaccess.md
new file mode 100644
index 00000000000..2d7dbc64991
--- /dev/null
+++ b/docs/lib/storage/fragments/flutter/configureaccess.md
@@ -0,0 +1,92 @@
+ When adding the Storage category, you configure the level of access authenticated and guest users have to your S3 bucket. Additionally, when uploading files using the Storage category, you can specify the access level for that file to be either guest(public), protected, or private.
+
+- **Guest** Accessible by all users
+- **Protected** Readable by all users, but only writable by the creating user
+- **Private** Readable and writable only by the creating user
+
+For protected and private access, the `user_id` in the prefix corresponds to the unique ID for the creating user.
+
+
+
+The default access level for the Storage category is **guest**. Unless you specify otherwise, all uploaded files will be publicly available for all users.
+
+
+
+## Protected access
+
+Create an options object specifying the protected access level to allow other users to read the object:
+
+```dart
+try {
+ // use a file selection mechanism of your choice
+ File file = await FilePicker.getFile(type: FileType.image);
+ final key = new DateTime.now().toString();
+ final local = file.absolute.path;
+ S3UploadFileOptions options = S3UploadFileOptions(
+ accessLevel: StorageAccessLevel.protected
+ );
+ UploadFileResult result = await Amplify.Storage.uploadFile(
+ key: key,
+ local: local,
+ options: options
+ );
+} catch (e) {
+ print(e.toString());
+}
+```
+
+For other users to read the file, you must specify the user ID of the creating user in the passed options:
+
+```dart
+try {
+ S3DownloadFileOptions options = S3DownloadFileOptions(
+ targetIdentityId: "userId",
+ accessLevel: StorageAccessLevel.protected
+ );
+ DownloadFileResult result = await Amplify.Storage.downloadFile(
+ key: key,
+ local: new File('$path/download.png')
+ options: options
+ );
+} catch (e) {
+ print(e.toString());
+}
+```
+
+## Private Access
+
+Create an options object specifying the private access level to only allow an object to be accessed by the creating user
+
+```dart
+try {
+ // use a file selection mechanism of your choice
+ File file = await FilePicker.getFile(type: FileType.image);
+ final key = new DateTime.now().toString();
+ final local = file.absolute.path;
+ S3UploadFileOptions options = S3UploadFileOptions(accessLevel: StorageAccessLevel.private);
+ UploadFileResult result = await Amplify.Storage.uploadFile(
+ key: key,
+ local: local,
+ options: options
+ );
+} catch (e) {
+ print(e.toString());
+}
+```
+
+For the user to read the file, you must specify the user ID of the creating user in the passed options:
+
+```dart
+try {
+ S3DownloadFileOptions options = S3DownloadFileOptions(
+ targetIdentityId: "userId",
+ accessLevel: StorageAccessLevel.private
+ );
+ DownloadFileResult result = await Amplify.Storage.downloadFile(
+ key: key,
+ local: new File('$path/download.png')
+ options: options
+ );
+} catch (e) {
+ print(e.toString());
+}
diff --git a/docs/lib/storage/fragments/flutter/download.md b/docs/lib/storage/fragments/flutter/download.md
new file mode 100644
index 00000000000..9734a873226
--- /dev/null
+++ b/docs/lib/storage/fragments/flutter/download.md
@@ -0,0 +1,12 @@
+If you uploaded the data using the key `ExampleKey`, you can retrieve the data using `Amplify.Storage.downloadFile`.
+
+```dart
+try {
+ DownloadFileResult result = await Amplify.Storage.downloadFile(
+ key: 'ExampleKey',
+ local: new File('$path/download.png')
+ );
+} catch (e) {
+ print(e.toString());
+}
+```
diff --git a/docs/lib/storage/fragments/flutter/existing-resources.md b/docs/lib/storage/fragments/flutter/existing-resources.md
new file mode 100644
index 00000000000..0f050bbad64
--- /dev/null
+++ b/docs/lib/storage/fragments/flutter/existing-resources.md
@@ -0,0 +1,19 @@
+An existing Amazon S3 bucket can be used with the Amplify Libraries by referencing it in your `amplifyconfiguration.dart` file.
+
+```dart
+const amplifyconfig = ''' {
+ "UserAgent": "aws-amplify-cli/2.0",
+ "Version": "1.0",
+ "storage": {
+ "plugins": {
+ "awsS3StoragePlugin": {
+ "bucket": "[BUCKET NAME]",
+ "region": "[REGION]"
+ }
+ }
+ }
+}''';
+```
+
+- **bucket**: Name of the bucket to use for storage
+- **region**: AWS Region where the bucket is provisioned (e.g. *us-east-1*)
\ No newline at end of file
diff --git a/docs/lib/storage/fragments/flutter/getting-started/10_preReq.md b/docs/lib/storage/fragments/flutter/getting-started/10_preReq.md
new file mode 100644
index 00000000000..450b71c861f
--- /dev/null
+++ b/docs/lib/storage/fragments/flutter/getting-started/10_preReq.md
@@ -0,0 +1,2 @@
+* A Flutter application targeting Flutter SDK >= 1.20 with Amplify libraries integrated
+ * For a full example of please follow the [project setup walkthrough](~/lib/project-setup/create-application.md)
diff --git a/docs/lib/storage/fragments/flutter/getting-started/20_installLib.md b/docs/lib/storage/fragments/flutter/getting-started/20_installLib.md
new file mode 100644
index 00000000000..8b01194d698
--- /dev/null
+++ b/docs/lib/storage/fragments/flutter/getting-started/20_installLib.md
@@ -0,0 +1,9 @@
+Add the following dependency to your **app**'s `pubspec.yaml` along with others you added above in **Prerequisites**:
+
+```yaml
+dependencies:
+ flutter:
+ sdk: flutter
+ amplify_storage_s3: '<1.0.0'
+}
+```
diff --git a/docs/lib/storage/fragments/flutter/getting-started/30_initStorage.md b/docs/lib/storage/fragments/flutter/getting-started/30_initStorage.md
new file mode 100644
index 00000000000..09ed4f6125f
--- /dev/null
+++ b/docs/lib/storage/fragments/flutter/getting-started/30_initStorage.md
@@ -0,0 +1,11 @@
+To initialize the Amplify Auth and Storage categories you call `Amplify.addPlugin()` method for each category. To complete initialization call `Amplify.configure()`.
+
+```dart
+// Add this line, to include the Auth plugin.
+AmplifyAuthCognito auth = AmplifyAuthCognito();
+AmplifyStorageS3 storage = AmplifyStorageS3();
+amplify.addPlugin(
+ authPlugins: [auth],
+ storagePlugins: [storage]
+);
+```
\ No newline at end of file
diff --git a/docs/lib/storage/fragments/flutter/getting-started/40_upload.md b/docs/lib/storage/fragments/flutter/getting-started/40_upload.md
new file mode 100644
index 00000000000..25a9dcb1b56
--- /dev/null
+++ b/docs/lib/storage/fragments/flutter/getting-started/40_upload.md
@@ -0,0 +1,12 @@
+```dart
+void uploadFile() async {
+ // use a file selection mechanism of your choice
+ File file = await FilePicker.getFile(type: FileType.image);
+ final key = new DateTime.now().toString();
+ final local = file.absolute.path;
+ UploadFileResult result = await Amplify.Storage.uploadFile(
+ key: key,
+ local: local
+ );
+}
+```
diff --git a/docs/lib/storage/fragments/flutter/list.md b/docs/lib/storage/fragments/flutter/list.md
new file mode 100644
index 00000000000..4e9ff112cb3
--- /dev/null
+++ b/docs/lib/storage/fragments/flutter/list.md
@@ -0,0 +1,26 @@
+You can list all of the objects uploaded under a given prefix. This will list all public files:
+
+```dart
+try {
+ ListResult res = await Amplify.Storage.list();
+} catch (e) {
+ print(e.toString());
+}
+```
+
+You can also list private or protected files by passing options. For example, to list all protected files owned by a user identified by the ID `otherUserID`:
+
+```dart
+try {
+ S3ListOptions options = S3ListOptions(
+ targetIdentityId: "otherUserID",
+ accessLevel: StorageAccessLevel.protected
+ );
+
+ ListResult res = await Amplify.Storage.list(
+ options: options
+ );
+} catch (e) {
+ print(e.toString());
+}
+```
diff --git a/docs/lib/storage/fragments/flutter/remove.md b/docs/lib/storage/fragments/flutter/remove.md
new file mode 100644
index 00000000000..6c815397622
--- /dev/null
+++ b/docs/lib/storage/fragments/flutter/remove.md
@@ -0,0 +1,11 @@
+To delete an object uploaded to S3, use `Amplify.Storage.remove` and specify the key:
+
+```dart
+try {
+ RemoveResult res = await Amplify.Storage.remove(
+ key: 'ExampleKey',
+ );
+} catch (e) {
+ print(e.toString());
+}
+```
\ No newline at end of file
diff --git a/docs/lib/storage/fragments/flutter/upload.md b/docs/lib/storage/fragments/flutter/upload.md
new file mode 100644
index 00000000000..94675b5f5ff
--- /dev/null
+++ b/docs/lib/storage/fragments/flutter/upload.md
@@ -0,0 +1,14 @@
+To upload to S3 from a data object, specify the key and the file to be uploaded.
+
+```dart
+File local = File('$path/filename.txt')
+try {
+ UploadFileResult result = await Amplify.Storage.uploadFile(
+ key: key,
+ local: local,
+ options: options
+ );
+} catch (e) {
+ print(e.toString());
+}
+```
diff --git a/docs/lib/storage/fragments/native_common/getting-started/common.md b/docs/lib/storage/fragments/native_common/getting-started/common.md
index ef6e59ee8b1..8ff2a170fc8 100644
--- a/docs/lib/storage/fragments/native_common/getting-started/common.md
+++ b/docs/lib/storage/fragments/native_common/getting-started/common.md
@@ -7,6 +7,7 @@ To setup and configure your application with Amplify Storage and go through a si
+
## Provision backend storage
@@ -54,11 +55,13 @@ Upon completion, `amplifyconfiguration.json` should be updated to reference prov
+
## Initialize Amplify Storage
+
## Uploading data to your bucket
@@ -66,6 +69,7 @@ To upload to S3 from a data object, specify the key and the data object to be up
+
Upon successfully executing this code, you should see a new folder in your bucket, called `public`. It should contain a file called `ExampleKey`, whose contents is `Example file contents`.
diff --git a/docs/lib/storage/getting-started.md b/docs/lib/storage/getting-started.md
index bff6b3b8393..44de8cc524f 100644
--- a/docs/lib/storage/getting-started.md
+++ b/docs/lib/storage/getting-started.md
@@ -5,4 +5,5 @@ description: The Amplify Storage category provides a simple mechanism for managi
-
\ No newline at end of file
+
+
\ No newline at end of file
diff --git a/docs/lib/storage/list.md b/docs/lib/storage/list.md
index b021e7bd5b1..7203cf7e249 100644
--- a/docs/lib/storage/list.md
+++ b/docs/lib/storage/list.md
@@ -5,4 +5,5 @@ description: Learn more about how to list all of the uploaded objects using Ampl
-
\ No newline at end of file
+
+
\ No newline at end of file
diff --git a/docs/lib/storage/remove.md b/docs/lib/storage/remove.md
index 4259f1d44ef..5513ac8e801 100644
--- a/docs/lib/storage/remove.md
+++ b/docs/lib/storage/remove.md
@@ -5,4 +5,5 @@ description: Learn more about how to remove files using Amplify Framework's stor
-
\ No newline at end of file
+
+
\ No newline at end of file
diff --git a/docs/lib/storage/upload.md b/docs/lib/storage/upload.md
index bec1055735a..51e8b282337 100644
--- a/docs/lib/storage/upload.md
+++ b/docs/lib/storage/upload.md
@@ -6,3 +6,4 @@ description: Learn more about how to upload files using Amplify Framework's stor
+
diff --git a/docs/start/getting-started/add-api.md b/docs/start/getting-started/add-api.md
index acec1365bc4..9b96ea2a22a 100644
--- a/docs/start/getting-started/add-api.md
+++ b/docs/start/getting-started/add-api.md
@@ -6,3 +6,4 @@ filterKey: integration
+
diff --git a/docs/start/getting-started/fragments/flutter/add-api.md b/docs/start/getting-started/fragments/flutter/add-api.md
new file mode 100644
index 00000000000..2ea2d7569ac
--- /dev/null
+++ b/docs/start/getting-started/fragments/flutter/add-api.md
@@ -0,0 +1,79 @@
+### Setup AWS Cloud Resources with Amplify CLI
+
+We will now use the Amplify CLI to configure the AWS Cloud Resources that will power your app.
+
+1. First ensure that you have installed the proper amplify cli version. Within your terminal run:
+
+ ```bash
+ amplify --version
+ ```
+ Your output should be a version with "-flutter-preview" appended at the end.
+
+ If not, run:
+
+ ```bash
+ npm install -g @aws-amplify/cli@flutter-preview
+ ```
+
+2. Initialize Amplify CLI by running:
+
+ ```bash
+ amplify init
+ ```
+
+ Enter the following when prompted:
+
+ ```console
+ ? Enter a name for the environment
+ `dev`
+ ? Choose your default editor:
+ `IntelliJ IDEA`
+ ? Choose the type of app that you're building:
+ 'flutter'
+ ⚠️ Flutter project support in the Amplify CLI is in DEVELOPER PREVIEW.
+ Only the following categories are supported:
+ * Auth
+ * Analytics
+ * Storage
+ ? Where do you want to store your configuration file?
+ ./lib/
+ ? Do you want to use an AWS profile?
+ `Yes`
+ ? Please choose the profile you want to use
+ `default`
+ ```
+
+3. Configure Amplify to manage cloud resources on your behalf. This step will configure a new AWS user in your account for Amplify. Open up a terminal window. You can use an external terminal or the integrated terminal in Android Studio. In the terminal, run:
+
+ ```bash
+ amplify configure
+ ```
+
+ This command will open up a web browser to the AWS Management Console and guide you through creating a new IAM user. For step-by-step directions to set this up, refer to the [CLI installation guide](~/cli/start/install.md).
+
+4. Add Analytics by typing in the following in terminal:
+
+ ```
+ amplify add analytics
+ ```
+
+ You can just accept all of the default values:
+
+ ```
+ ? Select an Analytics provider (Use arrow keys)
+ `Amazon Pinpoint`
+ ? Provide your pinpoint resource name:
+ `yourPinpointResourceName`
+ ? Apps need authorization to send analytics events. Do you want to allow guests and unauthenticated users to send analytics events? (we recommend you allow this when getting started)
+ `Yes`
+ ```
+
+5. To save all your changes and to create your AWS resources, run the following command last:
+
+ ```
+ amplify push
+ ```
+
+ After these steps, you should notice a `amplifyconfiguration.dart` file within your lib directory of your project. Guard this file carefully! It contains sensitive information that your app will use to establish a secure communication with your backend AWS resources. If it is lost or corrupted, you can always regenerate it by repeating the above steps again with the Amplify CLI.
+
+At this point you are ready to run your app. Go back to Android Studio and at the top bar click on the green play button to deploy.
\ No newline at end of file
diff --git a/docs/start/getting-started/fragments/flutter/build-footer.md b/docs/start/getting-started/fragments/flutter/build-footer.md
new file mode 100644
index 00000000000..023f8d108d8
--- /dev/null
+++ b/docs/start/getting-started/fragments/flutter/build-footer.md
@@ -0,0 +1,9 @@
+
+
+ Start the Tutorial �
+
+
+
+
+Flutter and the related logo are trademarks of Google LLC. We are not endorsed by or affiliated with Google LLC.
+
\ No newline at end of file
diff --git a/docs/start/getting-started/fragments/flutter/build.md b/docs/start/getting-started/fragments/flutter/build.md
new file mode 100644
index 00000000000..6b071466450
--- /dev/null
+++ b/docs/start/getting-started/fragments/flutter/build.md
@@ -0,0 +1,7 @@
+## What we'll build
+
+In this tutorial you'll setup the Analytics and Storage categories of the Flutter-Amplify Library to create a very simple getting started app.
+
+You will use **Storage** to upload images to [Amazon S3](https://aws.amazon.com/s3/).
+
+And, you'll use **Analytics** to track user actions in [Amazon Pinpoint](https://aws.amazon.com/pinpoint/).
\ No newline at end of file
diff --git a/docs/start/getting-started/fragments/flutter/integrate.md b/docs/start/getting-started/fragments/flutter/integrate.md
new file mode 100644
index 00000000000..059ef781881
--- /dev/null
+++ b/docs/start/getting-started/fragments/flutter/integrate.md
@@ -0,0 +1,115 @@
+In this tutorial, you will integrate basic functionality for **Analytics**.
+
+First, delete the contents of your app's *main.dart* file and paste in this starter boilerplate UI code.
+
+```dart
+import 'package:amplify_auth_cognito/amplify_auth_cognito.dart';
+import 'package:flutter/material.dart';
+import 'package:amplify_core/amplify_core.dart';
+import 'package:amplify_analytics_pinpoint/amplify_analytics_pinpoint.dart';
+import 'amplifyconfiguration.dart';
+
+void main() {
+ runApp(MyApp());
+}
+
+class MyApp extends StatefulWidget {
+ @override
+ _MyAppState createState() => _MyAppState();
+}
+
+class _MyAppState extends State {
+ bool _amplifyConfigured = false;
+
+ // Instantiate Amplify
+ Amplify amplifyInstance = Amplify();
+
+ @override
+ void initState() {
+ super.initState();
+ }
+
+ void _configureAmplify() async {
+ }
+
+ void _recordEvent() async {
+ }
+
+ @override
+ Widget build(BuildContext context) {
+ return MaterialApp(
+ home: Scaffold(
+ appBar: AppBar(
+ title: const Text('Amplify Core example app'),
+ ),
+ body: ListView(padding: EdgeInsets.all(10.0), children: [
+ Center(
+ child: Column (
+ children: [
+ const Padding(padding: EdgeInsets.all(5.0)),
+ RaisedButton(
+ onPressed: _amplifyConfigured ? null : _configureAmplify,
+ child: const Text('configure Amplify')
+ ),
+ RaisedButton(
+ onPressed: _amplifyConfigured ? _recordEvent : null,
+ child: const Text('record event')
+ )
+ ]
+ ),
+ )
+ ])
+ )
+ );
+ }
+}
+```
+
+
+## Initializing the Amplify Flutter Library
+Before using any methods in the Amplify Flutter Library, it's important to add all necessary plugins and to call configure. These init methods should only be called once at the root level of your flutter app.
+
+Add the following to your *_configureAmplify* method:
+
+```dart
+void _configureAmplify() async {
+ if (!mounted) return;
+
+ // Add Pinpoint and Cognito Plugins
+ AmplifyAnalyticsPinpointPlugin analyticsPlugin = AmplifyAnalyticsPinpointPlugin();
+ AmplifyAuthCognito authPlugin = AmplifyAuthCognito();
+ amplifyInstance.addPlugin(authPlugins: [authPlugin]);
+ amplifyInstance.addPlugin(analyticsPlugins: [analyticsPlugin]);
+
+ // Once Plugins are added, configure Amplify
+ await amplifyInstance.configure(amplifyconfig);
+ try {
+ setState(() {
+ _amplifyConfigured = true;
+ });
+ } catch (e) {
+ print(e);
+ }
+
+}
+```
+
+Note that all calls to `addPlugin` are made before `amplify.configure` is called.
+
+## Recording a simple event with Analytics
+
+Now that modules are initialized, modify the *_recordEvent* method to send events to Amazon Pinpoint.
+
+```dart
+// Send an event to Pinpoint
+void _recordEvent() async {
+ AnalyticsEvent event = AnalyticsEvent("test");
+ event.properties.addBoolProperty("boolKey", true);
+ event.properties.addDoubleProperty("doubleKey", 10.0);
+ event.properties.addIntProperty("intKey", 10);
+ event.properties.addStringProperty("stringKey", "stringValue");
+ Amplify.Analytics.recordEvent(event: event);
+}
+```
+
+At this point you are almost ready to run your app. In the next section, we will use Amplify CLI to configure your backend AWS resources.
\ No newline at end of file
diff --git a/docs/start/getting-started/fragments/flutter/nextsteps.md b/docs/start/getting-started/fragments/flutter/nextsteps.md
new file mode 100644
index 00000000000..d6107aab57f
--- /dev/null
+++ b/docs/start/getting-started/fragments/flutter/nextsteps.md
@@ -0,0 +1,10 @@
+👏 In this tutorial you created a simple app that uses Analytics. You are now ready to start exploring additional Amplify categories to add to your application.
+
+- [Authentication](~/lib/auth/getting-started.md)
+- [Storage](~/lib/storage/getting-started.md)
+- [Analytics](~/lib/analytics/getting-started.md)
+
+### Reference Sample App
+
+For a basic example app that implements all of the above categories, please check out
+the `amplify-flutter/example/sample-app` available here: (https://github.com/aws-amplify/amplify-flutter). This is a simple photo storage app that provides an example implementation of using the Auth, Analytics, and Storage categories within a Flutter app.
\ No newline at end of file
diff --git a/docs/start/getting-started/fragments/flutter/setup.md b/docs/start/getting-started/fragments/flutter/setup.md
new file mode 100644
index 00000000000..315559c4cdc
--- /dev/null
+++ b/docs/start/getting-started/fragments/flutter/setup.md
@@ -0,0 +1,83 @@
+
+👋 Welcome! In this tutorial, you will:
+
+- Download the getting started app
+- Add the Flutter Library dependencies
+- Use Amplify CLI to setup your AWS backend resources
+
+## Prerequisites
+
+- Install [Flutter](https://flutter.dev/docs/get-started/install) version 1.20.0 or higher
+
+ These steps will also guide you through downloading and setting up Android Studio and XCode for Flutter.
+
+- Setup your [IDE](https://flutter.dev/docs/get-started/editor?tab=androidstudio)
+
+ This tutorial assumes you are using AndroidStudio to develop your app.
+
+- Install the Amplify-Flutter Developer Preview version of the [Amplify CLI](~/cli/cli.md) by running:
+
+ ```bash
+ npm install -g @aws-amplify/cli@flutter-preview
+ ```
+ An existing install of @aws-amplify/cli will not work, you need to install the flutter-preview version.
+
+
+## Set up your application
+
+### Create a new Flutter application
+
+1. Open **Android Studio**. Select **+ Start a new Flutter project**.
+
+ 
+
+1. In **Select a Project Template**, select **Flutter Application**. Press **Next**.
+
+ 
+
+
+1. Next, configure your project:
+
+ - Enter *todo* in the **Name** field
+ - Make sure your Flutter SDK path is set correctly to where it is installed on your machine
+ - Press **Next**. On the next screen, press **Finish**.
+
+ 
+
+Android Studio will open your project with a tab opened to *main.dart*
+
+
+### Add Amplify to your application
+
+Amplify for Flutter is distributed via **pub.dev**.
+
+
+1. Open your **app**'s `pubspec.yaml` and add the following 3 dependencies below the line "sdk:flutter".
+
+```yaml
+dependencies:
+ flutter:
+ sdk: flutter
+
+ amplify_core: '<1.0.0'
+ amplify_auth_cognito: '<1.0.0'
+ amplify_analytics_pinpoint: '<1.0.0'
+```
+
+1. Run **Flutter Pub Get**
+
+ Android Studio requires you to sync your project with your new configuration. To do this, you can click **Flutter** in the notification bar above the file editor.
+
+ 
+
+ Alternatively, you can open a terminal window, cd into your project's root directory (where you pubspec.yaml is) and run:
+
+ ```bash
+ flutter pub get
+ ```
+
+ When complete, you will see *Process finished with exit code 0* in the output of the *Messages* tab at the bottom of your screen.
+
+ 
+
+You are ready to start building with Amplify! 🎉
diff --git a/docs/start/getting-started/integrate.md b/docs/start/getting-started/integrate.md
index fdbb7188fad..8a5b98a46d3 100644
--- a/docs/start/getting-started/integrate.md
+++ b/docs/start/getting-started/integrate.md
@@ -6,3 +6,4 @@ filterKey: integration
+
diff --git a/docs/start/getting-started/nextsteps.md b/docs/start/getting-started/nextsteps.md
index d8ae6f464e4..9cb52d78fdb 100644
--- a/docs/start/getting-started/nextsteps.md
+++ b/docs/start/getting-started/nextsteps.md
@@ -16,4 +16,5 @@ description: Getting Started with Amplify Framework - Next steps
-
\ No newline at end of file
+
+
\ No newline at end of file
diff --git a/docs/start/getting-started/setup.md b/docs/start/getting-started/setup.md
index 46fd4f43ec4..e54d2e54840 100644
--- a/docs/start/getting-started/setup.md
+++ b/docs/start/getting-started/setup.md
@@ -10,4 +10,5 @@ description: Getting Started with Amplify Framework - Setup a fullstack project
-
\ No newline at end of file
+
+
\ No newline at end of file
diff --git a/docs/start/start.md b/docs/start/start.md
index 49afec072e3..b31ed204c8d 100644
--- a/docs/start/start.md
+++ b/docs/start/start.md
@@ -5,7 +5,7 @@ disableTOC: true
filterKey: integration
---
-The open-source Amplify Framework provides the following products to build fullstack iOS, Android, Web, and React Native apps:
+The open-source Amplify Framework provides the following products to build fullstack iOS, Android, Flutter, Web, and React Native apps:
- **Amplify [CLI](~/cli/cli.md)** - Configure all the services needed to power your backend through a simple command line interface.
- **Amplify [Libraries](~/lib/lib.md)** - Use case-centric client libraries to integrate your app code with a backend using declarative interfaces.
- **Amplify [UI Components](~/ui/ui.md)** - UI libraries for React, React Native, Angular, Ionic and Vue.
@@ -14,6 +14,7 @@ The **Amplify [Console](https://aws.amazon.com/amplify/console/)** is an AWS ser
+
@@ -23,6 +24,7 @@ The **Amplify [Console](https://aws.amazon.com/amplify/console/)** is an AWS ser
+
+