Eu estou me aventurando em frontend, estou com dificuldade como eu coloco o conteudo de uma pagina em um sidebar
exemplo: se eu clicar em 'perfil' apareça o conteúdo do perfil do lado se clicar em 'voo' o conteúdo do voo parece do lado.
{% extends "base.html" %}
{% block content %}
<body>
<div class="d-flex" id="wrapper">
<!-- Sidebar -->
<div class="bg-light border-right" id="sidebar-wrapper">
<div class="sidebar-heading">
<table>
<tr valign="top">
<td><img src="{{ user.avatar(160) }}"></td>
</tr>
<tr><td><h1>Olá {{ user.username }}</h1></td></tr>
</table>
</div>
<div class="list-group list-group-flush">
<a href="#" class="list-group-item list-group-item-action bg-light">Perfil</a>
<a href="teste.html" class="list-group-item list-group-item-action bg-light">Voos</a>
<a href="#" class="list-group-item list-group-item-action bg-light">Check-in</a>
<a href="#" class="list-group-item list-group-item-action bg-light">Pilotos</a>
<a href="#" class="list-group-item list-group-item-action bg-light">Eventos</a>
<a href="#" class="list-group-item list-group-item-action bg-light">Financeiro</a>
</div>
</div>
<!-- /#sidebar-wrapper -->
<!-- Page Content -->
<div class="container-fluid">
<h1 class="mt-4">Simple Sidebar</h1>
<p>The starting state of the menu will appear collapsed on smaller screens, and will appear non-collapsed on larger screens. When toggled using the button below, the menu will change.</p>
<p>Make sure to keep all page content within the <code>#page-content-wrapper</code>. The top navbar is optional, and just for demonstration. Just create an element with the <code>#menu-toggle</code> ID which will toggle the menu when clicked.</p>
</div>
</div>
<!-- /#page-content-wrapper -->
</div>
<!-- /#wrapper -->
<!-- Bootstrap core JavaScript -->
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- Menu Toggle Script -->
<script>
$("#menu-toggle").click(function(e) {
e.preventDefault();
$("#wrapper").toggleClass("toggled");
});
</script>
</body>
{% endblock %}