Lekcja 4

Lekcja 4: Autoryzacja użytkowników – Bo nie każdy powinien mieć dostęp do twojego bloga!

Cześć znowu, mistrzowie kodu! 🧙‍♂️ Do tej pory stworzyliście bloga, dodaliście możliwość komentarzy i może nawet otrzymaliście takie opinie jak „Świetny font” lub „Dlaczego Comic Sans?”. Ale dzisiaj podnosimy poprzeczkę, bo nie każdy zasługuje na dostęp do twojego tajemniczego bloga.

Dziś dodajemy magię logowania i wylogowania. A żeby wszystko wyglądało schludnie, wprowadzimy wspólny szablon base.html, który nada twojemu blogowi elegancji. I oczywiście, dodamy przekierowanie po wylogowaniu, bo nikt nie chce utknąć na stronie „wylogowania”, prawda?

Krok 1: Aktywuj środowisko wirtualne (A.K.A. Załóż pelerynę czarodzieja)

Zanim zaczniemy czarować, upewnij się, że twoje środowisko wirtualne jest aktywne. To jak sprawdzenie, czy założyłeś pelerynę przed rzuceniem ognistej kuli. Nikt nie chce nieprzyjemności, prawda?

Sprawdź, czy środowisko jest aktywne, wpisując tę komendę:

echo $VIRTUAL_ENV

Jeśli widzisz ścieżkę w odpowiedzi, wszystko gra! Jeśli nie, aktywuj środowisko:

source venv/bin/activate

Kiedy zobaczysz (venv) na początku wiersza terminala, to znaczy, że jesteś w swoim przytulnym magicznym świecie, gdzie wszystkie zależności są bezpieczne jak pod ochronnym zaklęciem. 🛡️

Krok 2: Wbudowana autoryzacja (Django – twój czarodziejski lokaj)

Wyobraź sobie: Django już wszystko zrobił za ciebie! Ma wbudowaną funkcję autoryzacji użytkowników. Oznacza to, że nie musisz pisać logowania od zera (kto ma na to czas?). Django to jak twój magiczny lokaj, który wykonuje całą brudną robotę, a ty możesz się zająć czymś ważniejszym – na przykład wyborem idealnej przekąski podczas kodowania.

Zacznijmy konfigurację!

Otwórz plik myblog/myblog/urls.py (tak, dwa razy “myblog”) i dodaj te linijki, aby podłączyć funkcje logowania i wylogowania:

from django.contrib.auth import views as auth_views
from django.urls import path, include  # Dodajemy include do tras aplikacji

urlpatterns = [
    path('admin/', admin.site.urls),
    path('blog/', include('blog.urls')),  # Podłączamy trasy aplikacji bloga
    path('login/', auth_views.LoginView.as_view(), name='login'),
    path('logout/', auth_views.LogoutView.as_view(), name='logout'),
]

Teraz Django zajmie się logowaniem i wylogowaniem. To jak niewidzialny lokaj w twoim kodzie!

Krok 3: Przekierowanie po logowaniu i wylogowaniu (Bo nikt nie chce błąkać się bez celu)

Domyślnie Django przekierowuje użytkowników na /accounts/profile/ po logowaniu, ale bądźmy szczerzy – nikt nie chce wylądować na nudnej, przypadkowej stronie. Dostosujmy przekierowanie na stronę główną bloga, a także po wylogowaniu!

Dodaj przekierowanie po logowaniu:

Otwórz plik settings.py (znajduje się w myblog/myblog/settings.py) i dodaj tę magiczną linijkę:

# Przekierowanie na stronę główną bloga po logowaniu
LOGIN_REDIRECT_URL = '/blog/'

Dodaj przekierowanie po wylogowaniu:

Aby zapewnić eleganckie wylogowanie, dodaj również tę linijkę w settings.py:

# Przekierowanie na stronę główną bloga po wylogowaniu
LOGOUT_REDIRECT_URL = '/blog/'

