A web-based calculator with a React frontend and a Flask backend. The calculator supports arithmetic expressions, parentheses, and variable assignments with a custom parser and evaluator.
- ๐ Frontend: https://calculator-frontend-g1d5.onrender.com
- ๐ ๏ธ Backend API: https://calculator-backend-mof7.onrender.com/evaluate
- Evaluate complex mathematical expressions including
+,-,*,/, and parentheses - Support for variables with assignment, e.g.
x = 5,y = x + 3 - Real-time evaluation via a REST API
- Clean and modern UI built with React
- Backend implemented in Flask with custom tokenizer, parser, and evaluator
- CORS enabled for seamless frontend-backend communication
- Frontend: React (Vite), CSS
- Backend: Python, Flask, Flask-CORS
- Deployment: Render (Frontend + Backend)
- Communication: REST API (JSON)
calculator-web/ โโโ backend/ โ โโโ app.py # Flask backend API โโโ frontend/ โ โโโ src/ โ โ โโโ App.jsx # Main React component โ โโโ public/ โ โโโ package.json # React project config โโโ README.md
cd backend
python -m venv venv
Windows:
venv\Scripts\activate
macOS/Linux:
source venv/bin/activate
pip install -r requirements.txt
python app.py
cd frontend
npm install
npm run dev
-
Enter mathematical expressions or assignments in the input field.
-
Click Evaluate or press Enter to get the result.
-
Use the buttons for digits, operators, parentheses, and controls (Clear, Delete).
-
Results or error messages will appear below the input.
POST /evaluate
- Request (JSON):
{
"expression": "3 + 4 * (2 - 1)"
}
- Response (Success):
{
"result": 7
}
- Response (Error):
{
"error": "Error message here"
}
This project is open-source and free to use under the MIT License.
Sahaj Dang
๐ GitHub @SahajDang