Modern News Website

A sleek and responsive web application that fetches real-time news articles across categories using the NewsAPI, built with vanilla HTML, CSS, and JavaScript.

Overview

This Modern News Website is a frontend-focused project designed to display live and trending news articles from various categories using the NewsAPI. The site features a clean UI/UX with category-based navigation, dark mode toggle, responsive design, and intuitive search functionality. Developed using only HTML, CSS, and JavaScript, it served as a hands-on project to practice API integration, DOM manipulation, and responsive layout techniques.

Problem Statement

With rising digital content, users need a centralized, responsive, and clutter-free interface to view real-time news across diverse categories from reliable sources.

✨ Key Features

Live fetching of breaking and trending news using the NewsAPI.
Category-based filtering for Business, Tech, Sports, Health, etc.
Responsive layout for seamless mobile and desktop viewing.
Search bar to find news articles using keywords.
Dark mode toggle for enhanced user experience.
Card-based layout with image, headline, and description for each article.

Achievements

Built as a solo project to practice real-time API integration.
Achieved full responsiveness using custom CSS (no framework).
Successfully deployed and tested across major devices and screen sizes.
Gained hands-on experience with REST APIs and asynchronous JS (fetch).

Screenshots