gearman0712/imagebucket

Welcome to ImageBucket , your own library of images, which helps you to add, delete and classify images into groups!

Image Bucket

Welcome to Image Bucket, your own library of images, which helps you to add, delete and classify images into groups! The App is built on top of ReactJS.

Algorithm/Features

• The images chosen by a user are uploaded to Firebase Storage/ Google Cloud Platform storage buckets.(To choose an image, hover to the cloud button at the bottom right position)
• The Image is passed through TesseractJS to identify characters!(OCR)
• The Image is then passed through TensorflowJS's MobileNet Image Classification model to get labels related to the image.
• The data collected from the above two steps is uploaded to Firestore database(NoSQL).
• To search image labels, type a search term in the search box.(multiple queries, should be comma separated, eg: "cat, grass" with no trailing commas)
• A list of identified labels appears on the left sidebar, which on clicking, shows the images corresponding to the clicked label!
• The images can be deleted from the library by clicking the Delete button corresponding to an image.
• Information about images can be retreived by clicking the Details button corresponding to an image.

Use the development Version

• Make sure, the latest version of Node and NPM are installed!
• Clone the project!
• Install the necessary NPM dependencies using npm install.
• Create a Firebase project and integrate the App with the Firebase project!
• Place the Firebase config in ImageRepository/FirebaseConfig.js in the following format!

var firebaseConfig = {
  apiKey: "api-key",
  authDomain: "project-id.firebaseapp.com",
  databaseURL: "https://project-id.firebaseio.com",
  projectId: "project-id",
  storageBucket: "project-id.appspot.com",
  messagingSenderId: "sender-id",
  appId: "app-id",
  measurementId: "G-measurement-id",
};

export default firebaseConfig;

• To start the project, use npm start.

Notes!

• The app uses TensorflowJS MobileNet's pretrained model which only use browser resources instead of a GPU, so the performance may be a bit lower, as compared to paid cloud solutions like Google Cloud Vision, Amazon Rekognition or Azure Computer Vision!
• Only for the users testing the development version - While running npm run build, The user may face issues in the production version,(not the currently hosted version), please refer this to fix the Tensorflow issue.