1NEWBIE

Getting started on Frontend Mentor

Take your first steps as a Frontend Mentor. This path will help you get familiar with our platform and give you experience working with designs and building small projects.

8 challenges
Level 1
~16 hours
🚀
Getting started
8 challenges to complete

Prerequisites

Basic knowledge of HTML and CSS

Learning outcomes

Understand how to work with design files
Learn responsive design fundamentals
Practice semantic HTML
Build your first portfolio projects

Challenges

INTERMEDIATEPREMIUM

Mood tracking app

Build a mood tracking app to help users log their daily feelings and track their emotional wellbeing over time.

HTMLCSSJavaScript
ADVANCEDPREMIUM

Browser extension manager

Create a browser extension manager interface with the ability to enable, disable, and configure extensions.

ReactTypeScriptCSS
3
JUNIORFREE

Personal blog

Build a personal blog with article listing, individual article pages, and a responsive design.

HTMLCSSJavaScript
4
NEWBIEFREE

Character counter

Create a character counter component that updates in real-time as users type in a text area.

HTMLCSSJavaScript
5
JUNIORFREE

Conference ticket generator

Build a conference ticket generator that creates personalized tickets based on user input.

HTMLCSSJavaScript
6
INTERMEDIATEPREMIUM

Tech book club

Create a tech book club website with book listings, reviews, and discussion forums.

ReactNode.jsMongoDB
7
NEWBIEFREE

Recipe page

Build a recipe page with ingredients list, cooking instructions, and nutritional information.

HTMLCSS
8
NEWBIEFREE

Social links profile

Create a social links profile page with hover effects and responsive design.

HTMLCSS
Learn-Frontend