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:
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.gitpip 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
staticfolder.
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 clientStart using Yarn.
yarn startStart using NPM.
npm startThis 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.
| Upload Image | Image Controls | Get Image Prediction | Print Predicted Data | Simple and Clean UI |
|---|---|---|---|---|
| To upload a single image, simply click the "Upload Image" button. | You can adjust the image to your liking by using the image controls to pan, tilt, and zoom. | When you're ready to conduct the neural network analysis on your uploaded image, click the run model button. | After making a forecast, you can examine the refined information and even print it out to give it an air of authority. | Simple, uncluttered, and intuitive to use. |
| Facilitates image uploads | Image Processing | Delete old images |
|---|---|---|
| Manage uploaded images with FastAPI's built-in file manager, and save them together with relevant metadata. | Image processing employing weighted, pre-trained models derived from a guaranteed data set. | Deletes obsolete photos mechanically to save space on the hardware. |
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