Skip to content

Latest commit

 

History

History
100 lines (74 loc) · 2.67 KB

Readme.md

File metadata and controls

100 lines (74 loc) · 2.67 KB

OopsFixer 🚀

OopsFixer is an AI-powered debugging assistant designed to help developers analyze, detect, and fix code errors effortlessly. With its sleek interface and seamless integration with Gemini flash 2.0 's cutting-edge technology, OopsFixer makes debugging smarter and faster!


alt text

🔥 Features

AI-Powered Code Review – Get instant feedback on your code with AI-driven analysis.
Syntax Highlighting – Readable, structured, and beautifully formatted code.
Real-Time Debugging Insights – Identify issues and optimize your code instantly.
Responsive UI – Fully optimized for all devices, ensuring a smooth experience.
Dark & Light Mode – Enjoy coding in your preferred theme.
Fast & Scalable Backend – Deployed on Vercel with seamless API integration.


🌎 Live Demo

🔗 Frontend (Netlify): OopsFixer Live


🛠️ Tech Stack

Frontend:

  • ⚛ React – JavaScript library for building UI components
  • 🎨 Tailwind CSS 4.0 – Utility-first CSS framework for styling
  • 📝 react-simple-code-editor – Lightweight code editor component
  • 🌈 PrismJS – Syntax highlighting for code blocks
  • 📄 react-markdown – Renders Markdown content
  • 🔍 rehype-highlight – Syntax highlighting for Markdown-rendered code
  • 🔄 Axios – HTTP client for API requests

Backend:

  • 🔄 CORS & Body-Parser
  • 🟢 Node.js – JavaScript runtime for server-side logic
  • ⚡ Express.js – Web framework for handling API requests
  • 🔐 dotenv – Manages environment variables
  • 🤖 Google Gemini AI – AI model used for generating code reviews

🚀 Installation & Setup

1️⃣ Clone the Repository

 git clone https://github.com/iamafridi/oopsfixer.git
 cd oopsfixer

2️⃣ Set Up Backend

 cd backend
 npm install  # Install dependencies

Create a .env file in the backend/ directory and add:

GEMINI_API_KEY=your_GEMINI_api_key

Run the backend locally:

npm run dev

3️⃣ Set Up Frontend

 cd ../frontend
 npm install  # Install dependencies
Run the frontend locally:
```sh
npm run dev

🎯 Usage Guide

1️⃣ Enter your code in the editor.
2️⃣ Click "Review Code" to get AI-powered feedback.
3️⃣ Read the analysis and implement fixes.
4️⃣ Enjoy bug-free, optimized code! 🎉



📞 Contact

🔗 Portfolio: iamafridi-portfolio


⭐ Show Your Support!

If you found OopsFixer helpful, please give it a ⭐ on GitHub!

Happy Debugging! 🚀