# minhaz-sadi/devtools architecture

> Architecture diagram of the GitHub repository minhaz-sadi/devtools, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-30). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/minhaz-sadi/devtools
- Repository: https://github.com/minhaz-sadi/devtools

## Overview

This repository is a collection of standalone frontend exercises rather than one integrated application. The clearest workflow is DevBoard’s task board: its click handlers invoke task completion, which updates counters, appends history, and disables the completed button. Other visible projects include a calculator, login and signup pages, and several landing-page or planner demos. The README is empty, and most HTML and JavaScript are unsampled, so links between those pages and their runtime behavior are omitted unless shown in the excerpts.

Main entry points: [`DevBoard_Project/JS/addTask.js`](https://github.com/minhaz-sadi/devtools/blob/main/DevBoard_Project/JS/addTask.js) (Task handlers), [`IIUC/fee-cal.js`](https://github.com/minhaz-sadi/devtools/blob/main/IIUC/fee-cal.js) (Calculator logic), [`DevBoard_Project/JS/complete.js`](https://github.com/minhaz-sadi/devtools/blob/main/DevBoard_Project/JS/complete.js) (Task completion), [`DevBoard_Project/JS/date.js`](https://github.com/minhaz-sadi/devtools/blob/main/DevBoard_Project/JS/date.js) (Date display)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_devboard["DevBoard"]
  node_board_page["Task board<br/>[index.html]"]
  node_blog_page["Blog page<br/>[blog.html]"]
  node_task_handlers["Task handlers<br/>[addTask.js]"]
  node_task_completion["Task completion<br/>[complete.js]"]
  node_date_display["Date display<br/>[date.js]"]
  node_theme_control["Theme control<br/>[theme.js]"]
end

subgraph group_iiuc["IIUC"]
  node_calculator_page["Fee calculator<br/>[fee-cal.html]"]
  node_calculator_logic["Calculator logic<br/>[fee-cal.js]"]
  node_login_page["Login page<br/>[login.html]"]
  node_signup_page["Signup page<br/>[signUp.html]"]
  node_iiuc_home["IIUC home<br/>[index.html]"]
end

subgraph group_demos["Other demos"]
  node_demo1["Demo page<br/>[index.html]"]
  node_landing_page["Landing page<br/>[index.html]"]
  node_practice_page["Practice page<br/>[a.html]"]
  node_planner_page["Team planner<br/>[index.html]"]
end

node_visitor(("Visitor"))
node_browser_dom["Browser DOM"]

node_task_handlers -->|"calls"| node_task_completion
node_task_handlers -->|"registers handlers"| node_browser_dom
node_task_completion -->|"updates DOM"| node_browser_dom
node_date_display -->|"updates DOM"| node_browser_dom
node_theme_control -->|"changes background"| node_browser_dom
node_task_handlers -->|"navigates to"| node_blog_page
node_calculator_logic -->|"handles keys"| node_browser_dom
node_calculator_logic -->|"updates display"| node_browser_dom

click node_board_page "https://github.com/minhaz-sadi/devtools/blob/main/DevBoard_Project/index.html"
click node_blog_page "https://github.com/minhaz-sadi/devtools/blob/main/DevBoard_Project/blog.html"
click node_task_handlers "https://github.com/minhaz-sadi/devtools/blob/main/DevBoard_Project/JS/addTask.js"
click node_task_completion "https://github.com/minhaz-sadi/devtools/blob/main/DevBoard_Project/JS/complete.js"
click node_date_display "https://github.com/minhaz-sadi/devtools/blob/main/DevBoard_Project/JS/date.js"
click node_theme_control "https://github.com/minhaz-sadi/devtools/blob/main/DevBoard_Project/JS/theme.js"
click node_calculator_page "https://github.com/minhaz-sadi/devtools/blob/main/IIUC/fee-cal.html"
click node_calculator_logic "https://github.com/minhaz-sadi/devtools/blob/main/IIUC/fee-cal.js"
click node_login_page "https://github.com/minhaz-sadi/devtools/blob/main/IIUC/login.html"
click node_signup_page "https://github.com/minhaz-sadi/devtools/blob/main/IIUC/signUp.html"
click node_iiuc_home "https://github.com/minhaz-sadi/devtools/blob/main/IIUC/index.html"
click node_demo1 "https://github.com/minhaz-sadi/devtools/blob/main/Demo1/index.html"
click node_landing_page "https://github.com/minhaz-sadi/devtools/blob/main/LandingPage_Project/index.html"
click node_practice_page "https://github.com/minhaz-sadi/devtools/blob/main/Practise/a.html"
click node_planner_page "https://github.com/minhaz-sadi/devtools/blob/main/TeamPlaner_Project/index.html"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_board_page,node_blog_page,node_task_handlers,node_task_completion,node_date_display,node_theme_control,node_browser_dom toneBlue
class node_calculator_page,node_calculator_logic,node_login_page,node_signup_page,node_iiuc_home toneAmber
class node_demo1,node_landing_page,node_practice_page,node_planner_page toneMint
class node_visitor toneIndigo
```

## Components

### DevBoard

- [Task board](https://github.com/minhaz-sadi/devtools/blob/main/DevBoard_Project/index.html): `DevBoard_Project/index.html`
- [Blog page](https://github.com/minhaz-sadi/devtools/blob/main/DevBoard_Project/blog.html): `DevBoard_Project/blog.html`
- [Task handlers](https://github.com/minhaz-sadi/devtools/blob/main/DevBoard_Project/JS/addTask.js): `DevBoard_Project/JS/addTask.js`
- [Task completion](https://github.com/minhaz-sadi/devtools/blob/main/DevBoard_Project/JS/complete.js): `DevBoard_Project/JS/complete.js`
- [Date display](https://github.com/minhaz-sadi/devtools/blob/main/DevBoard_Project/JS/date.js): `DevBoard_Project/JS/date.js`
- [Theme control](https://github.com/minhaz-sadi/devtools/blob/main/DevBoard_Project/JS/theme.js): `DevBoard_Project/JS/theme.js`

### IIUC

- [Fee calculator](https://github.com/minhaz-sadi/devtools/blob/main/IIUC/fee-cal.html): `IIUC/fee-cal.html`
- [Calculator logic](https://github.com/minhaz-sadi/devtools/blob/main/IIUC/fee-cal.js): `IIUC/fee-cal.js`
- [Login page](https://github.com/minhaz-sadi/devtools/blob/main/IIUC/login.html): `IIUC/login.html`
- [Signup page](https://github.com/minhaz-sadi/devtools/blob/main/IIUC/signUp.html): `IIUC/signUp.html`
- [IIUC home](https://github.com/minhaz-sadi/devtools/blob/main/IIUC/index.html): `IIUC/index.html`

### Other demos

- [Demo page](https://github.com/minhaz-sadi/devtools/blob/main/Demo1/index.html): `Demo1/index.html`
- [Landing page](https://github.com/minhaz-sadi/devtools/blob/main/LandingPage_Project/index.html): `LandingPage_Project/index.html`
- [Practice page](https://github.com/minhaz-sadi/devtools/blob/main/Practise/a.html): `Practise/a.html`
- [Team planner](https://github.com/minhaz-sadi/devtools/blob/main/TeamPlaner_Project/index.html): `TeamPlaner_Project/index.html`

### Other components

- **Visitor**
- **Browser DOM**

## Connections

- Task handlers → Task completion: calls (evidence: `DevBoard_Project/JS/addTask.js`)
- Task handlers → Browser DOM: registers handlers (evidence: `DevBoard_Project/JS/addTask.js`)
- Task completion → Browser DOM: updates DOM (evidence: `DevBoard_Project/JS/complete.js`)
- Date display → Browser DOM: updates DOM (evidence: `DevBoard_Project/JS/date.js`)
- Theme control → Browser DOM: changes background (evidence: `DevBoard_Project/JS/theme.js`)
- Task handlers → Blog page: navigates to (evidence: `DevBoard_Project/JS/addTask.js`)
- Calculator logic → Browser DOM: handles keys (evidence: `IIUC/fee-cal.js`)
- Calculator logic → Browser DOM: updates display (evidence: `IIUC/fee-cal.js`)