Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Responsive News Homepage with Next.js and TailwindCSS

Naomi Pham 180

@naomi-pham

Desktop design screenshot for the News homepage coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


I'm new to React and practicing making React components. I would love to receive any feedback on the components and file structure. Thanks so much!

Side note: This project applies a bit of CUBE CSS by Andy Bell (https://cube.fyi). It stands for Composition, Utility, Block, and Exception. I find it a nice combination with Tailwind. CUBE could be used for repeated layouts and blocks (e.g. card, box, etc.) while Tailwind is reserved for unique styling (utilities) of each element.

Community feedback

@kramlig22

Posted

As I can see there have some 4 errors in your HTML, you can update your HTML when you click Learn more.

For the HTML tags use <html lang="en"> And also use header, nav, main, and footer to specify what section is that.

I hope this helps you. Happy coding

1

Naomi Pham 180

@naomi-pham

Posted

Hi @kramlig22, thanks so much for your comment! I will address those errors and update the section tags as you recommend.

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord