Add pagination

songs/templates/songs/index.html

@@ -4,7 +4,18 @@
 
 {% block content %}
     <h1>Songs</h1>
-    <ul>
-        {% include 'components/song-table.html' with songs=songs %}
-    </ul>
+    {% include 'components/song-table.html' with songs=page_obj %}
+    <nav aria-label="Pages">
+        <ul class="pagination">
+            {% if page_obj.has_previous %}
+            <li class="page-item"><a class="page-link" href="?page=1">First</a></li>
+            <li class="page-item"><a class="page-link" href="?page={{ page_obj.previous_page_number }}">Previous</a></li>
+            {% endif %}
+            <li class="page-item"><a class="page-link" href="?page={{ page_obj.number }}">{{ page_obj.number }} of {{ page_obj.paginator.num_pages }}</a></li>
+            {% if page_obj.has_next %}
+            <li class="page-item"><a class="page-link" href="?page={{ page_obj.next_page_number }}">Next</a></li>
+            <li class="page-item"><a class="page-link" href="?page={{ page_obj.paginator.num_pages }}">Last</a></li>
+            {% endif %}
+        </ul>
+      </nav>
 {% endblock %}

songs/views.py

@@ -1,10 +1,14 @@
+from django.core.paginator import Paginator
 from django.shortcuts import render, redirect
 
 from .models import Song
 # Create your views here.
 def song_index(request):
     songs = Song.objects.all()
-    return render(request,'songs/index.html',{'songs':songs})
+    paginator = Paginator(songs, 100)
+    page_number = request.GET.get('page',1)
+    page_obj = paginator.get_page(page_number)
+    return render(request,'songs/index.html',{'page_obj':page_obj})
 
 def song_id(request, id):
     song = Song.objects.filter(id=id)[0]