In this chapter, we will read some standard RSS news feeds on Internet, and with Convertigo Mobility Platform we are going to build a news reader application within few minutes. This tutorial contains many steps, don’t forget to save the project after each step.
The first thing we need is a connector for the news feed . As seen in the picture, we named the project « MyNewsProject ». Right-click on it, choose New/Connector.
Then choose HTTP connector, because RSS Feeds are driven by HTTP.Name the Connector, for example, « RSSNewsFeed ». Then Finish. The new object RSSNewsFeed will appear in the folder « Connectors ».
The next step is to import an address of an RSS feed. From the internet browser, we will copy RSS Feed address of ABC News for example.
Go to the Properties panel of RSSNewsFeed Connector, then paste the RSS address to the line Server. Remove the part « http:// » in the line, and any trailing character after the server address because we only need the server address here, nothing else.
Now we will create a Transaction. It is the object helping us get data from the feed. Go to RSSNewsFeed / New / Transaction. Choose XML http Transaction (because RSS news feeds are based on XML) , click Next. Name the Transaction (GetFeed for example) – Finish.
In the Properties of GetFeed object, paste the sub path of the RSS address to the Sub path line. (paste only abcnews/topstories instead of the full address http://feed.abcnews.com/abcnews/topstories)
Right-click the GetFeed Object, choose Execute. Now we will get the executed data appeared in the right panel (1)
Now we must handle the data by making a Sequence. Sequences are the orchestration part of Convertigo able handle the data from the connector and modify it to fit the client’s application.
Right-click on your project, choose New/Sequence/GenericSequence/Next/Name the Sequence (ReadDataForNews for example) /Finish.
A sequence ReadDataForNews appears inside the Sequences folder. Now return to the GetFeed object (2), hold the Alt key (Mac OS) or Ctrl key (Windows) and drag it into the sequence created (3) This will call the Feed to the sequence.
Now we need to make an Iterator to iterate each item from the data. Right-click on your Sequence ReadDataForNews (1), choose New / Step. In the Flow control steps, choose Iterator / Next / Finish.
Return to the Transaction GetFeed (2), right-click and choose Update schema from current generated XML / Yes. This will show us the structure of the XML so the Iterator can base on it to work. Click the Source Picker to display its window. (3). Then right-click on the Call object in the folder Step (4), choose Show in Picker. In the Source Picker window, open Transaction/Document/RSS/Channel (5)
Each channel has a list of items, and each item has a thumbnail. Drag the item (1) to the Iterator (2).
For each item, we will create a new “news” object. Right-click on the Iterator / New / Step. In tab XML steps, choose Complex. It is a structured data that help us to create our “news” object. Click Next, name it then finish. You can also rename it by typing on the line Node name in the properties of it. (3) For this example, We named it « NewsItem ».
This Complex need some fields, so we are going to create them.Right-click on the Complex NewsItem, choose New / Step / Element / Next / Finish. Name it « Title » in the Node name line.
Repeat the last step for two more times, then name it « Description » and « ImageUrl »
By now for the NewsItem we have 3 fields : Title, Description and ImageUrl. (1) We will need to map the source for each of them.
Right-click on the Iterator, choose Show in Picker. In the Source Picker, Go to Channel/Item/Title, drag the symbol in Title (2) to the element <Title> created (3). The is now remarked <Title>@(title/text())
Similarly, still in Channel/Item, find and open description and drag the TxT symbol to the element <Description>. (4)
For the <ImageUrl>, we need to map an URL link to it. From Channel/Item, open thumbnail/Attributes. Drag the url= «» to the <ImageUrl>. (1)On the data tab on the right, we can see that for each item we have several thumbnail URL (2), but we just need only one. Click on the <ImageUrl> to show its Properties tab, find the line Source and click to open the Step Source window. (3)
Now you can see the xPath with « …/thumbnail/@url ». Modify it to …/thumbnail[1]/@url . Then click Ok. This modification will tell the Iterator that we just need the first thumbnail item for each <ImageUrl>.
So far we had all the requirement. Return to the Sequence ReadDataForNews, right-click on it, choose Execute. We have now the executed feed on the right tab. We can see that for each item, there are the corresponding title, description and an image sourced from the image URL of the website.
That's all for the part 1. In the next part, we will learn how to build the UI for the Newsletter Application.
