CI4 Views and Ajax

Hi all, 

Firstly I am extremely happy to learn this myself, I will describe my problem, and what I am looking for are what to learn/read/do to resolve this problem.

I have a site thats using a layout that contains the following section

PHP Code:

<main role="main" class="wrapper">
  <?= $this->renderSection('main') ?>
</main> 


I also have many pages that have controllers that are loaded as such

PHP Code:

return view($this->config->views['messages'], [
    'userData' => $this->session->userData,
    'config' => $this->config
]); 


I have my routes setup and it works great.

Also in my layout (currently until i move it) I have a navigation section to load the different controllers.
For example
http://localhost:8080/messages uses my Messages controller and my messages.php page houses the php/html code
http://localhost:8080/services uses my Services controller and my services.php page houses the php/html code

All of this is wired up with the routes.


The main issue I have is I don't want to reload the page every time. 
When i press the services button in the nav, I would like it to replace the messages section (thats currently being generated in the rendersection)

I believe its AJAX I need to do this, but what I am not sure about is how I use Ajax and JQuery to swap out the rendersection to the other page/controller.

I apologise if this is really difficult to read. Please ask questions if you need more information.

Any help is greatly appreicated!