ResfulAPI, what’s all about?

downloadWhat is ResfulAPI?

Actually it does get bit time for me to understand what is restful API, I mean I though I do understand it, since use post, get, update, delete action, but actually not at all. It’s not only about the action, it’s also about the whole react concept design pattern after those action. Haha, still not get it right? me too!!

Well, that’s better describe like this:


1.”Browser” == “client”,

2.”Server” == “shop”,


Client ask shop : ” please give me Black chocolate”,

shop receive from Client: “ok, got your message, I will send you Black chocolate”


shop send client Black chocolate

You could see through this scenario, there’s has roles, verb(ask, receive), result

those all play drama called ” Restful API”

Got it a bit more? in big view, Restful API is Representation State Transfer, it’s about the architectural style, there’s no standard of how you build your restful API ( like if you write your drama there should be no standard pattern, right?), it’s all about the action between Browser | Server, and how you communicate with for the object you want get.

Here is sample graphic from above drama:

CrunchifyGot more clarify? So RestfulAPI is this drama whole picture gathers by: Browser| Web Server, action by method: GET, POST, PUT, DELET etc, and Browser will react the result to the web page.

When I finally get this concept, then you will see the key point is to communicate between Browser | Web Server, so what is this tool? Mostly we use http this media to connect both. So we got to finger out what is http request


What is http request?

This is like how to design method of communication, we could send the specific request and get the specific product we want directly or we could send the the common request and retrieve one of the product in the whole list. Depend on your request and also depend on how complexity of list products. Well, like the way we want range book category in our bookshelf

But in terms we could look at this way:

Nouns: like whole collects of our books, our resource, in http, we said this is like URL, for example

http: //{list}

Verbs: this is the way we act to book from our bookshelf, you could get the book, remove the book, in http, we use GET, POST, PUT,DELET.

Content types: The book info like book author name, editor, publish date. in http, we show this information with XML, JSON, YAML format.

Here is the graphic to show the whole concept:


So if I want book 1 , the URL could be like this to get book 1: http: //,

If I want the author info, publish date from book 1, the URL could be like this: http: //

Here we could get authorInfo : “John”, and publish date: “2016”

in JSON format will be looks like this:



“authorInfo” : “John”,

“publishDate”: “2016”



In this URL, we could use action by GET or POST to get those information. And different between GET & POST? you could look at here.

And action should be return back status, right?

So http has status code to show return status:

200: ok,

404: Not Found,

500: internal Server Error

Here’s link you could look all the different status


How do you look those API through web browser?

Open web browser, F12, you could click Network and see the api run through web event binding:

CaptureFor example here, the resource(nouns) is :

method is get

content type resource is: 376?model=touareg&zip=55344, which is json format:

CaptureAnd how will this information show in our final destination: web browser?

You could use any language, here I use javascript:

  1. first load this resource
  2. second define the condition, if process 1 is success, we need to get offers list deal, and get title: “499/month for 36 months.”
  3. if process 1 is not success, then web browser show show status
  4. And final show the result in web site

The concept code will be like this:

$('#main-menu a').click(function(event) {
   $.ajax(this.href, {
      success: function(data) {
      error: function() {
         $('#notification-bar').text('An error occurred');
         //console.log("fn xhr.status: " + xhr.status);

So the final expectation is show the title: 499/month for 36 months on the browser web page.


This is just basic concept, it has also lots method to use, Rest data elements, connectors, components. This could be description in whole book, but I think the basic Restful API concept is keep simple, cause original ideal is reduce communication work between front & backend. So if not keep it simple, then what does make sense to use it?

But it does true, keep it simple could be the most difficult part!! I am new in this too, so any error or lack of sense part please feedback as much as you could. thank you!!

5 Mistakes Web Developers Make When Working with MongoDB

downloadMongoDB has founded in 2007, until now it has more than 15 million downloads, it was really tread as cloud server make a prior choice by big data company. And you could build big data very fast by MongoDB, why MongoDB? how it does work? when it has became certain issue to pay attention with? Let’s try to get into the story!!

why MongoDB?

MongoDB is NoSQL database, NoSQL == Not Only SQL, the data structure is combined with key\value, like Json, the data type could be diver compare Relation DataBase, this is very flexible, but flexible could be disaster if not defined, organize data type efficiently!! As follow are couple reasons good for use MongoDB:

  1. For whom are front-end developer, this is much easier to learn then mysql, the MongoDB base language is Javasript & JSON
  2. MongoDB is for big data, you could de-normalize and flatten 6 tables into just 2 tables.
  3. MongoDB is Document based, if you have a tons of a single type of documents, then use Mongo

how it does work?

Install MongoDB

  1. download from
  2. De-zip your MongoDB
  3. Create file for database, for example: Data/mydb
  4. open cmd, to MongoDB path, $ mongod –dbpath ../data/mydb
  5. $ mongo , to check if it does work 4
  6. 4
  7. $ show dbs, then here you could see 2 data base are admin, local44
  8. And if you need to show down server, it has to excuse this $ db.shutdownServer(), this is important incase memory not leased, or sync up, destroyed

MongoDB basic usage

This part will show basic usage insert document, remove document, drop collection

1. insert, use cmd call out which db you want to insert, here is employee for example, insert name, account, country. and finally the data show as json:


2. Remove document

db.collection.remove({ condition }), justOne)

justOne: true | false, set if just remove the first data

if you want remove all: db.employee.remove({})

3. Drop document


The rest usage please look at mangoDB tutorial

when it has became certain issue to pay attention with?

there’s some points that you should avoid when use MongoDB

  1. No easy change other DB : When you choice MongoDB, this is not like other RDBMS ———-SQL, all NoSQL has it’s own API, if you had choice it, it won’t be easier to change another DB, example change MongoDB to Couchbase.
  2. Not support ACID: ACID is the basic item of Transaction, but most NoSQL DB not quarante ACID, you need more technical skill to practice this part
  3. Not support JOIN: because NoSQL DB is Non-relational, so it does not support JOIN. use MongoDB, it has to well-orientation Data Model in the first beginning, and you could use index and Aggregation to improve the filter performance.
  4. Document limited: not like RDBMS stock data in row, MongoDB stock data in document, these documents like JSON format. therefore has limited data size, the latest had supported to 16M. So you had to be careful not over to 16M.
  5. Filter search has to define correctly lowercase/uppercase, for example: db.people.find({name: ‘Russell’}) and db.people.find({name: ‘ russell’}) is different. you could filter by regex: db.people.find({name:/Russell/i}), but this will affected the performance.

Voila, this article is very primary presentation for MongoDB, just little mind sharing as first use of mangoDB.

Use Qunit to Access your input field testing efficient and quality

qunit_logoThere’s always excuse for our developer not write any test, well until you found out that your QA team had feedback tons of defects that might affect your refactor code… then that could be 10 times more awkward then just doing process to set up unit test.

I was lazy ass too until I found this Qunit and start to dig into, hence you completely love it and it is very easy to use as well. Besides, it’s will completely help your team not write panic code that you aren’t understand cos through testing, it has to been understandable and be maintainable, beside that, your QA team will be really happy cause they don’t need to send you tons of defects ticket!!

Here is the slideshare, if you want deep more….