Building a Real-Time News Aggregator with NewsData.io News API
A real-time news aggregator is a simple web page that fetches live headlines from an API and displays them automatically. In this guide, we have covered how you can build a news aggregator using the NewsData.io News API using minimal coding and without the need for a backend server or database.
If you are new to working with APIs, this can be a great project to start with.
What you’ll need
- A free NewsData.io account and API key
- A text editor
- A web browser
That’s it. No frameworks. No install.
Step 1: Get Your API Key
Sign up at newsdata.io/register and copy your API key from the dashboard. Every request to the API needs this key attached, kind of like showing an ID card so the service knows who's asking.
Step 2: Understand the API Request
NewsData.io’s News API works through a single URL that you customize with a few parameters. Here’s the basic shape of a request that fetches the latest news:
https://newsdata.io/api/1/latest?
apikey=YOUR_API_KEY&q=technology&language=en
Breaking that down:
-
apikey- your personal key. -
q- the keyword you're searching for (here, "technology"). -
language- restricts results to English articles.
Paste that URL (with your real API key) into a browser tab, and you'll see a block of JSON, structured text containing article titles, links, images, and descriptions. That JSON is the raw material our aggregator will display nicely.
{
"status": "success",
"totalResults": 36869,
"results": [
{
"article_id": "7cb52a566f8bf9a84fc73dd28cf3dc3a",
"link": "https://www.nationaltribune.com.au/hkust-led-international-research-team-wins-prestigious-creativity-prize-at-the-prince-sultan-bin-abdulaziz-international-prize-for-water-psipw/",
"title": "HKUST-Led International Research Team Wins Prestigious Creativity Prize at the Prince Sultan Bin Abdulaziz International Prize for Water (PSIPW)",
"description": "Prof. Mohamed Salah GHIDAOUI, Chinese Estates Professor of Engineering and Chair Professor of the Department of Civil and Environmental Engineering at",
"content": "Prof. Mohamed Salah GHIDAOUI, Chinese Estates Professor of Engineering and Chair Professor of the Department of Civil and Environmental Engineering at The Hong Kong University of Science and Technology (HKUST), his international collaborators, and students have been awarded the Creativity Prize at the 12th Award of the PSIPW for their pioneering research in time reversal of waves and its successful translation into a novel diagnostic technology for pressurized water pipe networks. This “Creativity Prize,” valued at US$266,000, is widely recognized as one of the most prestigious honors in water engineering and science. The United Nations (UN) headquarters in Vienna served as the venue for the public announcement of the PSIPW awards in June 2026, during the water session of the 69th Committee on the Peaceful Uses of Outer Space (COPUOS). This same venue will also host the award presentation ceremony later this year. Founded in 2003 by the visionary late His Royal Highness Crown Prince Sultan bin Abdulaziz Al Saud of Saudi Arabia, PSIPW is a distinguished international award recognizing scientific and technological breakthroughs that address global water challenges. This vision is now flourishing under the esteemed patronage of the Custodian of the Two Holy Mosques, His Royal Highness King Salman bin Abdulaziz Al Saud of Saudi Arabia and actively championed by HRH Prince Khalid Bin Sultan Bin Abdulaziz, President of PSIPW. PSIPW maintains a strong strategic partnership with the UN focused on water-related Sustainable Development Goals (SDGs), exemplified by the joint PSIPW-UN Space4Water project. The award-winning research originated from a large-scale interdisciplinary study funded first by the Research Grants Council’s “Theme-based Research Scheme” and subsequently by the Innovation and Technology Fund. Crucial field testing was made possible through collaborations with Hong Kong’s Water Supplies Department (WSD), Drainage Services Department (DSD), and Airport Authority Hong Kong (AAHK) and AcegasApsAmga SpA of Italy. The research yielded a transformative technology that utilizes the time reversibility of hydraulic waves for effective water infrastructure monitoring. By integrating physics and fluid mechanics concepts, the system captures high-speed (km/s) pressure waves through pipelines, theoretically reverses their chronological order, and inputs them into a mathematical model. This technique focuses energy on pipeline faults with a resolution approaching the diffraction limit, significantly enhancing diagnostic accuracy. The technology strengthens pressurized pipeline monitoring, leading to significant reductions in water, energy, and financial losses, and improving condition assessments. It directly supports UN SDGs 6, 9, and 11 and is currently deployed in over 15 real-world applications across Hong Kong. The Honourable Mr. Mazin Hamad Mohamad ALHIMALI, Consul General of Saudi Arabia in Hong Kong & Macau, said, “We are immensely proud of Prof. Ghidaoui, who is well known to us, on being awarded the prestigious Creativity Prize of the 12th Prince Sultan Bin Abdulaziz International Prize for Water. This distinction recognizes and honors the outstanding achievements in research and technological innovation of the team led by Prof. Ghidaoui at HKUST and will further solidify the already strong academic partnership between Saudi Arabia and Hong Kong. It unequivocally underscores our shared dedication to championing global innovations that confront vital water sustainability challenges.” Prof. Nancy IP, President of HKUST, congratulated Prof. Ghidaoui and his international research team, remarking, “Winning the PSIPW Creativity Prize carries extraordinary significance. It proves that the pioneering research led by Prof. Ghidaoui is playing a pivotal role in addressing one of the world’s most pressing challenges by enhancing the resilience of water infrastructure. This international accolade also fully demonstrates HKUST’s steadfast commitment to translating world-class, interdisciplinary research into real-world impact that drives global sustainable development. Our scholars actively promote cross-regional and interdisciplinary research collaborations, striving to seamlessly transform breakthroughs in frontier research into practical solutions that benefit society and address the most severe challenges facing humanity. The National 15th Five-Year Plan proposes continuously improving the core framework and main arteries of the national water network while advancing high-quality water conservancy development. This prestigious honor is a full affirmation of HKUST’s contributions to strengthening core urban water infrastructure, safeguarding water resources, and protecting public well-being.” Prof. Philippe GOURBESVILLE, President, International Association for Hydro-Environment Engineering & Research (IAHR), Madrid and Beijing Offices, said “The work represents groundbreaking fundamental research on time reversal of waves, technology development, and field implementations, leading to substantial societal and economic benefits.” He added, “The work is a multidisciplinary and multi-national undertaking that represents a flagship achievement within the IAHR community, establishing world-leading standards in fundamental water research while demonstrating extensive practical applications.” Mr. Collin CHAN, Director of Engineering, Airport Authority Hong Kong said, “Through our collaboration with HKUST, we explored a new approach to assessing the condition of underground water pipelines. This new approach helped us make maintenance decisions based on the actual condition of pipelines, rather than their age alone, avoid unnecessary replacement works, and achieve significant cost savings. This kind of innovation has the potential to bring more tangible benefits to airport operations, and we are pleased to support the testing and application of such new solutions in a real operating environment.” Prof. Ghidaoui stated, “The prestigious PSIPW Creativity Prize is a monumental honor and a powerful testament to the relentless pursuit of excellence from our research team.” He emphasized, “The ultimate reward is the knowledge that this innovative time-reversal technology is a true Hong Kong creation, fueled by local funding, rooted in the fundamental research of our dedicated PhD and post-doctoral students at HKUST, and brought to practice through the support of WSD, AAHK, DSD in Hong Kong and AcegasApsAmga SpA in Italy.” The winning team’s success is a testament to the collaborative efforts of its members. Prof. Ghidaoui led the scientific program and core theoretical development of this groundbreaking time reversal research, as well as its laboratory and field testing conducted in Hong Kong. Prof. Silvia MENICONI and Prof. Bruno BRUNONE, University of Perugia, Italy, directed the laboratory and field-testing activities conducted within Italy. The names and current affiliation of the distinguished PhD students and doctoral fellows who were instrumental in developing the award-winning technology are: Dr. Moez LOUATI (HKUST), Dr. Xun WANG (Beihang University), Dr. Muhammad WAQAR (HKUST), Dr. George GRIGORIOPOULOS (Ove Arup & Partners Hong Kong Ltd), Dr. Saber NASRAOUI (University of Tunis El Manar), and Dr. Fedi ZOUARI (Hong Kong Telecom).",
"keywords": [
"university of science and technology",
"italy",
"united nations",
"hong kong",
"vienna",
"tunis",
"infrastructure",
"saudi arabia",
"sustainable development",
"university",
"beijing",
"madrid",
"u.n.",
"sustainability",
"groundbreaking",
"chinese",
"international research"
],
"creator": null,
"language": "english",
"country": [
"australia"
],
"category": [
"science"
],
"datatype": "news",
"pubDate": "2026-07-24 04:45:27",
"pubDateTZ": "UTC",
"fetched_at": "2026-07-24 04:45:27",
"image_url": "https://www.ust.hk/sites/default/files/styles/hkust_new_thumbnail_350_250/public/news/30897/Photo%201_27.jpg?itok=DxvtykMb",
"video_url": null,
"source_id": "nationaltribune",
"source_name": "The National Tribune",
"source_priority": 367250,
"source_url": "https://www.nationaltribune.com.au",
"source_icon": "https://n.bytvi.com/nationaltribune.png",
"sentiment": "positive",
"sentiment_stats": {
"negative": 0.02,
"neutral": 0.05,
"positive": 99.93
},
"ai_tag": [
"awards and recognitions"
],
"ai_region": null,
"ai_org": [
"hkust-led international research team"
],
"ai_summary": "An international research team led by Prof. Mohamed Salah GHIDAOUI from HKUST won the Creativity Prize at the PSIPW for their innovative work on wave time reversal and its application in diagnosing pressurized water pipe networks. The prize, valued at US$266,000, is part of the prestigious PSIPW awards recognizing breakthroughs in water engineering and science. The announcement took place at the UN headquarters in Vienna during the 69th COPUOS water session in June 2026, with the award ceremony scheduled for later in the year. The PSIPW, founded in 2003 by His Royal Highness Crown Prince Sultan bin Abdulaziz Al Saud of Saudi Arabia, continues to support global water challenges under the patronage of King Salman bin Abdulaziz and President Prince Khalid Bin Sultan Bin Abdulaziz.",
"duplicate": false
},
Step 3: Build the Page
First, create a new folder anywhere on your computer (for example, a folder called news-aggregator on your Desktop). Inside that folder, create a new file and name it exactly index.html.
You can do this in a couple of ways:
-
Using a code editor (recommended): Open a text editor like VS Code (free), open your new folder in it, then create a new file and name it
index.html. -
Using File Explorer or Finder: Create a new text file, then rename it from
.txtto.html- just make sure your file explorer isn't hiding file extensions, or you'll end up withindex.html.txtby mistake.
Once the file exists, open it in your editor and paste in the following code:
<!DOCTYPE html>
<html>
<head>
<title>My News Aggregator</title>
</head>
<body>
<h1>Latest Tech News</h1>
<div id="news-container">Loading news...</div>
<script>
const apiKey = "YOUR_API_KEY";
const url = `https://newsdata.io/api/1/latest?apikey=${apiKey}&q=technology&language=en`;
fetch(url)
.then(response => response.json())
.then(data => {
const container = document.getElementById("news-container");
container.innerHTML = ""; // clear "Loading..." text
data.results.forEach(article => {
const card = document.createElement("div");
card.style.marginBottom = "20px";
card.innerHTML = `
<h3>${article.title}</h3>
<p>${article.description || ""}</p>
<a href="${article.link}" target="_blank">Read more</a>
`;
container.appendChild(card);
});
})
.catch(error => {
document.getElementById("news-container").innerText =
"Couldn't load news right now.";
});
</script>
</body>
</html>
Here’s what’s happening, in plain terms:
-
fetch(url)requests NewsData.io to retrieve data. -
.then(response => response.json())converts the reply into something JavaScript can read. -
data.results.forEach(...)loops through each article and builds a small card with its title, description, and a link. - If anything goes wrong (bad key, no internet), the
catchblock shows a friendly fallback message instead of a broken page.
Save the file, then double-click index.html in your folder (or drag it into a browser window). It will open directly in your browser, and you should see live tech headlines appear.
Step 4: Make it “Real-Time”
Right now, the page only fetches news once, when it loads. To make it refresh automatically, add one line before the closing </script> tag:
setInterval(() => location.reload(), 300000); // refreshes every 5 minutes
This tells the browser to reload the page every 300,000 milliseconds (5 minutes), pulling fresh headlines each time.
Step 5: Make it Yours
From here, small tweaks go a long way:
- Change
q=technologyto any topic,q=climate,q=gaming,q=your-city-name - Add a
country=usparameter to focus on one region. - Style the cards with CSS to match your own design.
Wrapping Up
You now have a working, live-updating news aggregator built from a single HTML file. It’s a small project, but it covers real skills: making an API request, handling JSON, and rendering data dynamically, the same foundation used in much larger applications.
FAQs
Do I need a backend server for this?
No. Since NewsData.io allows requests directly from the browser, a single HTML file is enough for a basic version.
Is this safe to publish publicly with my API key visible?
Not recommended; for a live/public site, move the fetch call to a small backend so your key isn't exposed. Fine for local practice, though.
Can I filter news by country or category instead of keyword?
Yes, NewsData.io supports parameters like country and category alongside q, so that you can combine or swap them freely.


Top comments (0)