Webfolio by Aman

Project Overview

News Bee is a modern news aggregator built with React and Bootstrap 5. It fetches articles from The Guardian API, allowing users to browse news by category with infinite scrolling and a responsive interface.

Goals

Deliver up-to-date news headlines and stories from around the world.
Provide category-wise browsing for focused news consumption.
Ensure a seamless and responsive user experience across devices.
Integrate with The Guardian Open Platform API for reliable news data.

Key Features

Category-wise News
Browse news by categories such as World, Business, Science, Sports, Technology, Environment, Culture, Politics, and Fashion.
Infinite Scroll
Seamless infinite scrolling for news feeds using react-infinite-scroll-component.
Responsive UI
Modern, responsive interface built with Bootstrap 5.
Top Loading Bar
Visual feedback for loading progress using react-top-loading-bar.
Routing
Client-side routing with react-router-dom for smooth navigation.
About Page
Learn more about News Bee and its mission.
Loading Spinner
Custom loading indicator for better UX.
API Integration
Fetches news from The Guardian API, with category-based endpoints.
Environment Variables
API key managed securely via .env.local.

Live Demo & Preview

Currently Not Available.

Technologies Used

HTML

CSS

Bootstrap

JavaScript

Architecture & Workflow

Built with simple JavaScript and Bootstrap 5, using functional components. News data is fetched from The Guardian API and managed via component state. Routing is handled with react-router-dom. No backend required.

Additional Screenshots

Currently Not Available.

Planned Enhancements

Upcoming Features
- Search by Query: Ability to search news articles by keywords.
- Country Selection: Option to filter news by country.
- Language Selection: Option to filter news by language.
- User Preferences: Save favorite categories and articles.
- Improved Accessibility: Enhance ARIA support and keyboard navigation.