NewsBuzz is a dynamic web application designed to provide users with real-time news updates from various categories such as business, entertainment, health, science, sports, and technology. Built with React.js for the front end and Node.js with Express for the backend, this project leverages the power of the NewsAPI, OpenAI API, and Google Maps API to offer a visually engaging and informative experience.
Key Features
Real-Time News Fetching:
- Utilizes the NewsAPI to fetch the latest articles across multiple categories.
- Categories include business, entertainment, health, science, sports, and technology.
Interactive Map Integration:
- Integrates Google Maps API to display the geographical locations of news articles.
- Each news article is represented as a marker on the map, providing a spatial context to the news.
User-Friendly Interface:
- Features a clean and intuitive user interface built with React.js.
- Includes a category dropdown for easy filtering of news articles by category.
- Implements a search and clear functionality to control the displayed news category.
Dynamic and Responsive Design:
- Provides a responsive layout to ensure a seamless experience across different devices.
- Implements hover animations for interactive elements, enhancing the user experience.
Backend Security:
- Employs a Node.js and Express backend to securely handle API requests.
- Environment variables are used to keep API keys secure and prevent exposure in the client-side code.
Technology Stack
Frontend:
- React.js for building the user interface.
- CSS for styling and responsive design.
- Google Maps API for map integration and visualization.
Backend:
- Node.js and Express for handling API requests and serving the React app.
- NewsAPI for fetching real-time news articles.
- OpenAI API for summarizing contents of news articles.