GitHunt
AM

Amritasri10/Flashfeed-News-App

A modern and responsive news search application built with React.js and NewsAPI, featuring real-time headlines, keyword search, and dark/light mode support.

๐Ÿ“ฐ FlashFeed - News Search Application

FlashFeed is a modern and responsive news search application built with React.js. It uses the NewsAPI to fetch the latest news articles from around the world and allows users to search for topics of interest.


๐Ÿš€ Features

  • Search News: Instantly search for the latest news by keyword.
  • Top Headlines: Get top headlines from various categories.
  • Dark/Light Mode Toggle: Switch between dark and light themes.
  • Responsive Design: Optimized for desktop and mobile devices.
  • Fast Performance: Minimal and clean interface for quick browsing.

๐Ÿ”ง Tech Stack

  • Frontend: React.js, Bootstrap
  • API: NewsAPI.org
  • Icons: Bootstrap Icons

๐Ÿ“ธ UI Preview

Homepage Screenshot

Dark Mode Enabled

Dark Mode Screenshot

๐Ÿ“ฆ How To Run Project

  1. Clone the repository

    `git clone https://github.com/Amritasri10/flashfeed-news-app.git`
    
  2. Install dependencies

    `npm install`
    
  3. Start the development server

     `npm start`
    
  4. Open your browser and visit

     `http://localhost:3000`
    

๐Ÿ“ Project Structure

flashfeed-news-app/
โ”œโ”€โ”€ public/
โ”‚   โ””โ”€โ”€ logo.ico
โ”œโ”€โ”€ src/
โ”‚   โ”œโ”€โ”€ components/
โ”‚   โ”‚   โ”œโ”€โ”€ CategoryTabs.js
โ”‚   โ”‚   โ”œโ”€โ”€ Footer.js
|   |   โ”œโ”€โ”€ Navbar.js
โ”‚   โ”‚   โ””โ”€โ”€ NewsCard.js
|   |   โ””โ”€โ”€ NewsCarousel.js
โ”‚   โ”œโ”€โ”€ api.js
โ”‚   โ”œโ”€โ”€ App.js
โ”‚   โ””โ”€โ”€ index.js
โ”œโ”€โ”€ .env
โ””โ”€โ”€ README.md

๐Ÿ›ก๏ธ Environment Variables

Create a .env file in the root and add your NewsAPI key:

REACT_APP_GNEWS_API_KEY=74678d1dfe70404ca6fb362cf64cc1ce


๐Ÿ’ก Future Enhancements

  • Add User Authentication: Allow users to create accounts, save favorite articles, and customize preferences.
  • Improve Search Filters: Enable filtering by date range, source, language, and relevance.
  • Push Notifications: Send alerts for breaking news based on user interests.
  • Offline Mode: Cache news articles for offline reading.
  • Enhanced UI: Add animations, infinite scrolling, and better mobile responsiveness.

๐Ÿ“„ Acknowledgements


๐Ÿ“Œ License

This project is licensed under the MIT License.


๐Ÿ™Œ Author

Connect with me on
LinkedIn | GitHub