Frontend Mentor September 2022 review

Matt Studdert
Frontend Mentor

--

Hello! I hope you had a great September! We’ve had a fun month of more tweaks and improvements before we start work on some more significant updates. I’m excited to tell you what we’ve been up to!

Before I do, I’d like to welcome the 24,003 new members who joined the Frontend Mentor platform in September and the 8.5K+ who joined our Slack community! 👋 I hope you all enjoy being part of the Frontend Mentor community and learn lots completing our challenges!

Now, onto what we’ve been working on throughout September…

Features & Updates

This past month

  • Integrated PRO subscriptions with Ecologi’s API — Since we added our PRO subscription, we’ve been giving monthly to various charities. However, as the business grows, we want to increase our impact to help projects we’re passionate about. One thing Mike and I are particularly passionate about is climate change. We already have a monthly business subscription with Ecologi, contributing to their climate-positive projects worldwide. But we wanted to go a step further. So, as of September, we’ve integrated our PRO subscription so that one tree is planted for every new or renewed monthly subscription, and eight trees are planted for every new or renewed yearly subscription. This has provided a massive boost to the impact we can make as a community. You can take a look at Frontend Mentor’s Ecologi “forest” to see the specific projects this new integration is helping. I’m excited to support more initiatives as we continue to grow!
  • UI tweaks on the Hiring Platform — We had several UI tweaks we wanted to make on the Hiring Platform to improve how it looks.
  • Optimised Cloudinary usage — We use Cloudinary to host our images. We realised that there are a few areas we can optimise image delivery to decrease our usage and (hopefully!) drop down to a lower pricing tier. So we’ve made the necessary updates and will keep monitoring. These optimisations should also lead to faster loading times across the site, so it’s a win-win!
  • Easy in-progress challenge deletion — I mentioned last month that when we updated the UX for deleting solutions, we accidentally made it impossible to delete in-progress challenges from the platform! So we added a delete button to the in-progress items on the My Challenges page. This makes it much easier to delete in-progress challenges than we had before the previous UX update.
  • Automated accessibility and HTML validation reports as part of our smoke tests — As we’ve continued to improve our testing suite, we decided to add automated accessibility and HTML validation tests as part of our process. We use it on all Frontend Mentor solutions, so it seems silly that we haven’t been running the same automated checks in our testing suite!
  • Reduced the amount of data sent back from the server — We’ve continued to improve the relationship between our front-end and back-end codebases to leverage Redux Toolkit more and reduce data transfer. We’re now sending back much less data from the server, leading to more performance improvements.
  • Updated Learning Platform header to use the design system — When we built the first version of the Hiring Platform, we added some new patterns in our Storybook component library for the header. So we’ve now updated the Learning Platform use those patterns. One small visual change you’ll notice is the addition of the chevron icon beside your avatar in the top right to signal that it’s a dropdown menu.
  • Planning future UI/UX updates (sharing solutions, tabbed solution reports, challenge hubs) — We’ve got some exciting updates planned to improve the UX of the site further. They mainly focus on the solutions and challenge hubs, and I’ll talk about them more below when I outline what we’ve planned for October.
  • Lots of minor bug fixes — We spent a lot of time working through various bugs in Sentry. We’re now seeing far fewer bugs being reported by Sentry, which is always nice!

This coming month

We’ve still got many small tweaks and improvements we plan to make, but here are some of the more significant changes we’ve got in the pipeline.

  • Add solution reports to the solution page — We plan to change how we display solution reports. At the moment, the accessibility and HTML validation reports are shown on an inner page that you can get to from the solution page. By bringing the reports onto the solution page, we aim to make it easier for people to discover and view the reports. It will also make it possible to view the reports while giving feedback. The updated UI will add tabs for the design comparison, accessibility report, and HTML validation report. Anyone viewing the page can tab between each item directly from the solution page.
  • Add the current user’s points to the Wall of Fame — This update will make it easy for someone to see how many points they’ve earned in a given timeframe. So, even if you can’t see yourself on the Wall of Fame, it will show you your point total for the selected timeframe.
  • Improve the Challenge Hub UI/UX — This will be quite a significant change, so I’m not sure if we’ll complete it all this month. The challenge hub pages are the least intuitive pages on the site at the moment, so are due an overhaul. The challenge hub is where you can download challenge files, track your solutions for a specific challenge, and view other people’s solutions for the same challenge. As it stands, the page is pretty confusing. We have buttons where you can toggle between your “attempts”, the UI changes significantly from when your solution is in-progress and complete, and it just generally doesn’t look the best. Our plans aim to clean up the hub page to make it easier to see what’s going on and make the hubs more extensible for the future when we plan to add features like challenge questions (think of a mini Stack Overflow for each challenge). I’m especially excited for us to make these changes, as it will be a big improvement!

Wall of Fame

Mentors of the Month

Wall of Fame top 3 for September

A massive congratulations to Lucas for finishing in the top spot on the Wall of Fame for September and smashing his previous all-time high points total for a month! Lucas has given lots of excellent feedback and helped many people within the community!

Also, a big congratulations to Adriano and vcarames for finishing 2nd and 3rd, respectively. Both gave plenty of helpful feedback, which is shown in the big scores! You’ve all got lovely shiny new Mentor of the Month badges on your profiles ✨

As always, a big thanks to everyone who gave feedback and support to other community members throughout the past month. Giving code reviews is not only a great help to other people and a brilliant way to meet other community members, but it’s also incredible for your own learning.

Reading other people’s code, analysing it, and giving constructive feedback will really help boost your skills and reinforce your knowledge. Giving code reviews is a crucial part of being a professional developer, so reviewing other people’s solutions is a perfect place to practise giving helpful feedback to others!

Also, with the Hiring Platform now live, it’s also worth noting that the code reviews you give to others on the platform will play a big part in where you appear on the developer search results. Your code reviews for other people will be an incredible way to display your knowledge. This will help hiring managers get a detailed insight into you as a developer by reviewing your solutions and reading your code reviews.

Airdrop Raffle winner

Congratulations to Mihael for winning our monthly Airdrop Raffle! Enjoy using your free premium challenge credit to take on one of our premium challenges!

Each week and month, we randomly pick someone to win a design credit (weekly) or a premium challenge credit (monthly). Every week or month you finish on the Wall of Fame, you’ll be in with a chance of winning! 🎉

Feedback and ideas welcome

Please let me know if you’ve any feedback or ideas for Frontend Mentor. I love hearing how you’re using the platform. The best place to message me would be to DM in the Slack community.

I hope you enjoy the month ahead! 🙂

--

--

Matt Studdert
Frontend Mentor

Front-end/JavaScript developer who loves to build useful products. Creator of Frontend Mentor (https://www.frontendmentor.io).