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.
- Solution URL: (https://github.com/shalri/fm-news-homepage/)
- Live Site URL: (https://shalri.github.io/fm-news-homepage/)
- NextJS
- React
- Tailwind
- Prettier Tailwind Plugin
- ViteJS
- Semantic HTML5 markup
I used NextJS for this challenge. Since I plan to integrate Frontend Mentor into my study routine, I might as well play around with NextJS and React alongside the challenges.
Implementing this challenge with NextJS made it more interesting. It gave me a broader scope for learning.
I learned how to use NextJS Image
component with picture
tag to render the
appropriate image file for the screen size. I also sharpened my grid
skills
from this challenge.
This challenge also showed the importance of a .fig
file. I spent most of the time
pixel-pushing to set the dimensions, spacing, and layout just right. I am proud of the results since I was only eyeballing it.
I look forward to doing more challenges from Frontendmentor.io. I like learning and practicing new concepts.