Added frontend support for OpenMF using React

scorelab / OpenMF

An Open Source Mobile Forensics Investigation Tool for Android Platform

Apache License 2.0

150 stars 97 forks source link

Added frontend support for OpenMF using React #39

Closed shivanshuraj1333 closed 4 years ago

shivanshuraj1333 commented 4 years ago

React based frontend is designed and implemented from scratch.

This pull request is addressed to solve issue #38 which is a subpart of issue #37

In this pull request, a complete frontend is designed, finishing the work related to Phase 1 of GSoC 2020 (link to proposal) Different tasks which are completed during this period are given below :-

Setting up tools for frontend development
Creating a React boilerplate with additional dependencies
Implementing Login and Admin panel designs in React, following Material UI
Implementing Manager and Extractor panel components in React
After the creation of components, components are connected to each other with React Router

Wolf-Legend commented 4 years ago

I did the test run, and it works like a charm :+1: I'd like to add some more points in addition to what we've discussed over video call :-

try to use minimum colours i.e. make all your components monotonous following same colour scheme.
add some more space in between Admin/user-management cards and everywhere else where you're using similar components.
add gif of working demo of different pages (this will help in understanding the UI for anyone who wants to contribute)
add a separate Readme for React-fronted and explain how to setup it locally

Change the other components as discussed over video call and commit before the 1st phase evaluation ends. Also, feel free to contact any of the mentor if required.

shivanshuraj1333 commented 4 years ago

This is the gif of the home page, please let me know if this works as a demo for this page.

I'm working on the suggestions and will squash all the modifications in a single commit along with a Readme file. I'll add the demo of other pages if you like this.

Home page of OpenMF

vivonk commented 4 years ago

Work looks good. @shivanshu1333 can you add screenshots of all the pages which you have designed and implemented so far in comments? It becomes easy to see output of work and then review code.

shivanshuraj1333 commented 4 years ago

Yes, @vivonk given below are the other pages, please note that the different components like existing cases etc will be loaded once the development of the flask backend is complete and the database is also setup.

Admin page of OpenMF

Manager page of OpenMF

Exttractor page of OpenMF