Overview
NepaliSaga is a production-grade digital news portal built for Nepal's media landscape. It delivers a premium editorial experience combining smart UI interactions, real-time financial data widgets relevant to Nepali readers, and a fully responsive component system — architected as a foundation for a real media business.
Problem Solved
Nepal lacks modern, performant digital news platforms built with current frontend standards. NepaliSaga brings institutional-quality frontend engineering — smooth animations, financial data widgets, and scalable component architecture — to Nepali journalism.
Key Modules
Smart Scroll-Aware Header
Sticky header with hysteresis logic that collapses past the masthead and smoothly re-expands near the footer — preventing flicker at scroll thresholds using carefully tuned cubic-bezier curves.
Financial Widgets Suite
Live NEPSE ticker, Forex exchange rates, Bullion (gold/silver) prices, and a full Markets data table — all purpose-built for the Nepali investor readership.
Editorial Content System
Hero story layout, story cards with category tags and read time, compact card grid, and a full article view with rich typography and dynamic slug-based routing.
Engagement Features
Reading progress bar, poll widget, trending sidebar, newsletter signup, ad banner placements, dark mode toggle, and mobile navigation drawer.
Technical Architecture
Next.js 15 App Router with nested layouts for consistent header/footer across all pages. Components are separated into layout, home, article, widgets, shared, and navigation concerns. Custom hooks isolate scroll, reading progress, and market data logic. TypeScript interfaces define the data layer for articles, markets, and ads.
Design Language
Premium editorial aesthetic with a warm off-white base, serif masthead typography, and a red accent system. Tailwind CSS utility classes combined with custom typography styles in a dedicated CSS layer. Smooth Framer-style transitions using native CSS cubic-bezier curves without additional dependencies.