Skip to content

News web app with live data built with Next13.3,TypeScript, Tailwind. Dark/Light mode using next-themes. GraphQL for batching multiple api calls. StepZen for generating TypeScript definitions automatically. Live data pulled via Mediastash Api. Revalidation and prebuilding pages with generateStaticParams reducing wait time.

Notifications You must be signed in to change notification settings

Srijan-D/News-app-master

Repository files navigation

Currecntly: fixing few bugs in production related to caching and read the more ts file
preview of the app can be found below image image image

News Web Application with Live Data

This is a web application built with Next13.3, TypeScript, and GraphQL, utilizing StepZen for generating TypeScript definitions automatically. Live data is pulled via the Mediastash API with revalidation of stale data every 20 seconds using next revalidate, prebuilt pages along with instant caching to reduce wait time and pulling dynamic data at each request. The application also includes a dark/light mode feature using next-themes and tailwindcss.

Technologies Used

  • Next13.3
  • TypeScript
  • GraphQL
  • StepZen
  • Mediastash API
  • Next-Themes
  • TailwindCSS

Features

  • Live data from the Mediastash API with revalidation
  • GraphQL for efficient batching of multiple API calls
  • Automatic TypeScript definition generation with StepZen
  • Prebuilt pages to reduce wait time
  • Streaming SSR for incremental rendering parts of UI to the client.
  • Custom svg loader using React Suspense under the hood.
  • Dark/light mode feature with next-themes and tailwindcss

Installation and Usage

  1. Clone the repository: git clone https://github.com/your-username/news-web-app.git
  2. Install dependencies: npm install or yarn or pnpm install
  3. Start the development server: npm run dev or yarn run dev or pnpm run dev
  4. Open http://localhost:3000 in your browser to view the app.

Contributing

Contributions are welcome! Please feel free to open issues or pull requests.

About

News web app with live data built with Next13.3,TypeScript, Tailwind. Dark/Light mode using next-themes. GraphQL for batching multiple api calls. StepZen for generating TypeScript definitions automatically. Live data pulled via Mediastash Api. Revalidation and prebuilding pages with generateStaticParams reducing wait time.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published