Frontend MasteryFrontend Mastery
Sign in / Register

Frontend Challenges

Showing 18 challenges of 204

FinishMedium

Account Settings

Finish section navigation for a settings page so the address names the visible section and restores it on reload.

DebugHard

Creator Profile Editor

Track down the security, validation, and save-flow faults in a creator profile editor before it ships.

DebugHard

Input Catalog

Fix why a design-system reference page flashes the wrong theme for a moment before the saved preference takes effect.

DebugEasy

Incorrect Cart Total

Track down why the cart subtotal goes wrong after shoppers change item quantities.

FinishHard

Attachments Panel

Add preview entries and per-file removal controls for a dropzone so files can be reviewed before upload.

DebugMedium

Escaping Dropdown Clipping

Fix the product table's row-actions menu so it stays fully visible on narrow screens.

DebugMedium

Pulse Team Dashboard

Trace the dashboard's navigation state so choosing a mobile destination leaves the interface ready for the next action.

Review codeMedium

Checkout Payment Panel

Review a checkout payment step for card-validation logic bugs and a keyboard-inaccessible payment method selector.

Review codeMedium

Team Task Board

Review a kanban-style team task board for state-management bugs and a keyboard-inaccessible card menu.

Review codeMedium

Two-Factor Verification Screen

Review an AI-generated OTP modal and flag insecure verification, exposed phone data, and accessibility regressions.

FinishMedium

Room Edit Letter

Add the image, signup form, validation, and success state for a small-space design newsletter card.

FinishEasy

Billing Period Toggle

Render each plan price from data and wire the Monthly/Annually toggle to switch billing periods on a pricing page.

DebugMedium

Payroll Salary Table

Track down why payroll search, role/month filtering, and CSV export quietly return the wrong employees.

BuildEasy

Browser Market Share

Build a responsive Browser Market Share with clear data labels, visual hierarchy, and supporting chart context.

BuildEasy

Tech Stocks Correlation

Build a responsive Tech Stocks Correlation with clear hierarchy, polished styling, and behavior matching the reference.

BuildEasy

Feature Highlight Section

Build a responsive Feature Highlight Section with strong spacing, hierarchy, and layout behavior matching the reference.

BuildHard

Visitor Insights Chart

Build a responsive Visitor Insights Chart with clear data labels, visual hierarchy, and supporting chart context.

BuildMedium

Social Interaction Card

Build a responsive Social Interaction Card with social metadata, engagement details, and clear visual hierarchy.

Start practicing

Create a free account to access all 204 challenges and track your progress.

Sign up to access all challenges