Teraz każdy, kto się zaloguje lub wyloguje, zostanie teleportowany prosto na stronę główną bloga, gdzie dzieje się cała magia! 🎨

Krok 4: Stwórz szablon `base.html` (Wspólny fundament dla wszystkich stron)

Teraz dodajmy odrobinę stylu twojemu blogowi, bo nawet czarodzieje chcą dobrze wyglądać! Stworzymy szablon base.html, który będzie fundamentem dla wszystkich stron bloga. To jak twój zamek, w którym każda komnata (strona) może dodać coś unikalnego. 🏰

Stwórz plik base.html w folderze blog/templates:

myblog/
    blog/
        templates/
            base.html

Teraz dodaj poniższy kod do base.html:

<!DOCTYPE html>
<html lang="pl">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{% block title %}Mój Blog{% endblock %}</title>
</head>
<body>
    <header>
        <h1>Mój Blog</h1>
        <nav>
            <ul>
                <li><a href="{% url 'blog_index' %}">Strona Główna</a></li>
                <li>
                    {% if user.is_authenticated %}
                        <a href="{% url 'logout' %}">Wyloguj się</a>
                    {% else %}
                        <a href="{% url 'login' %}">Zaloguj się</a>
                    {% endif %}
                </li>
            </ul>
        </nav>
    </header>

    <div class="content">
        {% block content %}
        <!-- Tutaj pojawi się treść każdej strony -->
        {% endblock %}
    </div>

    <footer>
        <p>&copy; 2024 Mój Blog. Wszelkie prawa zastrzeżone. Tak, używamy ciasteczek.</p>
    </footer>
</body>
</html>

I oto nasz zamek! 🎉 Teraz mamy nagłówek, nawigację i stopkę gotowe na przyjęcie gości. Magia dzieje się wewnątrz {% block content %} – tam każda strona doda swoją unikalność. 🌟

Krok 5: Stwórz szablon `login.html` (Otwieramy magiczne wrota)

Teraz stwórzmy stronę logowania, aby użytkownicy mogli wejść do twojego bloga. Django oczekuje, że szablon login.html będzie znajdować się w folderze registration.

Stwórz folder registration w blog/templates:
- W folderze aplikacji blog, stwórz folder templates, jeśli go jeszcze nie ma, a następnie utwórz w nim folder registration.
Struktura powinna wyglądać tak:
```
myblog/
    blog/
        templates/
            registration/
                login.html
```
Dodaj ten kod do login.html, aby użyć szablonu base.html:

{% extends "base.html" %}

{% block title %}Zaloguj się{% endblock %}

{% block content %}
<h2>Zaloguj się do swojego konta</h2>
<form method="POST">
    {% csrf_token %}
    {{ form.as_p }}
    <button type="submit">Zaloguj się</button>
</form>
{% endblock %}

Teraz masz stronę logowania, która dziedziczy styl z base.html, więc wszystko będzie wyglądało spójnie. Teraz możesz wpuścić użytkowników – ale tylko tych wybranych! 😉

Krok 6: Zaktualizuj `blog_index.html` i `blog_post_detail.html`

Teraz, gdy mamy szablon base.html, zaktualizujmy pliki blog_index.html i blog_post_detail.html, aby również korzystały z tego szablonu.

6.1 Zaktualizuj `blog_index.html`

Otwórz myblog/blog/templates/blog_index.html i zamień kod na:

{% extends "base.html" %}

{% block title %}Strona Główna Bloga{% endblock %}

{% block content %}
<h2>Witamy na moim blogu!</h2>
<ul>
    {% for post in posts %}
        <li>
            <strong><a href="{% url 'blog_post_detail' post.pk %}">{{ post.title }}</a></strong> - {{ post.created_at }}
            <p>{{ post.content|truncatewords:30 }}</p>
            <a href="{% url 'blog_post_detail' post.pk %}">Czytaj dalej</a>
        </li>
    {% endfor %}
