← Business
🧑💼
Searchable Employee Directory
A live-searchable, filterable company directory that updates instantly as you type.
🟢 EasyDifficulty
2 hoursTime
JavaScript, TypeScriptLanguages
What you're building
You're building the internal 'who works here' directory every company intranet has -- searchable by name, filterable by department, with instant results as you type. It's a hardcoded dataset today, but the exact same filtering pattern is what powers real HR directory tools once you swap in a live data source.
What you'll unlock 🔓
You'll need
- Basic JavaScript
- Arrays and objects
- A browser
🗺️ Build roadmap
01 Build the search bar and department filter UI
→
02 Create a hardcoded employee dataset
→
03 Render employee cards in a grid
→
04 Wire up live text search
→
05 Add the department dropdown filter
→
06 Combine search and filter together
→
07 Add an empty-results state
🔒
Log in to start building
Your first project is free -- create an account to unlock it.
Log in Sign up free