vinitshahdeo/progressivenewsapp

A simple Progressive Web App that brought news from a variety of sources using News API.

Progressive News App^PWA

A simple Progressive Web App^PWA that brought news from a variety of sources using News API. See demo.

A Progressive Web App (PWA) is a web app that uses modern web capabilities to deliver an app-like experience to users. Learn more about why Progressive Web Apps will replace native Mobile Apps.

Getting started

To install this project, you need to clone or download it.

git clone https://github.com/vinitshahdeo/ProgressiveNewsApp.git
cd ProgressiveNewsApp

🖥️ Live Demo

Running locally

• Serve folder with your server of choice. For instance by using npm install -g serve

• Make sure you are in the same path: cd ProgressiveNewsApp

• Run serve .

• Browse http://localhost:5000

• Turn off your WiFi/Internet and see if it works 🤓

Light House Report

Useful Resources

• Google Developers - Progressive Web Apps
• News API

Recommended Reading

• PWAs - Future of Mobile Web Browsing
• How is Progressive Web App different from Regular Web App?

Author

Vinit Shahdeo

if (thisRepo.isAwesome()) {
  // thanks in advance :p
  starThisRepository();
}

_{If you find a bug or think something could be better, please file an issue! If you think a code change should be made, feel free to raise a PR.}

progressivenewsapp's Issues

Update Readme with how to get news api key

It is not documented in the install guide you need a local News API key.

Please update the documentation to include how to obtain this and set in the app.js file.

Sort news on the basis of popularity and Date published

In current web app, users can filter the news on the basis of source but there is no way to filter the recent or popular news.

The idea is to sort the news in the following orders:

• Date published
• Relevancy to search keyword
• Popularity of source

Find the API Documentation here.

Add Date published in News Card

The News Card does not display the date published for the News article. Add date in News Card.

[Hacktoberfest] UI Improvements

Kindly come up with an eye-catching layout for the homepage (i.e. index.html)

• Feel free to play with fonts/colors in CSS files.
• Do not make any changes to js/app.js.
• Make sure that business logic shouldn't break i.e. fetching news.
• Update CSS to have a better News card.

PS - I don't have any wireframe in my mind if you come up with one, please comment on this thread.