sakeel-103 / DFS-BFS-Graph-Travers

The DFS-BFS graph traversal project is built using Angular for the frontend and Node.js for the backend. It demonstrates two popular graph traversal algorithms: Depth-First Search (DFS) and Breadth-First Search (BFS). These algorithms are fundamental for exploring nodes and edges of a graph, solving a variety of computational and real-world problem
https://dfs-bfs-graph-travers.netlify.app
Other
17 stars 69 forks source link

Code Editor Integration with Embedded Services #242

Closed shubhagarwal1 closed 3 weeks ago

shubhagarwal1 commented 3 weeks ago

Title: Integrate an Embedded Code Editor for Practice Details: You can embed a code editor within the DFS-BFS Graph Traversal app, allowing users to write and practice algorithms like DFS, BFS, or other graph-related problems. Services like CodeMirror, Monaco Editor (used by VS Code), or Ace Editor can be embedded into your web app. Benefits: Gives users hands-on practice directly within the app and allows them to write, edit, and test code for solving graph problems.

Example Flow for Using the Code Editor: User writes code: The user writes the DFS or BFS traversal code in the embedded code editor. API Call: Upon clicking "Run", the code is sent to a service (e.g., Judge0) for execution. Results Display: The API returns the output or errors, which are displayed on the app interface. Test Cases: Optionally, the user’s code is tested against predefined graph inputs to validate the solution.

sakeel-103 commented 3 weeks ago

@shubhagarwal1 will this be on the same page as the traversal, or will it be on a different page. If it's on a different page, I think having a separate page for each algorithm would make accessing each algorithm easier for users.