This uses open API provided by News API website (https://newsapi.org). This project was initialized almost 6 years ago. I revisited this recently and updated the code for it through some code cleaning using Vuestic components whenever possible. This is a comprehensive source of news which is constantly updated and has 100+ news sources from around the world including CNN, BBC, Russia Today and many more. News from around 50+ countries is available across various categories. News can also be fetched via keywords which are not related to any specific category.
As of March 2025 all the security vulnerabilities are addressed and fixed with updated packages.
Made with ❤️ by @apfirebolt
- Makes use of News API (https://newsapi.org), api does require OAuth and has limits on free usage.
- Vuestic components are used for cards, buttons and other UI things for this application.
- News can be filtered using keywords.
- News can be filtered based on country and category type. For example, you can filter 'Entertainment' category news from 'India' only.
Make sure you get your API key from
Then create a .env file inside your main project folder with following contents
VITE_APP_KEY=Your_key_here
As next steps, just install node modules for the app and run the dev script.
npm install
npm run dev
For production, run the build npm command and serve the static files through a production or development server.
npm run build
npm start
Please find some of the screenshots of the application. Below is the screenshot of the Home Page.
Screenshot of the News sources page where you can see list of countries for which you can have the news.
Screenshot of the News Page, you can get category wise news for a given country.
- Applying pagination to news and search news by keyword page.
- Docker deployment script with nginx.