Frontend Mentor - News homepage solution

This is a solution to the News homepage challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

Table of contents

• Overview
  • The challenge
  • Links
• My process
  • Built with
  • What I learned
  • Continued development
  • Useful resources
• Author

Note: Delete this note and update the table of contents based on what sections you keep.

Overview

The challenge

Users should be able to:

• View the optimal layout for the interface depending on their device's screen size
• See hover and focus states for all interactive elements on the page

My process

Built with

• Sass
• CSS Grid
• Mobile-first workflow

What I learned

Learned quite a bit of Sass, and a whole lot of 'what not to do' for next time. I lost track of the organization of this project because it took me so long to get around to finishing it and it is my first foray into Sass and the BEM architecture. The JavaScript for the modal mobile menu also feels extremely hacky and could use some refactoring.

Continued development

• Sass
• JavaScript

Useful resources

• Kevin Powell's YouTube Tutorials - Extremely popular for a reason
• Web Dev Simplified

Author

• Frontend Mentor - @j-sherrick