RETO 2.0Workshop#2: How to create a Web 2.0 Mash-up

using the ENDIAPI and Open API’s.

APEX Team:Gerald Martinez

ENDIAPI

Mashups

• Is a web page or application that uses or combines data or functionality from two or many more external sources to create a new service.

• Examples:http://twittervision.com/http://bcdef.org/flappr/http://www.tsmaps.com

Purpose of the ENDIAPI

• Maximize the potential of El Nuevo Día primary asset: Content Creation

• Expand the boundaries of Content Syndication• Reach New Content Delivery Platforms.

Architectural Design

ENDI DB

ENDIAPI

WWW Print Mobile Mashups Widgets

RESTful API

• REST - Representational State Transfer– is a style of software architecture for distributed

hypermedia systems such as the World Wide Web.– REST-style architectures consist of clients and servers.

Clients initiate requests to servers; servers process requests and return appropriate responses.

– REST was initially described in the context of HTTP, but is not limited to that protocol

– REST over HTTP works with and enhances the native HTTP verbs, URI’s, request and response headers, request and response codes, etc.

RESTful API

• A RESTful web service (also called a RESTful web API) is a simple web service implemented using HTTP and the principles of REST. It is a collection of resources, with three defined aspects:– the base URI for the web service, such as

http://api.elnuevodia.com/resources/.– the MIME type of the data supported by the web service. This is often

JSON, XML or YAML but can be any other valid MIME type.– the set of operations supported by the web service using HTTP

methods (e.g., POST, GET, PUT or DELETE).

JSON

• JavaScript Object Notation, is a lightweight computer data interchange format.

• It is a text-based, human-readable format for representing simple data structures and associative arrays (called objects).

• The JSON format is often used for serialization and transmitting structured data over a network connection. Its main application is in Ajax web application programming, where it serves as an alternative to the XML format.

– Resource:http://www.json.org

JSON vs. XML

{ "id" : 3445, "name" : "Noticias", "url" : "/noticias", "subsections" : [ { "id" : 3453, "name" : "Ciencia y Tecnología", "url" : "/subseccion--ciencia" }, { "id" : 3465, "name" : "Mundiales", "url" : "/subseccion--mundiales" }, { "id" : 3455, "name" : "Política", "url" : "/subseccion--politica" } ]}

<sections> <id>3445</id> <name>Noticias</name> <url>/noticias</url> <subsections> <id>3453</id> <name>Ciencia y Tecnología</name> <url>/subseccion—ciencia</url> <id>3465</id> <name>Mundiales</name> <url>/subseccion—mundiales</url> <id>3455</id> <name>Política</name> <url>/subseccion—politica</url> </subsections></sections>

http://api.elnuevodia.com/sections/

ENDIAPI Documentation

• Uses HTTP Basic Authentication• Rate Limiting: Clients are allowed 100 requests per 60 sixty

minute time period, starting from their first request.• Pagination Limiting: Clients may request up to the last 31 days

of news articles via the page and count parameters. • Resources Available: Sections, News, Comments, Ultima Hora,

Horoscope, Movies, Climate and others.

– Debugcurl -u <username>:<password> –H “api_key: <APIKey>”

http://api.elnuevodia.com/sections/

– Referencehttp://www.apex.pr/reto/documents.htm

ENDIAPI – C# Sample Codeusing System;using System.Web;using System.IO;using System.Net;using System.Text; // Create the web requestHttpWebRequest request = WebRequest.Create("http://api.elnuevodia.com/news/") as HttpWebRequest; // Add pre authentication to requestrequest.PreAuthenticate = true; // Add Authorization headerrequest.Headers.Add(HttpRequestHeader.Authorization, "Basic " + Convert.ToBase64String( new UTF8Encoding().GetBytes(String.Format("{0}:{1}", "<Username>", "Password")))); // Add API Key to headerrequest.Headers.Add(String.Format("api_key:{0}", "<API Key>")); // Get responseusing (HttpWebResponse response = request.GetResponse() as HttpWebResponse) { // Get the response streamStreamReader reader = new StreamReader(response.GetResponseStream()); // Console application output

Console.WriteLine(reader.ReadToEnd());

Demo

• Summary: The example will show a simple mashup implementation where we mix output from ENDIAPI and Zemanta to get related articles and images from the internet. All the AJAX Handling and Page Rendering is done using JQUERY.

• References:http://reto.apex.pr/apex-api/http://www.zemanta.comhttp://www.jquery.com

Questions

Contacts

• http://reto.apex.pr/contact-us/

• Apex Team– gmartinez– gerald.martinez@apex.pr– carlosgmercado– carlos.mercado@apex.pr