Proactive error handling for React and vanilla JS frontends — every data-fetching component gets loading, error, and empty states, error boundaries, fetch error handling, form validation, optimistic rollback
90
84%
Does it follow best practices?
Impact
100%
1.38xAverage score across 5 eval scenarios
Passed
No known issues
Build a user profile page in React with TypeScript. The page loads the current user's data from /api/users/me and displays their name, email, and avatar image.
Below the profile info, show a list of the user's recent activity fetched from /api/users/me/activity.
Produce TypeScript/TSX files in a src/ directory:
src/api.ts -- API client for making requestssrc/components/UserProfile.tsx -- the main profile page componentsrc/components/ActivityFeed.tsx -- component displaying recent activity itemssrc/App.tsx -- app root that renders the profile pageDo not include test files or build configuration.
evals
scenario-1
scenario-2
scenario-3
scenario-4
scenario-5
skills
frontend-error-handling
verifiers