Disclaimer: This article contains affiliate links. I may earn a small commission if you purchase something through my website.
In this Bubble tutorial, we’ll create your personalised news content library, using the Newscatcher API.
Watch the tutorial below, or scroll down to read the text version! (Also published on TechAcute).
Many of us want to be on top of the news on the topics we love, but these days, who has the time? And a lot of us have to write reports or whitepapers, but research takes up a lot of our time.
The app we’ll make today, using Bubble and Newscatcher, is a library, or a database, of content tailored towards your preferences that will help you address these pain points. Let’s dive in!
Setting Up Newscatcher API
- First, sign up to Newscatcher and get your API key.
- Create a new Bubble app, go to the Plug-ins tab and install the API connector plug-in.
- Add a new API, give it a name it (e.g. Newscatcher) and add the x-api-key header to “Shared Headers”, with your Newscatcher API key as the value.
- Create a new API call, set it to “Data” and give it a name (e.g. OUR NEWS).
- Set the cURL method to “Get” and enter “https://api.newscatcherapi.com/v2/search” for your call.
- Add the following parameters and values:
q = Your keywords for news topics, e.g. API Design
lang = “en”
countries = Country code from which you want to receive the news, e.g. US, GB
- Uncheck “Private” on all parameters. Then, initialize the call and click “Save.”
Building the News Library in Bubble
- Go to the Data tab and add a parameter to the User data type. Call it “NewsKeywords” and have it be a list of texts.
- Return to the Design tab in your Bubble app and create a text input and a button on the page. Let’ call the input “Keywords” and the button “Generate My News.”
- Create a repeating group on the page and set the type of content to be “Newscatcher – OUR NEWS’ article” – as a result of your Data API call, this data type will be available. Set the data source to “Get Data from an External API” and the API provider to “Newscatcher – OUR NEWS”. The dynamic data should read “Newscatcher – OUR NEWS’s articles”. You can also sort it by published date, for convenience.
- Then, set your parameters – Insert Dynamic Data for the “q” parameter and make it Input Keywords’s value. The other parameters can be left as is or changed according to your language and country preferences.
- Add some content to the repeating group via text fields such as “Current Cell’s Our NEWS article’s TITLE”, “Author”, “Excerpt”, “Published Date” etc. I also added a newspaper icon which redirects to the original website of the news article. You can set up a workflow on the icon to “Open an External Website” and have the URL be “Current Cells’s OUR NEWS article’s link”.
6. After configuring the repeating group to your preferences, create a workflow for the “Generate my news” button. This workflow will have two steps:
a) Make Changes to Current User
b) Display list in Repeating Group.
For the first step, you change the NewsKeywords parameter. It’ll be “add” “input keywords’ value”. This is because you might want to keep an eye on several topics, which I will cover in the follow-up video tutorial.
And for the second step, choose the Repeating Group we created earlier, with the data source “Get Data from an External API”. Make the “q” parameter Dynamic Data: “Current User’s NewsKeywords.”
7. Now test it by clicking “Preview”, entering your keywords in the Input field and clicking the “Generate My News Button”. If configured correctly, you should see a list of news articles related to your keyword, sorted by published data.
The Newscatcher API provides a great way stay up-to-date with the latest news on whatever subject you want. I’ve used it myself when building Expordite’s feature of curated export content.
And with the help of Bubble, you too can build a database or a library of the news content retrieved by Newscatcher and use it for your writing or research needs!
Want to see more tutorials like this? Subscribe to my YouTube channel or buy me a coffee to support me!
(Previously: How to Find Twitter Influencers with Bubble & Social Animal)
One thought on “How to Build a News Library in Bubble”