Cursor App Template #19 — Recruitment & Applicant Tracking

Recruitment & Applicant Tracking

Manage candidates through your hiring pipeline with grid and Kanban views.

Overview

Recruitment & Applicant Tracking is a single-page browser app for HR teams and hiring managers who need to track applicants, score candidates, and visualize pipeline progress. It uses AG-Grid for the register, Alpine.js for forms and view toggles, SheetJS for Excel import/export, and Chart.js for funnel analytics — all in one HTML file.

Key features

Candidate register

  • AG-Grid with Candidate Name, Position, Stage, Application Date, Score, Notes, and Status
  • Rows grouped by hiring stage (Applied, Screening, Interview, Offer, Hired, Rejected)
  • Color-coded stage and status cells
  • Click a row or Edit to load the form

Grid & Kanban views

  • Toggle between Grid and Kanban tabs
  • Kanban board with columns for Applied through Hired
  • Cards show candidate name, position, score, and status

Add/edit candidates

  • Alpine.js form with position dropdown, stage selector, and score (0–100)
  • Application date picker and status (Active, On Hold, Hired, Rejected)
  • Notes field for interview feedback and recruiter comments

Filters & import/export

  • Filter by stage or position
  • Import Excel/CSV to replace the register (with confirmation)
  • Export current candidates to `recruitment-tracking-export.xlsx`

Pipeline dashboard

  • Summary cards: Total applicants, Hired, In interview, Average score
  • Horizontal bar funnel chart from Applied through Hired
  • Dashboard updates when filters change

Theme & persistence

  • Dark mode with saved preference
  • Data persists in localStorage

Data & persistence

  • 8 sample candidates pre-loaded across four positions
  • Stored in localStorage (`recruitmentTracking_v1`)
  • Import replaces all rows after confirmation

Built with

Tailwind CSS, Alpine.js, AG-Grid Community, Chart.js, and SheetJS — all from CDN in a single HTML page.

Try the interactive walkthrough below. Click Walk through features and use Next / Back (or arrow keys) to explore every feature.

Recruitment Tracking — Persistence & dark mode

Recruitment Tracking

Total 8Hired 1Interview 2Avg 82
Add candidate
NamePositionStageScore
Alex ChenSoftware EngineerInterview88
Applied
Taylor K.
Interview
Alex C.

Leave a Reply