Code Compare

Code Compare is a lightweight browser tool for comparing two code snippets side by side and quickly spotting the differences between them.

Features

• Side-by-side code editors
• Supports multiple programming languages
• Built with Monaco Editor for a code-editor feel in the browser
• Language switcher with sample code presets
• Adjustable editor font size
• Snapshot export using html2canvas
• Useful for showing incorrect vs correct code examples visually

Tech Stack

• JavaScript
• Vite
• Monaco Editor
• html2canvas
• HTML/CSS

Use Cases

• Comparing old vs new code
• Showing refactoring improvements
• Teaching clean-code examples
• Presenting before/after code snippets visually

Getting Started

1. Clone the repository:

   git clone https://github.com/MohamedMG7/Code_Compare.git

2. Install dependencies: npm install

3. Run the development server: npm run dev

4. Open the local URL shown by Vite in your browser. Build To create a production build: npm run build To preview the production build: npm run preview