Checkout in Magento 2 has been re-implemented from scratch. Now it is true single page application (SPA).

Single Page Application

Let me explain what “true” means in SPA. While user performs various interactions with Checkout functionality e.g. entering email, selecting a shipping method, clicking Next button, all requests sent from client’s browser to a server are AJAX or asynchronous.

Server-side when receiving AJAX request processes, prepares and sends back response data to a client browser using JSON format. Checkout functionality no longer transfers chunks of rendered HTML blocks.

New Checkout is implemented as a separate application. If you expect the very high volume of orders at your online website, it might be a good idea to think about running Checkout on a separate server. Unfortunately, this feature is only available for Enterprise Edition clients.

Model-View-ViewModel

Checkout in Magento 2 is based on new UI Components which is also new. It is based on Model-View-ViewModel design pattern with the support of KnockoutJS library. However it does not mean new Checkout is based on KnockoutJS, this might be a false assumption. It is based on UI Components which use additional libraries including KnockoutJS, sometimes jQuery, UnderscoreJS.

We no longer have to “edit core code” to introduce new functionality in Magento 2 with new Checkout. It might not be as simple and as fast as we get use to with Magento 1, however it worth trying to understand how Checkout in Magento 2 works. So we may create interesting features elegantly with backward compatibility in mind.

Videos and Articles

TOP 1 video you should have a look from Rebecca Magento Channel and 2 articles about Checkout functionality in Magento 2 written by Magento DevDocs and Inviqa.

The Magento Monthly News

Rebecca has just uploaded new video – The Magento Monthly News. You may find lots of interesting events happened during November, you may be sure there were a lot. You may also download PDF version of Magento November News.

A technical guide to the Magento 2 checkout

Inviqa team has posted a detailed article about Checkout in Magento 2. The information will help you to get up to speed with frontend architecture including KnockoutJS usage, rendering, and overview of UI Components usage.

Customise Checkout – Official Documentation

There are a good few examples at official Magento Documentation website about customizing Checkout functionality in Magento 2. This is a must have to read before any development work!

Follow updates on Twitter at @_TheDevletter, and let me know how you’re doing.

Keep coding,

Max