How headlines are loaded
Server-side fetch on the home page, then client-side category switching with React Query and optional SSR cache.
Learn the basics
This is an educational news app built with Next.js, React, and the GNews API. Below are the main concepts and features used in the project.
Headlines by category
Browse general, world, business, technology, sports, science, health, and more via the GNews top-headlines API.
Context API
Country and language filters live in NewsContext; bookmark state in BookmarkContext with localStorage sync.
Reusable components
ArticleCard, NewsGrid, HeroBanner, BannerSlider, Navbar, Footer, and modals are shared across the app.
TypeScript types
Article, ArticleSource, GNewsResponse, and API params are typed for safer refactors and editor support.
GNews API
Powered by GNews for real-time news and top headlines. Supports search, filters by language and country, and pagination.