01
Live deployment
Make this concrete enough that another engineer can understand what you built and why.
CAREER PROJECT · Intermediate · 1 weekend
Accessible Product Dashboard
Build a responsive dashboard with real data loading, optimistic UI, keyboard navigation, performance budgets and accessible states.
ReactTypeScriptAccessibilityPerformanceState managementTesting
DEFINITION OF DONE
Leave artifacts a reviewer can inspect.
02
Lighthouse/accessibility notes
Make this concrete enough that another engineer can understand what you built and why.
03
Component states
Make this concrete enough that another engineer can understand what you built and why.
04
Responsive screenshots
Make this concrete enough that another engineer can understand what you built and why.
05
Test coverage summary
Make this concrete enough that another engineer can understand what you built and why.
RESUME / PORTFOLIO FRAMING
Describe what you actually did.
Designed and shipped a responsive TypeScript dashboard with accessible interaction states, tested data flows and performance-focused rendering.
Use this as a starting structure, then replace it with your real implementation details, metrics and constraints. Do not claim outcomes you did not measure.
STRETCH GOALS
Go deeper if the core is already solid.
Offline cache
Add only if it strengthens the engineering story instead of delaying a finished, deployable core.
Virtualized lists
Add only if it strengthens the engineering story instead of delaying a finished, deployable core.
Design tokens
Add only if it strengthens the engineering story instead of delaying a finished, deployable core.
End-to-end tests
Add only if it strengthens the engineering story instead of delaying a finished, deployable core.