Monday 23 July 2018

Single Page Applications and AEM

What is Single Page Applications - SPA?

Single Page applications are pages which dynamically update its content using AJAX calls to create a fluid & responsive experience.

In traditional applications, each request reloads/renders the HTML; but in SPA all interactions happens through AJAX calls. The return data is in JSON format. Previous versions of AEM had a miss on the SPA but with upcoming releases AEM SPA Editor provides a wonderful solution for supporting SPAs within AEM.

Single Page Applications - Features


  • This avoids page reloading.
  • Reusable Content.
  • Majority of the work happens in client side.
  • Good separation between content and UI
  • Provides interactive experience
  • RESTFul JSON


SPA(Single Page Applications) Basics

Below image gives an overview on the Single Page Applications in general.
As mentioned, only the first request is responded with a complete HTML. Further requests are made in AJAX way to the server and response in provided in JSON format.


SPA with AEM.
Latest AEM releases are enabling users to develop Single Page Applications using AEM. AEM SPA Editor allows user to author a page with Content Fragments in addition to other normal components like title, footer, images etc and AEM Sling models generate the Page equivalent JSON. This RESTFul JSON can be made available for other SPA frameworks like Angular React etc.


 In upcoming posts, I will explain, how to create SPA in AEM.


Video version of the post is available below.

 

AEM 6.4 related posts:
Create Content Fragments : Step By Step Tutorial
Content Fragment out put as JSON

No comments:

Post a Comment