Will be an introduction to

1. Will be an
introduction to
Web API
SAYED AHMED
SAYED@JUSTETC.NET
JUST ET CETERA TECHNOLOGIES (JUSTETC.NET)

2.  Kind of introduction
 You may find it kind of random though not totally
 Will show basic examples to create
 Demo using VS
 Also steps using text/articles from web

3. What is WebAPI?
 ASP.NET Web API. ASP.NET Web API is a framework that makes it easy to
build HTTP services that reach a broad range of clients, including
browsers and mobile devices.
ASP.NET Web API is an ideal
platform for building RESTful
applications on the .NET
Framework.
 Yes webAPI is also of REST kinda
API development
 And I showed you on how to
Engineer an API...

4. Overview
 HTML5 changed the game
 So Web API is here...
 Purpose:
 Create web-services
 Light weight
 Can serve the purpose of SOAP/WCF
 ASMX web-service applications use Soap style
 Can serve the purpose of REST
 Hence, it might fit better for newer development
 You might still want to use WCF/SOAP to extend existing
applications and that will require extensive interaction

5.  SOAP is pretty verbose -> too much data (XML)
transferred
 Web API is lightweight
 Rest is also simpler than SOAP
 Web API provided more capability and suites well the
new need
 Ajax based applications though not Web-service –
works kinda that way

6. Just One Resource
 On Rest API Engineering
 Once I developed kinda from scratch a Rest Api like API (telling like
as it did not implement all the aspects of REST though worked and
implemented like rest)
 Anyway, a resource on REST API design/architecture/engineering
 http://blog.octo.com/en/design-a-rest-api/
 This is the resource..looks pretty comprehensive – just googled it
and found it
 I was actually looking for an article that once I read in the past that
was pretty comprehensive and the stuff seemed to make sense and
great..
 It might be the same stuff...
 Anyway, if you are into REST api design and engineering, you will
find such checklist of a Great Rest API design...

7.  I can show you some info on Web-API from some
slides..
 One is when to Use API and When to use SOAP/WCF

8.  You just saw SignalR – duplex communications over HTTP
 I just used it without knowing the term SignalR
 Also, utilized/consumed a Web Service Apparently seemed to be
REST and Web-API in the same applicatiom
 About signal R
 The consumer is showing some stuff using a iframe (src points to
remote url and apparently that remote url was using Webservice )
 Iframe height was changing based on interaction
 Required to keep height consistent without showing scrollbars
 So used post message (kinda html 5 and push) to send the height
info to client and from client using some event retrieved that height
and adjusted the height anyway...

9.  REST and Restlike API/Webservice
 Reaches to different end point based on URL
parameters...

10.  On How to Test Web API
 Tools that will help
 Anyway...
 Better going for implementation then too much theory

11.  You can see an example at
 http://www.asp.net/web-api/overview/getting-started-
with-aspnet-web-api/tutorial-your-first-web-api
 Will show you the steps from that URL and then
 Will implement that simple application using Visual
Studio

12.  So what did we see..
 A sample application returning
 All products
 And might be returning only one product based on url
and if a product id is there..
 Telling might because..I just googled and found this
application...did not check it yet...
 But from REST concept this is what it seems like

13.  So steps...
 Creat web application
 Select web-api as a type
 Then you create a model – product
 And you add some product in code as just demo...
 In many cases...you might go for entity framework and
anyway..

14.  Then as usual create controller to utilize the model
 Then you create a HTML file
 From that file you call the API using jQuery
 Based on the URL you will get all products or one
product..
 Let’s see the screenshots..

15.  Controller MethodURI
 GetAllProducts/api/products
 GetProduct/api/products/id

16.  So I downloaded the project
 This is how it looks like..
 Does not

17.  After downloading the project I just added the HTML page—it was
not there
 You can see jquery code to get the product using Web-Api
 function find() {
 var id = $('#prodId').val();
 $.getJSON(uri + '/' + id)
 .done(function (data) {
 $('#product').text(formatItem(data));
 })
 .fail(function (jqXHR, textStatus, err) {
 $('#product').text('Error: ' + err);
 });
 }

18.  You might see the similar structure in the regular
 Ajax application
 Asmx
 It is just how Web API works internally
 Externally, and for the project structure – very similar to
other...
 The backend implementation of Web API
 If you want to go for implementing that or who
implemented that...that’s based on Huge Theory...

19.  Such data/database actually belongs to Model
 And are returned to controller then returned to view
 It was kept in controller just for demo and simplicity I
believe

20. Let’s Implement on our own
 Did a mistake – wanna do again
 Will add model..
 Add controller...
 You see rest like methods...
 Get put delete...
 Did not work
 Internal server error
 Apparently, we need json package as we are usinf
$.getJson
 Will try newtonsoft json

21.  Don’t see exact match trying one
 If does not work, will being the dll files from the
downloaded application
 It might be an interference with the old application
that we ran before..
 The issue multiple model and controller with same
name..mistakenly
 So worked...

22.  The routing
 // Web API configuration and services
 // Web API routes
 config.MapHttpAttributeRoutes();
 config.Routes.MapHttpRoute(
 name: "DefaultApi",
 routeTemplate: "api/{controller}/{id}",
 defaults: new { id = RouteParameter.Optional }
 );