A graphical user interface (GUI) that is built on the Web and used to communicate with the Breast Cancer Detection Neural Network.

Table of Contents:

• Preface
• Getting Started
  • Prerequisites
  • Clone this Repository
  • Install Packages & Dependencies
  • Start Application
• Features
  • GUI
  • Background
• Contributing
  • Project Contributors
• License
• Reference Links

Connected to the Electronics and Communications Engineering department of SRM University of Technology and Science. The primary goal of this project is to build a user interface for the neural network that detects breast cancer.

The PYNQ Z-Series is a piece of hardware that will include the model itself. Given that PYNQ doesn't have its own user interface (UI), apart from launching a Jupyter Lab instance, a custom UI must be built in order to interact with the model.

Given the lack of an interactive UI, it is necessary to expose the GUI operating on the hardware's localhost via tunnelling traffic through Ngork to an external URL.

A Detailed User flow can be found in this document: https://docs.google.com/document/d/1IivIdJVi4lIbQ7dDW5LLaVy5koxrnJvxyAccIjbs0fk/edit?usp=sharing

Verify that all software and hardware prerequisites have been installed on your testing machine before beginning testing of the application.

* - Required

• Python * - https://www.python.org/downloads/
• Ngrok * - https://ngrok.com/download
• Node.js (optional) - https://nodejs.org/en/download/
• File/s Setup */(optional) - https://drive.google.com/drive/folders/1Sl2l4uWqLrOUJjuUKNSgBb98kMr_Tj0Y

Weighted .h5 *	Data Set (optional)
Required to be present in the project root as trained.h5.	If you wish to create your own weighted pretrained model, you'll need to use this data set to get started.

git clone https://github.com/kunalkeshan/Hardware-Web-UI.git

pip install -r requirements.txt

• Change directory to the client directory.

cd client

• Install using Yarn.

yarn

• Install using NPM.

npm install

• In the project root, run the following command. This will start up the server and serve the client build app located in the static folder.

Visit http://localhost:8000 to view the application.

py main.py

• For running the client app alone, do the following.

Open the client directory.

cd client

Start using Yarn.

yarn start

Start using NPM.

npm start

This GUI is build using React ⚛ + TypeScript and is served using Python 🐍 + FastAPI. Internally it uses it's own packages such as react-router-dom and axios in the client side, and python-dotenv and pyngrok in the server side.

Anybody is free to contribute to this repo. If you think that you can improve the model or the gui, follow the contributing guidelines mentioned at CONTRIBUTING.md

This project is licensed under the MIT License.

Many people have contacted us asking if they can use this code for their own websites. The answer to that question is usually "yes", with attribution. There are some cases, such as using this code for a business or something that is greater than a personal project, that we may be less comfortable saying yes to. If in doubt, please don't hesitate to ask us.

We value keeping this project open source, but as you all know, plagiarism is bad. We actively spend a non-negligible amount of effort developing, designing, and trying to perfect this iteration of our project, and we are proud of it! All we ask is to not claim this effort as your own.

So, feel free to fork this repo. If you do, please just give us proper credit by linking back to this repo, https://github.com/kunalkeshan/Hardware-Web-UI. Refer to this handy quora post if you're not sure what to do. Thanks!

• Install Ngrok in Linux:

curl -s https://ngrok-agent.s3.amazonaws.com/ngrok.asc | sudo tee /etc/apt/trusted.gpg.d/ngrok.asc >/dev/null && echo "deb https://ngrok-agent.s3.amazonaws.com buster main" | sudo tee /etc/apt/sources.list.d/ngrok.list && sudo apt update && sudo apt install ngrok