In this third edition of our universal apps series I’m going to show you how the back end of the app works. This is actually the server-side script that will give us all information we need to be able to display a list of all post on The Developer Source in our universal app.

First we’ll have a look at the RSS feed of The Developer Source from where we’ll retrieve the needed information. You can see a live preview of our RSS feed right here.

We can see all sorts of information on this page, we can see things like the Title of all posts, a short description and the date of when the post got published. But in the code of the RSS file there is a lot more information. We can also find information like who wrote the post, or a link to the post itself.

You can see the code of the RSS feed by right-clicking on the page and selecting ‘View page source’, you can see the difference below.

1

Now we know how the RSS feed works we can start with converting it to JSON, we’ll use php for that. We use JSON because it’s a universal way of serving data to a client application. A lot of API’s use JSON formatting, so we’ll do the same.

With the following php code we extract the needed data from the RSS feed and output it as a JSON string.

Now we’re ready to make our app sync with the JSON page.

You can download the php file here or you can see a live preview of the RSS feed and the JSON output. You’re allowed to use this little API to do whatever you want with.