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

React Bootstrap News Homepage

@vaqueraoscar0

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


Technologies Used:

  • React.js
  • HTML5
  • CSS3
  • JavaScript
  • Bootstrap

Challenges: Throughout the development of this project, I encountered some notable challenges, with one in particular standing out. The most significant hurdle I faced was ensuring that the project achieved a responsive design while relying solely on flexbox instead of grid. By utilizing flexbox, I aimed to create a flexible and fluid layout that seamlessly adapts to various screen sizes.

Working with flexbox required careful planning to ensure that the components scaled well and looked great on all devices. It was a bit tricky, but I managed to achieve the desired responsive design without using advanced grid systems.

Apart from that, the overall development process was relatively straightforward. I used React.js as the foundation and Bootstrap for styling, allowing me to create an attractive news homepage with consistent components.

By overcoming the challenges and leveraging the strengths of React.js and Bootstrap, I successfully delivered a responsive news homepage that meets the project requirements and provides a user-friendly experience on different devices.

Community feedback

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