Web API

In this post I would like to in short describe Web API. What It is, how It works and why to use It.
I think that for start to better understending what is WCF, You should know that WCF is an API architecture if I can say that. That is why I am going to enter You to WCF world starting introduce You a Web API.

What does it exacly mean?

Let’s look at what is API first. API is a interfece which is exposing from applications like facebook, twitter or github etc. Why those applications have API ? API allows developers to connect with application like facebook and by using API have access to that application data usually in xml or json format.

Let’s look at this example to better understanding what I am talking about 🙂

In our environment I mean developers, especially .NET developers name Scott Hanselman isn’t foreign. I like Scott, I like him speeches, I like him work and If You don’t know him I recommend You to google Scott Hanselman, maybe He also inspire You like in some way inspired me 🙂
Okey, let’s move to our path and focus on our main topic.
You ask me why the hell You are talking about people You like. I am here to learn about Web API. You right  I did It no without reason. On Scott Hanselman example I will show You How Web API works, and how It is awesome!

Let’s focus on GitHub API. On page developer.github.com is documentation which really good describes all possibilities GitHub API and show examples how to use It.

I have visited this page and I was learned If I want to get some data about user I should use schema: https://api.github.com/users/yourusername

Let’s try It and paste: https://api.github.com/users/shanselman into your browser.
That is the result:

github api browser response

You can see that GitHub API return us data in json format which we can use to our needs what is I am going to show .
Is it crazy. Isn’t It ?
You must know that for security in many cases to access API like Twitter API (and again to  better sort out our knowledge – what can I do with Twitter API ? For example You can display on your web page last five posts of your Twitter fanpage, how about that ha ?) You must authenticate by create account, what is allow you to recive token which You use in your application.

Let’s back to our Scott Hanselman example. I will show You as I promised how to use data from GitHub API.

Example

HTML:

<body style="background-color: #e0e0d1">
<div id="header">
<h1>API is so cool!</h1>
</div>
<div class="content">
<input id="searchUser" type="search" placeholder="please enter username">
<button onclick="getDataAboutUser()">Get user!</button>
<div id="userName" style="margin-top: 20px"</div>
<img id="userImage" src="" height="300" width="300" /></div>
</body>

JS


function getDataAboutUser() {

var username = $('#searchUser').val();

$.get(&quot;https://api.github.com/users/&quot; + username, function(data) {
$('#userName').text(data.name);
$('#userImage').attr('src', data.avatar_url);
});
}

This code will create one input and button. After click that button data from input will attach to link, in order to GitHub API know which user data we want to receive.
In answer we get data in json format like on the picture above, and from that json objet we selecting name and avatar_url property. That allow us to display picture and name person which we are looking for. Just like on the picture:

my code access to api

I believe that now You can see what exactly Web API is, why we use It and how to start a long and full of adventures journey with It.

I hope that this post was for You useful and You learn something. In next posts I will focus more about services including of course WCF.

PROJECT STATUS

I think that in Smile Table project application for Daj Się Poznać 2016 competition some kind of Web API is needed so for sure I will create It.

I just need for real:

daddy gotta go to work

Reklamy

Skomentuj

Wprowadź swoje dane lub kliknij jedną z tych ikon, aby się zalogować:

Logo WordPress.com

Komentujesz korzystając z konta WordPress.com. Wyloguj / Zmień )

Zdjęcie z Twittera

Komentujesz korzystając z konta Twitter. Wyloguj / Zmień )

Zdjęcie na Facebooku

Komentujesz korzystając z konta Facebook. Wyloguj / Zmień )

Zdjęcie na Google+

Komentujesz korzystając z konta Google+. Wyloguj / Zmień )

Connecting to %s