</ul>
{% endblock %}

Teraz nasza strona główna bloga wygląda elegancko i schludnie dzięki szablonowi base.html.

6.2 Zaktualizuj `blog_post_detail.html`

Otwórz plik myblog/blog/templates/blog_post_detail.html i zaktualizuj go:

{% extends "base.html" %}

{% block title %}{{ post.title }}{% endblock %}

{% block content %}
<h2>{{ post.title }}</h2>
<p>{{ post.created_at }}</p>
<p>{{ post.content }}</p>

<h3>Komentarze</h3>
<ul>
    {% for comment in comments %}
        <li><strong>{{ comment.author }}</strong>: {{ comment.content }}</li>
    {% empty %}
        <li>Brak komentarzy. Bądź pierwszą osobą, która skomentuje!</li>
    {% endfor %}
</ul>

<h3>Zostaw komentarz</h3>
<form method="POST">
    {% csrf_token %}
    {{ form.as_p }}
    <button type="submit">Wyślij</button>
</form>
{% endblock %}

Teraz strony z postami również korzystają z naszego nowego szablonu.

Krok 7: Dodaj link do wylogowania (Bo każdy wyjście zasługuje na stylowe zamknięcie)

Co to za logowanie, jeśli nie można się wylogować? W szablonie base.html już dodaliśmy link do wylogowania w nawigacji. Będzie on dynamicznie zmieniać się w zależności od tego, czy użytkownik jest zalogowany, czy nie:

{% if user.is_authenticated %}
    <a href="{% url 'logout' %}">Wyloguj się</a>
{% else %}
    <a href="{% url 'login' %}">Zaloguj się</a>
{% endif %}

To jak magiczne drzwi – kiedy wychodzisz, cicho zamykają się za tobą (pewnie po to, żebyś mógł pójść po kawę).

Krok 8: Testujemy magię (Tu zaczyna się zabawa!)

Czas przetestować funkcje logowania i wylogowania!

Uruchom serwer:

python3 manage.py runserver

Przejdź na http://127.0.0.1:8000/login/ i spróbuj się zalogować. Po zalogowaniu zostaniesz przekierowany na http://localhost:8000/blog/ (lub tam, gdzie ustawiłeś w LOGIN_REDIRECT_URL).

Sprawdź również wylogowanie – zostaniesz przekierowany z powrotem na stronę główną bloga po wylogowaniu.

Krok 9: Stwórz konto superużytkownika (Bo każdy zamek potrzebuje swojego króla)

Zanim zakończymy lekcję, nie zapomnij stworzyć konta superużytkownika. Dzięki temu będziesz miał pełną kontrolę nad blogiem!

Uruchom tę komendę:

python3 manage.py createsuperuser

Wypełnij pola i voilà – teraz jesteś superużytkownikiem, który ma pełny dostęp do panelu administracyjnego.

Krok 10: Dezaktywuj środowisko wirtualne (Bo nawet czarodzieje muszą odpocząć)

Gdy skończysz na dziś (albo uznasz, że czas na przekąskę), nie zapomnij dezaktywować swojego wirtualnego środowiska:

deactivate

Teraz możesz spokojnie cieszyć się swoją przekąską, wiedząc, że twój blog na Django działa jak należy.

Podsumowanie Lekcji 4

I oto mamy! 🎉 Dodałeś autoryzację użytkowników (logowanie i wylogowanie), skonfigurowałeś elegancki szablon base.html i przekierowanie po logowaniu i wylogowaniu. Teraz użytkownicy mogą zalogować się, zostawić komentarze i czuć się jak u siebie na stronach twojego bloga!

W następnej lekcji zajmiemy się rejestracją użytkowników, żebyś mógł przyciągnąć subskrybentów (którzy na pewno będą komentować twoje genialne posty). A tymczasem – odpocznij i podziwiaj swoją magię kodowania, może z herbatką i kawałkiem ciasta. 🍰