Amplify Flutter Storage Gallery App

This is a sample app that uses Amplify Storage to upload images to AWS S3

Previews

Getting Started

• Install and configure Amplify CLI
• A Flutter application targeting Flutter SDK >= 2.10.0 (stable version).
• An iOS configuration targeting at least iOS 11.0
• An Android configuration targeting at least Android API level 21 (Android 5.0) or above

Running the App

• Clone the application.

git clone https://github.com/offlineprogrammer/amplify_storage_app

• Create your amplify environment for this app

amplify init

• Install dependencies

flutter pub get

• Build all your local backend resources and provision it in the cloud.

amplify push

• Run the app and try uploading images.

App Architecture and Folder Structure

The code of the app implements clean architecture to separate the app layers with a feature-first approach for folder structure. I used Riverpod for state management and Freezed for the storage file model

Folder Structure

lib
├── features
│   ├── storage_file
│   │   ├── controller
│   │   ├── models
│   │   ├── services
│   │   └── ui
│   │       └── storage_file_list
├── main.dart
├── storage_gallery_app.dart
└── utils.dart

• main.dart file has Amplify initialization & configuration code and wraps the root StorageGalleryApp with a ProviderScope
• storage_gallery_app.dart has the root MaterialApp wrapped in the Amplify Authenticator to add complete authentication flows to the App.
• The features/storage_file folder contains code for displaying/uploading storage file
  • ui/storage_file_list contain the implementation to display the storage files gallery & the storage upload indicator
  • services is the app services layer
    • storage_service.dart is the service & provider to use Amplify Storage for files listing & uploading
  • models is the storage_file model generated using Freezed
  • controller is an abstract layer that used by the ui for the buisness logic