https://github.com/zackproser/mnist-mind-mapper
An end to end neural network application delivered as a Next.js app
https://github.com/zackproser/mnist-mind-mapper
Last synced: 5 months ago
JSON representation
An end to end neural network application delivered as a Next.js app
- Host: GitHub
- URL: https://github.com/zackproser/mnist-mind-mapper
- Owner: zackproser
- License: mit
- Created: 2024-07-25T03:06:42.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-07-29T02:09:39.000Z (over 1 year ago)
- Last Synced: 2025-01-15T01:07:42.822Z (over 1 year ago)
- Language: TypeScript
- Homepage: https://mnist-mind-mapper.vercel.app
- Size: 921 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Neural Network Digit Recognizer
A web application that uses a neural network to recognize hand-drawn digits between 1 and 10.
## Overview
This project combines a PyTorch-based neural network with a Next.js frontend to create an interactive digit recognition application. Users can draw a digit on a canvas, and the application will predict the drawn number in real-time.
## Features
- Interactive canvas for drawing digits
- Real-time prediction using a trained neural network
- Brutalist design aesthetic
- Responsive layout for both desktop and mobile devices
- Informative modal explaining the project's purpose and technology stack
## Technology Stack
- Frontend: Next.js, React, TypeScript
- Styling: Tailwind CSS
- Backend: Flask
- Machine Learning: PyTorch
- Dataset: MNIST
## How It Works
1. The user draws a digit on the canvas.
2. The frontend sends the image data to the Flask backend.
3. The backend processes the image using a trained PyTorch model.
4. The prediction is sent back to the frontend and displayed in real-time.
## Getting Started
### Prerequisites
- Node.js
- Python 3.x
- pip
### Installation
1. Clone the repository:
```
git clone https://github.com/yourusername/neural-network-digit-recognizer.git
cd neural-network-digit-recognizer
```
2. Install frontend dependencies:
```
npm install
```
3. Install backend dependencies:
```
pip install -r requirements.txt
```
### Running the Application
1. Start the development server:
```
npm run dev
```
2. Open your browser and navigate to `http://localhost:3000`
## Deployment
This application is designed to be deployed on Vercel. Follow the Vercel documentation for deploying Next.js applications with API routes.
## Contributing
Contributions are welcome! Please feel free to submit a Pull Request.
## License
This project is open source and available under the [MIT License](LICENSE).
## Acknowledgements
- MNIST dataset for providing the training data
- Next.js and Flask for providing robust frameworks
- Vercel for hosting and deployment