Skip to content

dev-4hmad/Automata-Conversion-Visualizer

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

7 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Automata Conversion Visualizer

An interactive web-based tool for visualizing step-by-step conversions between different types of automata and formal language representations. This educational tool helps students and researchers understand the relationships between NFAs, DFAs, Regular Expressions, and Context-Free Grammars.

Automata Conversion Visualizer HTML5 CSS3 JavaScript

🚀 Features

Supported Conversions

  • NFA to DFA - Subset Construction Algorithm
  • DFA to NFA - Direct Conversion
  • Regular Expression to NFA - Thompson's Construction
  • Regular Expression to DFA - Via NFA intermediate step
  • NFA to Regular Expression - State Elimination Method
  • DFA to Regular Expression - State Elimination Method
  • CFG to PDA - Context-Free Grammar to Pushdown Automaton

Interactive Visualization

  • Step-by-step conversion process with detailed explanations
  • Interactive graph visualization using vis.js network library
  • 35+ pre-built examples covering various automata patterns
  • Forward/backward navigation through conversion steps
  • Complete conversion overview option

Educational Features

  • Detailed step explanations for each conversion algorithm
  • Visual state diagrams with clear transitions
  • Academic-focused interface designed for learning
  • Multiple example categories for comprehensive understanding

🎯 Use Cases

  • Computer Science Education - Teaching automata theory concepts
  • Algorithm Visualization - Understanding conversion algorithms
  • Research Tool - Quick automata conversions and visualizations
  • Self-Study - Interactive learning of formal language theory

🛠️ Technologies Used

  • HTML5 - Structure and semantic markup
  • CSS3 - Styling with modern features and responsive design
  • Vanilla JavaScript - Core functionality and interactivity
  • vis.js - Network graph visualization library
  • Tailwind CSS - Utility-first CSS framework via CDN
  • Google Fonts - Roboto Mono for consistent typography

📋 Installation & Usage

Quick Start

  1. Clone the repository:
    git clone https://github.com/dev-4hmad/automata-conversion-visualizer.git
    cd automata-conversion-visualizer

About

An interactive app for the learning of finite automata (examples + diagrams)

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Sponsor this project

Packages

No packages published