A fully functional and feature-rich React-based News Application that brings the latest headlines from various categories. It uses live news data fetched from an API and offers a smooth, user-friendly experience.
Includes ~9 news categories like Sports, Technology, Health, etc. Each category is clickable and fetches related news only.
Whenever a user clicks on a category, a top-loading bar appears giving instant feedback while fetching data.
The selected category dynamically updates the top page title and shows only relevant news articles.
As the user scrolls down, more articles load automatically without needing to click any button. A bottom loader indicates that more content is loading.
Each article is displayed as a stylish card showing:
- 🖼️ News Image (fallback static image shown if missing)
- 📰 Title and Description
- ✍️ Author Name
- 📅 Published Date
- 📺 Source Channel (shown on the top-left of each card)
The app ensures minimal delay and intuitive UI/UX using loaders and smooth transitions.
- React.js (Functional Components + Hooks)
- React Router DOM (For smooth navigation)
- Fetch API (For fetching news)
- Infinite Scroll Component
- Top Loading Bar
- Responsive CSS
Here is a short demo of the app in action:
Developed by Asim Mir (asim249)