Frontend Mentor

Improve your coding skills by building real projects

Our front-end challenges mimic a real-life workflow. Each one includes designs (mobile & desktop), a style guide, and a project brief. The rest is up to you! This means you get access to professional designs and can build your experience of creating websites.
discussion
Would you recommend this product?
41 Reviews4.9/5
Matt Studdert
Maker
Developer, Founder of Frontend Mentor
Hey Product Hunters! First off, I hope you're all managing to stay safe during this difficult time. Thanks to @chrismessina for hunting us. Mike and I are excited to launch Frontend Mentor here on Product Hunt! Problem πŸ€” I got the idea for Frontend Mentor as a result of the teaching work I do at General Assembly. My front-end web development students often asked where they could go to continue to practice their newfound HTML, CSS, and JS skills after finishing the course. My answer was always "continue to build your own portfolio site, try re-creating Dribbble shots or download free themes and re-create them from scratch". However, I was never really satisfied with the answer. So I thought it would be useful to offer a genuine insight into a front-end developer's workflow for anyone who would like to improve their coding skills. Solution πŸ’‘ Frontend Mentor offers a range of challenges that aim to mimic a real-world workflow for a front-end developer. Each free challenge includes: βœ… Mobile & desktop designs in JPG format βœ… A front-end style guide for colors, fonts, etc βœ… A basic project brief, which mentions any expected functionality βœ… Pre-optimised assets βœ… A skeleton HTML file with pre-written content, but no structure If you want to practice using the original Sketch design file, there is an option to buy that as well, although it's not a requirement to start the free challenges. As well as the free challenges we also have premium challenges. Premium challenges offer you the chance to build some seriously impressive portfolio pieces and include: βœ… Multi-page and fully-functional project ideas βœ… Mobile, tablet & desktop designs in both JPG and Sketch format βœ… A professional design system providing common styles βœ… Custom APIs to work with so that you can practice with JS libraries/frameworks like React, Vue, Svelte, Angular, etc Product Hunt Offer πŸ’Έ As a thank you for checking out Frontend Mentor, we've got a 25% discount coupon that will run to the end of April. It's available on all Sketch files and premium challenges. Just add PRODUCTHUNT25 at checkout πŸ‘ Feedback Welcome πŸ™ Thank you so much for your support. If you've got any feedback we'd love to hear it! AMA below πŸ‘‡
Share
Anne-Laure Le Cunff
Founder, Ness Labs
@_mattstuddert Massive congrats on the launch, Matt! Amazing what you've built here πŸŽ‰
Share
Matt Studdert
Maker
Developer, Founder of Frontend Mentor
@anthilemoon hey Anne-Laure, thanks a lot! I'm looking forward to seeing what you do with the Ness Labs community as well!
Share
Scott Mathson
Building plinkhq.com and more
@_mattstuddert @anthilemoon agreed - I'm blown away by the depth of content you've put together here. Wow! Congrats Matt!
Share
Matt Studdert
Maker
Developer, Founder of Frontend Mentor
@scottmathson thank you so much, Scott! I really appreciate the support!
Share
@_mattstuddert Hey Matt, First of all, congratulation on successfully building such an awesome product. I am documenting journey of founders, builders, entrepreneurs who are constantly innovating, inventing, and creating things, in general. The proposal is to do a short interview, capture it in video, and let it out to the world, so that others can get inspiration. And, at the same time you and your team will get acknowledgement for the hustle. If you are interested, please reach out to me at tellmeaboutit510{at}gmail.com . Thanks, and good luck! Subodh
Share
Junaid TariqFrontend Developer
best website for enhance your frontend skills
Share
Matt Studdert
Maker
Developer, Founder of Frontend Mentor
@junaidktariq hey Junaid, thanks a lot for your kind words! I'm really happy you like the site πŸ™‚
Share
Tulsi PrasadBelieves in all things JavaScript.
Thanks to Matt for this great help. Until, I found out about front end mentor, I was struggling here and there to find different random images or even copyrighted design materials for just practice and now we can get all this at here, even for free and along with the best community support. Kudos to you! πŸŽ‰
Share
Matt Studdert
Maker
Developer, Founder of Frontend Mentor
@tulsiprasad hey Tulsi, I really appreciate your feedback. Thanks! It's great to hear that you're finding the challenges useful to practice on πŸ™‚
Share
Ayodeji OlagbaiyeUI/UX Designer & Frontend Developer
A great resource to fine tune your frontend skills
Share
Matt Studdert
Maker
Developer, Founder of Frontend Mentor
@dejidope thanks Ayodeji, I'm really happy that you like the site!
Share
@_mattstuddert has done a great job to start this platform in order to improve our frontend skills. A definite plus for a newbie or a seasoned pro, you'll get cool challenges to improve your skills. Good luck Matt for your future with Frontend Mentor :)
Share
Matt Studdert
Maker
Developer, Founder of Frontend Mentor
@vaibhav_khulbe thank you so much for the kind words, Vaibhav! It's great having you as part of the community! πŸ™‚
Share
Hunting down comments...