MohanadOO / live-news

A Live News application built with NextJS and TailwindCSS and using MediaStack API to fetch the latest news on certain topics or using the search input field.

Home Page:https://live-news-seven.vercel.app/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Live News

A Live News application built with NextJS and TailwindCSS and using MediaStack API to fetch the latest news on certain topics or using the search input field.

StepZen was used in this project to introspects MediaStack API endpoints and easily generate GraphQL schemas.

Table of contents

Overview

Features

Users should be able to:

  • View the optimal layout for the site depending on their device's screen size πŸ’»/ πŸ“±
  • Using the mediastack API you could search for the latest news πŸ“°
  • Dark and Light Theme 🎨
  • Using NextJS Revalidation for all genres at the top to minimize API calls and serve static pages πŸ“ƒ

Screenshot

Light Theme Dark Theme

Links

Setup

Using yarn πŸ‘‡

$ yarn
$ yarn dev

Using NPMπŸ‘‡

$ npm install
$ npm run dev

My process

Built with

  • React - JS library
  • Tailwind CSS - CSS framework
  • React Icons - React icons provides a huge collections of icons from different sources.
  • GraphQL - A query language for your API

Author

About

A Live News application built with NextJS and TailwindCSS and using MediaStack API to fetch the latest news on certain topics or using the search input field.

https://live-news-seven.vercel.app/


Languages

Language:TypeScript 91.8%Language:JavaScript 5.0%Language:CSS 3.2%