Frontend Mentor – Coding Challenges

February 23, 2021
Frontend Tips and Tricks Web Development

I’ve done a lot of coding challenges, ranging from the dead-simple to very complex. Things like #100 days of Code, DailyUI, 100 Days of CSS Challenges, and more are great, but something I’ve always found that has been lacking is a real sense of community and an in-depth process. Most of these challenges don’t have a “log in” – a way to track your progress of the challenges in the ecosystem, see all the solutions in one place, or interact with other people completing these challenges on the challenge platform.

Frontend Mentor seems to cover all of these bases and it requires solutions to be created in a real environment – not just a Github Gist or quick pen thrown on CodePen. I’m not saying those are bad ways to do it, just that the style feel much more disposable. Frontend Mentor requires solutions to be submitted via Github and also requires that your solution lives somewhere on the web that isn’t just a pen or fiddle. I think this makes the solutions feel much more substantial – at least for me. The thing that really pulled me in, though, was the “points” system. Users get points for completing challenges, commenting on solutions, and upvoting content. Careful with that downvote, though, as it’ll remove points from your tally. I also really like that feedback can be requested and that fancy slider that does a side-by-side comparison of the design mockup and finished product. Oh, and the way challenges are structured.

The Abstract Challenge

Challenges start when the user selects the challenge on the Frontend Mentor website. Once signed up for a challenge, the user can view the requirements and download starter files. Starter files consist of the design mockups and any static assets (like images used in the mockup). Starter files also contain a readme and a style guide, which starts you off with the colors used in the design, fonts, and design breakpoints (which are always wild, IMO). Once the user gets the challenge all coded up, they commit the code to a GitHub repo and publish it. To complete the challenge, the user submits the completed code by way of the repo URL, the live site URL, and any comments.

What I’ve Done

I started in mid-February of 2021 and have since completed 5 challenges. I’m not sold on getting the “pro” version yet so I’m working with smaller challenges for the time being. I’m excited to complete more, though! Listed below are links to the Frontend Mentor solutions pages for each challenge I’ve completed. Check out my profile here

No Comments...yet

Leave a Reply

Your email address will not be published. Required fields are marked *

Previous Post

Twitch Series: A Continuing Project

From February 23, 2021

In early February of 2021, I started streaming on Twitch, building a design from a Dribbble shot. I’ve turned it into a site and series.

Read This Article
Next Post

Hover and Pointer Media Queries

From March 1, 2021

Hover and Pointer events on mobile are …hard.

Read This Article