API stands for Application Programmable Interface. In general terms, it is a set of clearly defined methods of communication between various software components. You may consider it as something with which we will communicate between two nodes. By nodes I mean it may be a web server and an Android client, a front end client, and a back end client or maybe two back end servers too. I am taking in context with web development only. For learning more about its definition and other meaning you may consider this Wikipedia page.
I will be writing more about how to implement it. We may few examples with Django specifically.
Communication
The ultimate aim is communication. And we all know that communication can only happen if both the end have something common. You guessed it right it is language. Yes, they both must understand the common language. The same follows here. So for these purposes, we either use XML or JSON. Earlier XML was used more but nowadays the craze if of JSON because of its simplicity over XML.
XML
XML stands for eXtensible Markup Language. Markup Language it sounds similar right HyperText Markup Language yes you were right. It’s mainly markup language but with the benefit that you have the right to use your own tags. The basic difference between HTML and XML is that HTML is used for the presentation of data and XML is used for the storage of data. I had made a simple AJAX search engine that could extract data from an XML file. Here is the link to that project. Please don’t forget to star the repository. ;-)
A sample XML:
<?xml version="1.0" encoding="UTF-8"?>
<note>
<to>Tove</to>
<from>Jani</from>
<heading>Reminder</heading>
<body>Don't forget me this weekend!</body>
</note>JSON
JSON stands for JavaScript Object Notation. Here is a sample JSON:
{ "name":"John", "age":31, "city":"New York" }Requests
Requests are something that we make to a server or from where we have to take data. Requesting is something like visiting a URL simply. Like when we visit https://www.google.co.in we are actually making a request to the URL https://www.google.co.in. Which in return shows us a page. There are a few types of requests. Like GET, POST, PUT, DELETE, etc.
You may have seen something like in a few web address
http://www.example.com/index.php?id=23You may consider this is a GET request. And it is the simplest way of transferring data from one point to another. But yeah everybody can see it and change it. Now just remember we enter our credentials in www.facebook.com we click the login button and we are logged in this time too the data is transferred from our side to the servers of Facebook. But this time it not visible with open eyes (just kidding) actually these are not visible on the URL as in the case of GET requests. Remember don’t assume that just because we can’t see those values in the URL does not make them secure.
So now it’s time to learn how this magic works. A very simple answer just print JSON or XML for a request instead of rendering an HTML page. In the context of Django lets consider an example of a view:
def sample_api(request):
#Do something in between
#......
#......
# Create a valid JSON something like this
response = {}
response['success'] = True
response['message'] = 'Request Successfull'
return JsonResponse(response)So the above is the simplest API and remember the hack to remember what an API is, just return a valid JSON or XML (whichever you are using). Now in the receiving end what you have to do is parse the received thing. For an example in the js what we can do is:
Suppose there is a button when a user clicks it we have to load some data from an API. Now in the above, there is a clue how to do it with Django. now in the js, the script would be something like this (I will be using JQuery for the same).
$("my-button").click(function(){
$.ajax({
method: "GET",
url: 'http://www.example.com/someUrl',
dataType: "JSON",
success: function(data){
/* Now the hack is the server has responded with a valid JSON. And whatever server has responded it has been put in data variable */
// Do something with data
},
error: function(){
alert("Sorry an error occured while processing");
}
});
});Now, what the above code represents. Its an AJAX request with GET method to an URL http://www.example.com/someUrl. And if all went good function written in front of success: will be called else function is written in front of error: will be called. But remember that you have to ensure it that no matter what server has to respond with a valid JSON. Because it does not know what it has received so either you have to validate the JSON data before parsing or simply make your server such that it always returns a valid JSON. If you want to learn more about AJAX requests with JQuery you may visit its official documentation. Remember there is much more in the API this is merely an introduction.
Follow me on GitHub. Please share if you like my work. If you too want to contribute then you are always welcomed. Ping me!
Thanks hope it helped!!! :-)
Originally published at www.kdpisda.tech on March 8, 2018.
Note: I will be writing posts on the medium from now on. Follow me learn something awesome
Comments