News homepage built with React and TailwindCSS

What are you most proud of, and what would you do differently next time?

I learned more about CSS grid for this project. I found the use of grid-template-areas in particular very helpful for creating the responsive layout of the page. This approach saved me a lot of time and effort.

What challenges did you encounter, and how did you overcome them?

By far the biggest challenge for me in this project was the nav bar. I am not super confident in the realm of positioning in general and conditional positioning especially. It took me a while to get to the point where I could display the nav at the top on bigger screens and have it slide in from the side on smaller screens.

I also had never previously worked with an overlay for when the side menu is open, so that was a challenge as well. Overall, I'd like to keep working on my CSS grid skills and get more confident in positioning elements.

I also noticed that I don't yet fully understand how to pass variables and functions down as props in React, which is something I would like to work on in future projects.

What specific areas of your project would you like help with?

There's is a horizontal scrollbar at the bottom of my page and I don't understand why that is. If someone can point me to any flaws in my styling that might be causing an overflow, please go ahead!

Also, this is not technically something I need help with, but I noticed that while the design works on laptops and mobile screens, it doesn't look super great on medium-sized screens. I guess that's just due to the layout though. I considered adding a media query to make the page a one-column layout for medium-sized screens where the articles on the right-hand side would be in a row rather than a column, but I ultimately decided against it.