A code comparing platform for beginner coders. The aim is to lets beginner coders understand the their practice codes better and have a positive learning experience.
- HTML, CSS, JavaScript
- CodeMirror: Used for rendering and highlighting syntax in both the student and correct code areas.
- Side-by-side code input and real-time line-by-line comparison.
- Session based history management.
- Real-time code comparison between a student’s solution and a reference solution.
- Syntax highlighting with CodeMirror.
- Persistent history: Users can view and revisit previous code comparisons.
- Delete selected and delete all options for easy history clearing.
- Support additional languages like, C, C++, HTML, CSS, JavaScript etc.
- Toggle mode option to switch from light mode to dark mode according to user's convinience.
- Backend development in progress to support data storage and advanced features.
- Improved history management: Better interface for navigating saved comparisons.
- Scoring system: Calculates accuracy score based on line-by-line matches.
- AI-based suggestions: Provides beginner-friendly explanations and improvement tips to help students learn from their mistakes.
- Node.js & Express.js: Server setup and API routes.
- MongoDB + Mongoose: Used for storing and retrieving comparison history.
- Fetch API: For communication between frontend and backend.
- Improved understanding of how to build full-stack web applications.
- Hands-on experience with HTML, CSS and JavaScript and code mirror.
- Strengthened my frontend-database integration and debugging workflow.