Solution

static/css/styles.css

@@ -1,3 +1,4 @@
 body {
     margin-top: 20px;
+    background: beige;
 }

taxi/urls.py

@@ -1,9 +1,23 @@
 from django.urls import path
 
-from .views import index
+from .views import (
+    index,
+    ManufacturerListView,
+    CarListView,
+    CarDetailView,
+    DriverListView,
+    DriverDetailView
+)
+
 
 urlpatterns = [
     path("", index, name="index"),
+    path("manufacturers/", ManufacturerListView.as_view(),
+         name="manufacturer-list"),
+    path("cars/", CarListView.as_view(), name="car-list"),
+    path("cars/<int:pk>/", CarDetailView.as_view(), name="car-detail"),
+    path("drivers/", DriverListView.as_view(), name="driver-list"),
+    path("drivers/<int:pk>/", DriverDetailView.as_view(), name="driver-detail")
 ]
 
 app_name = "taxi"

taxi/views.py

@@ -1,4 +1,5 @@
 from django.shortcuts import render
+from django.views import generic
 
 from taxi.models import Driver, Car, Manufacturer
 
@@ -13,3 +14,29 @@ def index(request):
     }
 
     return render(request, "taxi/index.html", context=context)
+
+
+class ManufacturerListView(generic.ListView):
+    model = Manufacturer
+    queryset = Manufacturer.objects.all().order_by("name")
+    paginate_by = 5
+
+
+class CarListView(generic.ListView):
+    model = Car
+    queryset = Car.objects.all().select_related("manufacturer")
+    paginate_by = 5
+
+
+class CarDetailView(generic.DetailView):
+    model = Car
+
+
+class DriverListView(generic.ListView):
+    model = Driver
+    paginate_by = 5
+
+
+class DriverDetailView(generic.DetailView):
+    model = Driver
+    queryset = Driver.objects.all().prefetch_related("cars__drivers")

templates/base.html

@@ -6,9 +6,9 @@
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <link rel="stylesheet"
-      href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
-      integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2"
-      crossorigin="anonymous">
+        href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
+        integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2"
+        crossorigin="anonymous">
   <!-- Add additional CSS in static file -->
   {% load static %}
   <link rel="stylesheet" href="{% static 'css/styles.css' %}">
@@ -29,6 +29,7 @@
       {% block content %}{% endblock %}
 
       {% block pagination %}
+        {% include 'includes/pagination.html' %}
       {% endblock %}
 
     </div>

templates/includes/pagination.html

@@ -0,0 +1,14 @@
+{% block pagination %}
+  {% if is_paginated %}
+    <ul class="pagination">
+      {% if page_obj.has_previous %}
+        <li class="page-item"><a class="page-link" href="?page={{ page_obj.previous_page_number }}">Prev</a></li>
+      {% endif %}
+      <li class="page-item-active"><span
+          class="page-link">{{ page_obj.number }} of {{ paginator.num_pages }}</span></li>
+      {% if page_obj.has_next %}
+        <li class="page-item"><a class="page-link" href="?page={{ page_obj.next_page_number }}">Next</a></li>
+      {% endif %}
+    </ul>
+  {% endif %}
+{% endblock %}

templates/includes/sidebar.html

@@ -1,6 +1,14 @@
 <ul class="sidebar-nav">
-  <li><a href="#">Home page</a></li>
-  <li><a href="#">Manufacturers</a></li>
-  <li><a href="#">Cars</a></li>
-  <li><a href="#">Drivers</a></li>
+  <li class="list-group-item">
+    <a href="{% url 'taxi:index' %}">Home page</a>
+  </li>
+  <li class="list-group-item">
+    <a href="{% url 'taxi:manufacturer-list' %}">Manufacturers</a>
+  </li>
+  <li class="list-group-item">
+    <a href="{% url 'taxi:car-list' %}">Cars</a>
+  </li>
+  <li class="list-group-item">
+    <a href="{% url 'taxi:driver-list' %}">Drivers</a>
+  </li>
 </ul>

templates/taxi/car_detail.html

@@ -0,0 +1,22 @@
+{% extends "base.html" %}
+
+{% block content %}
+  <h1>
+    Car: {{ car.model }}
+  </h1>
+  <p><strong>Manufacturer: </strong>
+    {{ car.manufacturer.name }} ({{ car.manufacturer.country }})
+  </p>
+  <div class="ml-3">
+    <h3>Drivers:</h3>
+    {% for driver in car.drivers.all %}
+      <hr>
+      <p>Username: {{ driver }}</p>
+      <p>First name: {{ driver.first_name }}</p>
+      <p>Last name: {{ driver.last_name }}</p>
+      <p>License number: {{ driver.license_number }}</p>
+    {% empty %}
+      <p>No drivers!</p>
+    {% endfor %}
+  </div>
+{% endblock %}

templates/taxi/car_list.html

@@ -0,0 +1,14 @@
+{% extends "base.html" %}
+
+{% block content %}
+  <h1>Car list</h1>
+  {% if car_list %}
+    <ul>
+      {% for car in car_list %}
+        <li><a href="{% url 'taxi:car-detail' car.id %}">
+          {{ car.model }} ({{ car.manufacturer.name }})
+        </a></li>
+      {% endfor %}
+    </ul>
+  {% endif %}
+{% endblock %}

templates/taxi/driver_detail.html

@@ -0,0 +1,20 @@
+{% extends "base.html" %}
+
+{% block content %}
+  <h1>
+    Driver: {{ driver.first_name }} {{ driver.last_name }}
+  </h1>
+  <p><strong>Username: </strong>{{ driver.username }}</p>
+  <p><strong>E-mail: </strong>{{ driver.email }}</p>
+  <p><strong>License number: </strong>{{ driver.license_number }}</p>
+  <div class="ml-3">
+    <h3>Cars:</h3>
+    {% for car in driver.cars.all %}
+      <hr>
+      <p>ID: {{ car.id }}</p>
+      <p>Car: {{ car.model }}</p>
+    {% empty %}
+      <p>No cars!</p>
+    {% endfor %}
+  </div>
+{% endblock %}

templates/taxi/driver_list.html

@@ -0,0 +1,14 @@
+{% extends "base.html" %}
+
+{% block content %}
+  <h1>Driver list</h1>
+  {% if driver_list %}
+    <ul>
+      {% for driver in driver_list %}
+        <li><a href="{% url 'taxi:driver-detail' driver.id %}">
+          {{ driver.first_name }} {{ driver.last_name }}
+        </a></li>
+      {% endfor %}
+    </ul>
+  {% endif %}
+{% endblock %}

templates/taxi/manufacturer_list.html

@@ -0,0 +1,12 @@
+{% extends "base.html" %}
+
+{% block content %}
+  <h1>Manufacturer list</h1>
+  {% if manufacturer_list %}
+    <ul>
+      {% for manufacturer in manufacturer_list %}
+        <li>{{ manufacturer.name }}</li>
+      {% endfor %}
+    </ul>
+  {% endif %}
+{% endblock %}