A lightweight web app for logging support tickets, moving them through a triage workflow, and turning resolved issues into searchable troubleshooting articles. Built with plain HTML, CSS, and JavaScript — no frameworks, no build step, no backend required.
Live Demo · Open index.html in any browser, or serve the folder with any static file server.
Most of my hands-on technical experience comes from working as a Customer Service Technical Intern at AZ Instruments, where I diagnosed hardware and instrumentation issues for customers, authored troubleshooting guides, and built a self-service knowledge base that cut down repeat support tickets.
TechDesk is that same workflow — log an issue, work it to resolution, document the fix so the next person doesn't have to solve it twice — rebuilt as a small web app. It's meant to demonstrate the kind of day-to-day work involved in supporting a live product: taking in bug reports, triaging and testing them, and keeping clear documentation of issues, fixes, and updates.
- Ticket intake — log an issue with product/area, summary, repro steps, priority, and reporter
- Kanban board — tickets move through Open → In Progress → Resolved
- Search & filter — quickly find tickets or knowledge base articles by keyword or tag
- Self-service knowledge base — searchable articles with symptom + step-by-step solution + tags
- One-click "Document as KB article" — turn a resolved ticket directly into a knowledge base entry, pre-filled from the ticket's details
- Activity log — running record of what changed and when, for traceability
- No backend — state persists in the browser via
localStorage, so the demo works standalone
- HTML5 (semantic markup, native
<dialog>for modals) - CSS3 (custom properties, CSS Grid/Flexbox, responsive layout, light/dark mode via
prefers-color-scheme) - Vanilla JavaScript (ES6+, no dependencies)
techdesk-issue-tracker/
├── index.html # markup + ticket/article dialogs
├── style.css # design system (CSS variables, responsive grid)
├── app.js # state, rendering, and event handling
└── README.md
No build tools needed.
git clone https://github.com/<your-username>/techdesk-issue-tracker.git
cd techdesk-issue-tracker
# then just open index.html in a browser, or:
npx http-server -c-1- Persist to a real backend (Node/Express or PHP + MySQL) instead of
localStorage - User accounts and role-based views (reporter vs. support agent)
- File/screenshot attachments on tickets
- Email or push notifications on status changes
Syed Rizvi — Computer Science major (AI minor) at the University of Houston. Background in Python/Java, applied ML coursework, and hands-on technical support/troubleshooting experience at AZ Instruments, where documentation and self-service knowledge bases were a big part of reducing repeat issues. Looking for opportunities to apply that same troubleshoot-document-improve workflow to real software products.