alihussnain-git / gallery-app

This is an image gallery app made in react native,

Image Gallery app

Prerequisites

Make sure you have completed the React Native - Environment Setup

Installation

run yarn This command will install all packages and prepare the development environment to run the app.

for building ios after yarn install run 
1. cd ios
2. pod install

Available scripts

First, you will need to start Metro, the JavaScript bundler that ships with React Native.

To start Metro, run the following command from the root of your React Native project:

yarn start

Let Metro Bundler run in its own terminal. Open a new terminal from the root of your React Native project. Run the following command to start your Android or iOS app:

For android

yarn android

For iOS

yarn ios

If everything is set up correctly, you should see your new app running in your Android Emulator or iOS Simulator shortly provided you have set up your emulator/simulator correctly.

This is one way to run your app — you can also run it directly from within Android Studio and Xcode respectively.

Run tests

yarn test

Run Lint

yarn lint

Solution

• Create a gallery app using https://picsum.photos images
• Implemented responsive image gallery for all android and iOS devices
• Implemented CRUD functionality for comments with redux toolkit with a complete UX.
• added test coverage using jest and react-native testing library

Improvements

• 12-Factor approach: Using react-native-config to for environment setting like staging, prod etc. Currently base url is hard coded in environment.ts
• Pagination: Pagination to load more images as user scrolls down
• Optimize image loading: Loading a large number of high-resolution images can impact performance, implementing techniques like lazy loading and image caching to improve the loading speed of the gallery.
• Comments functionality to be handled by API to socialize better with others.
• Image caching and offline support: Implement image caching to improve the performance of image loading and enable offline support. Cache the images locally on the device so that they can be viewed even without an internet connection. User should also be able to store image in their phone.
• Image sharing: Allow users to share the photos via social media platforms or other apps installed on their device. Add a share button or menu option that opens the sharing functionality.
• Image search: Implement a search functionality that allows users to search for photos based on keywords, tags, or other metadata. Add a search bar where users can enter their search queries and display the matching results.