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