Synchronizing different modules on the same page

Hi,

I need your help, I can not find out how to implement the structure like on the site https://www.joomlashine.com/blog/free-ebook-joomla-25-made-easy-a-pocket-manual-for-joomla-newbies.html:

I refer the attached screenshot with the marked green / blue / red areas.

It works a follows:

1) Initially the green area is filled with a list of posts
2) Selecting a post in the green area shows the selected post in the same green area
3) Selecting a post in the red area (Most popular) shows the selected post in the green area
4) Selecting a Tag in the blue area shows the appropriate posts in the green area

I recognized the following functionality:

A) The green area is a multipurpose area: single post / list of posts
B) There is a communication between green and red/ blue

Could you please advice me, how to implement it ?

Thanks a lot in advance,

Michel