Cos opposite, sine complement, cross side, different pi tan

(The cosine of two opposite angles is equal; the sine of the two complementary angles is equal; the diagonal side is two extra angles, the sine angle is this = cos the other angle, this angle is cot the other angle; the tan of two angles is less than pi then equal).

With the above line of poetry is not too strange with the predecessors anymore (hihi). Why did I quote this verse. Because, what I want to say is a bit related to the content I’m about to write . That’s when learning something new that is hard to remember, hard to imagine often people will try to think of poems or things that can relate to reality.

Yes! And this article is the same, to better understand the term AJAX and how it works, why use it, I associated a website as a fast food restaurant to learn AJAX quickly. Quickly and remember longer. To explain more, please read along this article of me!

What is AJAX?

AJAX stands for Asynchronous JavaScript and XML . It is a set of web design techniques that help web applications work asynchronously – handling all requests to the server from behind. To better understand, I will explain with each term to tell you what is AJAX?

Asynchronous, JavaScript, XML in the word AJAX are:

Asynchronous , or Async for short – asynchronous. Asynchronous means that a program can process non-sequential functions, no processes, can skip a certain step. The most obvious benefit of asynchrony is that the program can handle multiple jobs at once.

JavaScript is a famous programming language. Among its many functions are the ability to manage dynamic website content and support interaction with users.

XML is a form of markup language like HTML, its full text is eXtensible Markup Language. If HTML is used to display data, XML is designed to contain data.

Both JavaScript and XML operate asynchronously in AJAX. As a result, many web applications can use AJAX to send and receive data from the server, not the entire page

What does AJAX look like?

No one is new to Facebook, did you notice when commenting on a Facebook post without reloading the entire page? That’s because AJAX is working. AJAX allows users to interact with the web application without completely reloading the page.

Imagine if every time you dropped the tym for the post “woof woof” or comment praised your sweetheart, the page would reload? That is bad . Instead, Facebook has turned into a talented magician, it will add your ‘comment’ or ‘like’ to the post quickly and allow you to continue reading.

Why do we need AJAX?

There are 4 main benefits of using AJAX:

• Callbacks : Ajax is used to make a callback. AJAX performs retrieving and / or saving data without sending the entire page back to the server. In limited bandwidth sites, this can significantly improve performance.
• Make asynchronous calls : This allows the user browser to avoid having to wait for all incoming data before allowing the user to take action again.
• User friendly : Because there is no need to post the page back to the server.
• Speed ​​up : The main purpose of Ajax is to improve the speed, performance, and usability of a web application.

How vague the theory . To know more about why we need AJAX, we will take a more intuitive example.

Imagine your entire web application as a fast food restaurant. You act as a receptionist, everyone wants to order things through you. Your task is to process requests from the customer.

With this diagram, we can see 3 separate tasks to perform.

1. The receptionist must handle user requests at a fast pace.
2. You need a chef to put bread on the grill and prepare all the dishes.
3. You need a food team to pack food and put it into a bag or a tray.

With no AJAX processing, you will only be allowed to process 1 order at a time from start to finish. That is, you will receive orders, then charge for customers, after sitting there doing nothing while the chef is preparing food. When the chef has finished preparing the food, continue to wait for the group to pack the food they have prepared. You will only receive 1 next order after all processes have been completed.

Actually, the above is a bad user experience. If a restaurant sold this way would soon go bankrupt (ahuhu).

To handle that we will use AJAX. You will be able to request data or submit data without loading the entire page. This is similar to how a restaurant operates. As receptionist will take orders from customers, send it to the kitchen team and ready to accept customer orders.

How to make a POST request

As a receptionist, you need to send customers’ requests to the kitchen so that the people there can prepare food for customers. And you can do that with the POST request.

In code, it works to retrieve data from the server using the HTTP POST REQUEST method .

Syntax:

• URL : required, the path to the file to get information.
• data : optional, is an object object with the key: value sent to the server.
• function (data, status, xhr) : is the function that will handle when successful implementation of the parameters. With:
  • data : includes the data returned from the request.
  • status : includes request status (‘success’, ‘notmodified’, ‘error’, ‘timeout’, ‘parserror’).
  • xhr : includes XMLHttpRequest objects.
• dataType : is the form of data returned (text, json, script, xml, html, jsonp).

When ordering food, there will be many orders and each order will have a different category. For example, here I have 2 orders.

1. Only fries.
2. 1 combo order including burgers, chips, and drinks.

Each order corresponds to 1 request. So we need different URLs.

Next is the data . This is an object that tells us a little bit more about the request. With the URL for the combo order, we need to know:

1. The main dishes.
2. Drinks.
3. Price.
4. Other special requirements.

For the URL for an order containing only french fries, we only need:

1. Size of chips.
2. Price.

For an example of a combo order: a cheese burger with Pepsi costs $ 6.00, the code we have:

The order variable will hold the content of the order. And then we will put it in the POST request to send kitchen staff know what to prepare for this combo order.

But we can’t let the code run randomly! We need an event to trigger that request. In this case, a customer’s order at the restaurant will be the same as a person who clicked the ‘Order’ button on the website. We can use JQuery’s event click () to run a POST request when the user clicks the button.

Once the customer’s order has been sent, we need to tell the customer something. So we can use it in the callback () function to show that the order has been submitted.

How to create a GET request

We have just sent an order. Now, we need a way to deliver that order to our customers. To receive data requests from the server (or here is the kitchen), we use the GET request . Please note: now, our database is full of orders. This is an important difference because GET requests do not change the database , it only provides information for the front-end. And the POST request will change the information in the database that can be added, modified or canceled.

Syntax:

Before returning items to guests, the receptionist will often ask a few questions:

1. Would you like to eat here or take away?
2. Do you need any spices (like ketchup or mustard …)?
3. What is the number listed on the receipt (used to verify if the food is yours)?

So let’s say you put 3 combos. You want to eat at a restaurant, need ketchup, and the number on the receipt is 999. We can make a GET request with the URL ‘/ comboMeal’, similar to the POST request with 1 URL. But, this time we need different data. It is a completely different type of request. The same URL name only allows us to manage the code more easily.

Similar to the above, to answer the questions that the receptionist asked, we can create an event click () .

And finally, to get the food, we need to use the callback () function.

Theoretically variable data, will contain the content in that combo order. It depends on how it is written on the back-end!

summary

Through this visual representation of the real world, it can help you better understand the whole process of how AJAX works. This article has many shortcomings, hope everyone understands and can give their ideas to draw experience for the following articles. Thank you for your interest in my post (bow).

Refer:

https://wiki.matbao.net/kb/ajax-la-gi-cach-su-dung-ajax-toi-uu-nhat/

https://medium.com/free-code-camp/ajax-basics-explained-by-working-at-a-fast-food-restaurant-88d95f5fcb7a

https://www.w3schools.com/Js/js_ajax_intro.asp