🧠 SyntaxStack Analyzer

A web-based compiler front-end simulation that performs lexical analysis and syntax analysis for balanced delimiters using stack-based parsing, with multi-error detection and visual debugging.

---

🚀 Overview

SyntaxStack Analyzer is a mini compiler project designed to demonstrate how real compilers validate code structure.

It focuses on analyzing balanced delimiters like:

( )   { }   [ ]

The project simulates:

• Lexical Analysis (Tokenization)
• Syntax Analysis (Parsing)
• Error Detection & Recovery

---

✨ Features

• 🔍 Lexical Analysis

  • Extracts delimiter tokens from input code

• 🧠 Syntax Analysis

  • Uses stack-based parsing to validate nesting

• ⚠️ Multi-Error Detection

  • Detects multiple syntax errors in a single run

• 🎯 Error Highlighting

  • Highlights exact error positions in the code

• 📊 Stack Visualization

  • Shows step-by-step PUSH and POP operations

• 🎨 Modern UI

  • Clean dark interface with animations and hover effects

---

🧩 Compiler Design Concepts Used

• Lexical Analysis (Tokenization)
• Syntax Analysis (Parsing)
• Stack Data Structure (LIFO)
• Pushdown Automaton (PDA)
• Context-Free Grammar (CFG)
• Error Detection & Recovery

---

⚙️ How It Works

1. User inputs code
2. Tokenizer extracts delimiter tokens
3. Parser processes tokens using a stack:
   • Push → opening brackets
   • Pop → closing brackets
4. Errors are collected (not stopped at first error)
5. Output shows:
   • Error messages
   • Highlighted positions
   • Stack steps

---

🧪 Example

❌ Input (with errors)

(a + b] { x = (y + z;

🔴 Output

• Mismatched ]
• Unmatched (
• Unmatched {

---

✅ Correct Input

if (a > b) {
    x = (y + z);
}

---

📸 Screenshots

🖥️ Interface

---

❌ Error Highlighting

---

📊 Stack Visualization (Step-by-Step)

---

🗂️ Project Structure

parentheses-checker-compiler/
│
├── index.html
├── css/
│   └── styles.css
├── js/
│   ├── app.js
│   ├── parser.js
│   ├── tokenizer.js
│   └── utils.js
├── assets/
│   └── images/
└── README.md

---

▶️ How to Run

1. Clone the repository
2. Open index.html in a browser
3. Enter code
4. Click Analyze Syntax

---

🎯 Key Highlights

• Simulates real compiler behavior
• Visualizes stack operations
• Detects multiple syntax errors
• Modular design (Tokenizer + Parser)

---

🔮 Future Enhancements

• Line & column-based error reporting
• Live syntax checking
• AST (Abstract Syntax Tree) visualization
• Full grammar-based parsing (LL/LR)

---

👨‍💻 Author

Your Name

---

⭐ Support

If you found this project useful, consider giving it a star ⭐ on GitHub.