En guide för att bygga en URL Shortener-app med Django

Det bästa sättet att lära sig Django, eller vilken färdighet som helst, är genom att tillämpa den kunskap du har genom att skapa funktionella projekt.

Django är det mest använda Python-webbutvecklingsramverket. Dess inbyggda funktioner och omfattande mängd paket från tredje part har gjort det till ett av de mest älskade webbramverken runt om i världen.

Den är snabb, pålitlig och har många inbyggda funktioner. Till exempel ett hålautentiseringssystem som låter dig fokusera på huvudfunktionerna i din app. Du kan också installera externa paket för att utföra ännu mer komplexa uppgifter, som Django-allauth, som låter dig registrera användare med deras sociala konton.

Men låt oss avslöja några fakta. Django är ett så stort ramverk som ibland är utmanande att komma igång med det.

Så idag ska du bygga från grunden en helt funktionell Django-applikation.

I slutet av denna handledning kommer du:

  • Har skrivit en URL-förkortningsapp
  • Förstå Django MVT-mönstret
  • Har lärt dig arbetsflödet för att skapa ett projekt

Förkrav

Alla följande krav är valfria och hjälper dig att följa handledningen. Men om du inte har erfarenhet av någon av dessa, oroa dig inte. Det viktigaste steget är det första.

  • Grundläggande förståelse för UNIX-kommandon (ls, cd, rm, touch)
  • Grundläggande förståelse för Python-klasser och funktioner
  • Python installerat på din dator (kanske uppenbart men jag var tvungen att inkludera det)
  • Det skulle vara bra om du redan har byggt något med Django

All arbetskod kommer att finnas tillgänglig på detta Github repo.

Nu när du har kristallklart de tidigare begreppen, låt oss gå in på saken.

Projektbeskrivning

I den här handledningen ska du bygga en URL-förkortare. I grund och botten är en URL-förkortare en tjänst som tar en lång URL och förvandlar den till en kompakt sådan.

Om du till exempel vill dela en tweet och vill inkludera en länk till din webbplats, men du står inför teckengränsen, kan du använda en URL-förkortare.

Låt oss se det med en grafik.

Som du kan se får URL-förkortaren en lång URL och returnerar en kort. Det är precis vad du ska bygga idag.

Med det här projektet kommer du att träna på användningen av MVT-mönstret, lära dig grunderna i databasdesign med Django-modeller och lära dig hur du visar information för användaren genom vyer, webbadresser och mallar.

Struktur för ett Django-projekt

I grund och botten är en Django-webbplats byggd på ett enda projekt och flera separerade appar. Var och en av dessa appar har specifik funktionalitet och den kan fungera av sig själv.

Låt oss föreställa oss en komplex webbapplikation som Stackoverflow. Dess funktionalitet är baserad på två huvudaspekter.

  • Användarhantering: Logga in, Logga ut, Rykte, Behörigheter
  • Forum: Frågor, svar, taggar, filter

Så efter Django-webbplatsstrukturen skulle projektet få namnet StackOverflow som har två huvudappar. Användarnas app och forumappen.

Var och en av dessa appar har fristående funktionalitet. Det betyder att båda innehåller all kod som de behöver för att fungera korrekt.

Det inkluderar modeller (databasstruktur), vyer (förfrågningar och svar), specifika URL-mönster och naturligtvis mallar och statiska filer (bilder, CSS, JavaScript). Detta innebär att alla Django-appar kan återanvändas eftersom de kan fungera själva.

Förkortning, ett projekt hänvisar till en uppsättning konfigurationer och appar som är avsedda att bygga en webbapplikation. Å andra sidan är en Django-app en del av ett projekt, som är fristående (har allt den behöver för att fungera), och dess syfte är att utföra en specifik operation.

Skapa ett Django-projekt

I det här avsnittet ska du sätta upp ett Django-projekt. För det ändamålet kommer du att använda olika verktyg som en virtuell miljö för att organisera Python-beroenden och de viktigaste Django-skripten. Django-admin och manage.py

Virtuell miljö

Jag rekommenderar alltid att arbeta med virtuella miljöer när du bygger appar med Django. Det är det mest effektiva sättet att upprätthålla en specifik uppsättning beroenden. Men dess huvudsakliga syfte är att isolera utvecklingspaketen från de globala.

Så låt oss skapa en virtuell miljö med python det inbyggda formulärkommandot.

Obs: Denna metod kräver Python 3.6 eller nyare versioner för att fungera.

python -m venv .venv

Detta kommando använder kommandot python -m eller python –mod. I grund och botten kör den en modul eller ett bibliotek, som ett skript. Enligt innebörden av detta kommando är venv biblioteket som vi kör, och .venv refererar till namnet på den virtuella miljö vi vill skapa.

Så i klartext betyder detta kommando.

Hej Python, kör det inbyggda biblioteket venv som ett skript och skapa ett virtualenv-namn .venv

Nu är det dags att aktivera den virtuella miljön vi just skapade, med följande kommando.

source .venv/bin/activate

För att hävda att du har noll paket installerade i den nya venv, kör du.

pip freeze

Om du aktiverade den virtuella miljön korrekt får du ingen utdata. Det beror på att vi inte har installerat något ännu.

Låt oss komma in på Django

För att skapa vår URL-förkortningsapplikation kommer vi att börja med att installera Django-paketet. Django är ett tredjepartspaket, därför måste vi installera det med Pip (Pip Installs Packages).

$ pip install django
Collecting django
  Downloading Django-3.2.1-py3-none-any.whl (7.9 MB)
     |████████████████████████████████| 7.9 MB 344 kB/s 
Collecting asgiref<4,>=3.3.2
  Using cached asgiref-3.3.4-py3-none-any.whl (22 kB)
Collecting sqlparse>=0.2.2
  Using cached sqlparse-0.4.1-py3-none-any.whl (42 kB)
Collecting pytz
  Using cached pytz-2021.1-py2.py3-none-any.whl (510 kB)
Installing collected packages: asgiref, sqlparse, pytz, django
Successfully installed asgiref-3.3.4 django-3.2.1 pytz-2021.1 sqlparse-0.4.1

Notera: Kom ihåg att $ inte är något annat än din skalsymbol.

För att kontrollera om installationen gick korrekt kontrollerar vi igen de installerade paketen för vår venv.

$ pip freeze
asgiref==3.3.4
Django==3.2.1
pytz==2021.1
sqlparse==0.4.1

Oroa dig inte om versionerna du får skiljer sig från mina. Om Django stillbilder på version 3.x kan du fortsätta utan problem.

Startar ett Django-projekt

När du har installerat Django är det dags att skapa strukturen för webbsidan för URL-förkortare. Kommer du ihåg vad ett Django-projekt är? Låt oss skapa en genom att köra följande kommando.

django-admin startproject config

För att förklara allt om detta kommando, är django-admin ett kommandoradsverktyg som utför alla nödvändiga uppgifter för att skapa ett Django-projekt. ”startproject”-delen är kommandot som körs av Django-admin-verktyget, och config är namnet på projektet vi ska skapa.

Är viktigt att betona att config kan vara vilket namn du vill. Anledningen till att jag använder config som namn på det här projektet är bara på grund av bekvämligheten. Det är trevligt att växla mellan projekt och ändå ha samma namnkonvention. Så var inte rädd för att använda andra projektnamn när du vill.

Som du kanske märker nu har du en config/mapp och inuti finns det många filer. Senare kommer vi att se projektets filstruktur. För nu, låt oss gå in i projektkatalogen och köra den lokala servern.

cd config/

Den viktigaste filen du kommer att använda är manuset manage.py. Den har samma funktionalitet som django-admin, men den största fördelen med att använda den är att du kan hantera inställningarna när du kör projektet.

Låt oss nu se om allt fungerar som det ska.

python manage.py runserver

Skapar URL-förkortningsappen

Det är dags att skapa projektets huvudapp. Du kommer att använda filen manage.py för att utföra denna uppgift.

python manage.py startapp urlshortener

Detta skapar en Django-app, med namnet urlshortener. Om du kör träd kommando får du något sånt här.

.
├── config
│   ├── asgi.py
│   ├── __init__.py
│   ├── settings.py
│   ├── urls.py
│   └── wsgi.py
├── manage.py
└── urlshortener
    ├── admin.py
    ├── apps.py
    ├── __init__.py
    ├── migrations
    │   └── __init__.py
    ├── models.py
    ├── tests.py
    └── views.py

Låt oss förtydliga de olika filerna som skapats fram till nu. ”config” är namnet på vårt projekt och det heter så bara för konventionen. Inuti config får du settings.py, det är filen där du ställer in alla inställningar för ditt projekt. urls.py är webbadressernas övergripande konfiguration i projektet. Den definierar URL-vägarna för alla applikationer i projektet.

Oroa dig inte för mycket om filerna asgi.py och wsgi.py. Det här är filer som låter dig konfigurera din applikation under driftsättning.

manage.py är python-skriptet som låter dig köra alla tillgängliga kommandon Django-admin.

Om du tar en titt inuti urlshortener som är namnet på appen du just skapade, kanske du märker att det finns en konstig mapp som heter ”migrations/” och några andra filer som är avgörande för logiken i alla appar.

apps.py är där appkonfigurationen finns. Vanligtvis bråkar du inte med det, förutom att du gör ganska förhandsgrejer.

admin.py är där du registrerar dina modeller för att göra dem synliga i Djangos adminpanel.

models.py är den viktigaste. Inuti denna modul måste du definiera modellerna, som (vagt sagt) är hur data lagras. Du får höra mer om modeller senare.

migrations/ är mappen där Django-migreringarna lagras. Vi kommer att ta en fördjupning senare.

tests.py är filen där testerna lagras. Vi kommer inte att täcka testning i denna handledning.

views.py är filen som lagrar vyer. I grund och botten definierar det hur användaren kommer att interagera med alla aspekter av din app.

Installera en Django-app

Innan du fortsätter öppnar du filen settings.py och ändrar variabeln INSTALLED_APPS genom att lägga till urlshortener-appen.

# Application definition

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    # Custom apps
    'urlshortener',
]

Detta är en rutinprocess när du skapar en app. Så varje gång du gör det, glöm inte att installera det i projektinställningarna.

Förstå MVT-mönstret

Mönstret Model, View, Template är det mjukvarudesignmönster som Django-utvecklare använder för att skapa webbapplikationer.

Den bygger på 3 huvudkoncept. Modell (data), View (Användarinteraktion med data), Mall (Hur användarna ser data).

Modeller är Python-klasser, som definierar alla fält och beteende för den data du är villig att lagra. Normalt refererar varje modell till en unik tabell i databasen

Views i deras enklaste uttryck, är callables som tar en begäran från användaren och genererar ett svar. Mellan den processen uppstår affärslogiken. Jag vet att ”affärslogik” är ett ganska oklart begrepp, så låt mig förklara exakt vad det är. Affärslogik är hur data skapas, lagras och raderas, det är allt.

Slutligen är mallar textdokument (vanligtvis HTML) som visas för användarna. Dess syfte är att presentera data så ren som möjligt. Django innehåller ett minispråk som kallas Django mallspråk (DTL) som låter dig införliva en del av kraften i python i textdokument.

Skapa Shortener-modellen

När du har fått ett snabbt grepp om MVT-mönstret, låt oss börja skapa Django URL-förkortare från början.

Först av allt, låt oss definiera förkortningsmodellen inuti filen models.py.

'''
Url shortener model
'''

from django.db import models

# Create your models here.

class Shortener(models.Model):
    '''
    Creates a short url based on the long one
    
    created -> Hour and date a shortener was created 
    
    times_followed -> Times the shortened link has been followed

    long_url -> The original link

    short_url ->  shortened link https://domain/(short_url)
    ''' 
    created = models.DateTimeField(auto_now_add=True)

    times_followed = models.PositiveIntegerField(default=0)    

    long_url = models.URLField()

    short_url = models.CharField(max_length=15, unique=True, blank=True)

    class Meta:

        ordering = ["-created"]


    def __str__(self):

        return f'{self.long_url} to {self.short_url}'

Jag vet. Det är en ganska stor klass, med mycket konstiga saker på gång, men misströsta inte. Jag går steg för steg om varje viktig sak.

Modellförklaring

Först och främst importerar vi modellmodulen. Denna modul innehåller all funktionalitet vi behöver för att skapa en Django-modell.

Ta en titt på ”Shortener”-modellen, det första att notera är att det utökar modellerna. Faktum är att alla modeller i en Django-app måste vara en underklass till modeller.Modell klass.

Sedan definierar vi alla fält som modellen kommer att ha på databasen. Fältet ”skapat” är datumet och tiden då den förkortade länken skapas, därför använder vi DateTimeField för att skapa den här typen av funktionalitet. Vi använder argumentet auto_now_add=True eftersom vi vill att fältet endast ska ändras när instansen skapas.

Det andra fältet times_followed hänvisar till de gånger den förkortade URL:en har använts. Det är ett PositivtIntegerField och vi anger standardvärdet noll. Det betyder att varje gång en instans har skapat fältet times_followed kommer Django att fylla i det fältet med 0.

Å andra sidan hänvisar long_url till webbadressen som användaren anger. Det är ett URLField, eftersom vi bara vill att användaren ska ange tecken i formuläret: http://dinwebbplats.com.

Det sista fältet är short_url, och det har intressanta detaljer. Vi specificerar att det bara kan vara 15 tecken långt, det måste vara unikt, vilket innebär att det inte kan finnas upprepade element i det fältet. Slutligen anger vi att det kan lämnas tomt, vilket innebär att när man arbetar med formulär behöver användare inte skriva sin egen förkortningskod.

Meta-inre klassen, berätta för oss hur klassen måste bete sig, och vi ställer in att ordningen (anropar Shortener.objects.all()) av shortener-objekten kommer att diskrimineras av de senaste.

Metoden __str__ berättar hur modellen ska skrivas ut. Så om vi har ett objekt med long_url = ”https://adminvista.com.com/” och förkortad del ”123456”, och vi skriver ut det.

https://adminvista.com.com/ to 123456

Nu är det dags att leta upp ett sätt att spara den korta länken på ett slumpmässigt sätt.

Skapa förkortningsfunktionalitet

Vi kommer att skapa 2 anpassade funktioner. Den första kommer att generera en slumpmässig kod och den andra kommer att förhindra att man får upprepade slumpmässiga koder från Shortener-modellen. För att göra detta, skapa en fil utils.py i appen ”urlshortener”.

touch utils.py

Inuti den här filen kommer vi att använda funktionen välj från den slumpmässiga inbyggda modulen. Detta underlättar uppgiften att välja slumpmässiga tecken för att skapa koden.

'''
Utilities for Shortener
'''
from django.conf import settings

from random import choice

from string import ascii_letters, digits

# Try to get the value from the settings module
SIZE = getattr(settings, "MAXIMUM_URL_CHARS", 7)

AVAIABLE_CHARS = ascii_letters + digits


def create_random_code(chars=AVAIABLE_CHARS):
    """
    Creates a random string with the predetermined size
    """
    return "".join(
        [choice(chars) for _ in range(SIZE)]
    )

Som du kan se returnerar denna funktion en slumpmässig sträng med den längd som anges i inställningsfilen eller 7 som standard. Du använder funktionen getattr för att hämta en variabel från inställningsmodulen, men utan att skicka ett felmeddelande om variabeln inte är specificerad.

Låt oss göra lite matte. Om vi ​​har 7 platser där det kan finnas upp till 62 tillgängliga tecken för varje plats, är det möjligt permutationer är:

Så baserat på dessa snabba beräkningar kan den förkortade delen fyllas i upp till 2,5 biljoner olika koder. Så vi kan glömma att komma ur slumpmässiga förkortade webbadresser.

Även om det kan finnas så mycket permutation, är det en liten sannolikhet att få upprepade förkortade delar. Detta är ett problem eftersom vi ställer in fältet shortened_url för att vara unikt. Det är därför följande funktion är så användbar.

def create_shortened_url(model_instance):
    random_code = create_random_code()
    # Gets the model class

    model_class = model_instance.__class__

    if model_class.objects.filter(short_url=random_code).exists():
        # Run the function again
        return create_shortened_url(model_instance)

    return random_code

Låt oss se vad som händer här. Funktionen tar som ett argument en ”Shortener”-modellinstans. Först genererar funktionen en slumpmässig kod med hjälp av create_random_code. Sedan får den modellklassen och kontrollerar om det finns något annat objekt som har samma short_url. Om den gör det kör den sig själv en gång till, men om allt är bra returnerar den random_code.

Senare kommer du att interagera med skalet för att ta en närmare titt på denna funktion.

Efter att ha skapat verktygsfunktionen, låt oss använda den för att skapa slumpmässiga koder i förkortningsmodellen.

Ändra sparmetoden

I slutet av klassen ”Shortener” kommer du att ändra metoden för att spara modell. Sparmetoden anropas varje gång ett objekt sparas i databasen, så vi kommer att se hur man använder det här.

# Import the function used to create random codes
from .utils import create_shortened_url

# At the end of the  Shortener model
    def save(self, *args, **kwargs):

        # If the short url wasn't specified
        if not self.short_url:
            # We pass the model instance that is being saved
            self.short_url = create_shortened_url(self)

        super().save(*args, **kwargs)

Sparmetoden skrivs över, vilket innebär att du introducerar ny funktionalitet till en redan existerande överordnad metod. Det är i princip att säga till Django att varje gång ett ”Shortener”-objekt sparas och short_url inte anges, måste det fyllas med en slumpmässig kod.

Kör migrering

Nu är det dags att göra och köra migreringarna av Shortener-modellen. För att göra det, kör följande kommandon i rotprojektmappen.

$ python manage.py makemigrations
Migrations for 'urlshortener':
  urlshortener/migrations/0001_initial.py
    - Create model Shortener

$ python manage.py migrate
Operations to perform:
  Apply all migrations: admin, auth, contenttypes, sessions, urlshortener
Running migrations:
  ......
  # Apply the URL shortener migrations
  Applying urlshortener.0001_initial... OK

För närvarande behöver du inte oroa dig för vad migrationer är. Tänk bara på att när du kör dessa två kommandon skapar Django en db.sqlite databas fil, baserat på de modeller du har definierat.

Låt oss skapa några objekt med Django-skalet.

$ python manage.py shell

>>> from urlshortener.models import Shortener
>>> s = Shortener(long_url="https://adminvista.com.com")
>>> s.short_url
''
>>> s.save()
>>> s.short_url
'kdWFVIc'
>>> s.long_url
'https://adminvista.com.com'
>>> print(s)
https://adminvista.com.com to kdWFVIc

Det är ungefär så alla förkortningsobjekt kommer att fungera.

Skrivsynpunkter

Som jag sa tidigare är en vy en enkel funktion som tar en begäran och returnerar ett svar. Så låt oss se hur man skapar en hej världsbild.

Grundläggande mallsvar

Skapa en funktion home_view inuti filen ”urlshortener/views.py”. aa

'''
Shortener views
'''
from django.shortcuts import render, get_object_or_404 # We will use it later

from django.http import HttpResponse 

# Create your views here.

def home_view(request):
    return HttpResponse("Hello world")

Det returnerar ett enkelt meddelande ”Hello world”. Senare får du se hur det ser ut i webbläsaren. Skapa nu en ”urls.py”, där kommer alla URL-mönster för appen att stå.

tryck på urls.py

Lägg till följande kod.

'''
Urls for shortener app urlshortener/urls.py
'''

from django.urls import path

# Import the home view
from .views import home_view

appname = "shortener"

urlpatterns = [
    # Home view
    path("", home_view, name="home")
]

Variabeln appname deklarerar (som namnet antyder) namnavståndet för urlshortener-appen.

Förklarar snabbt att vi importerar banfunktion, som returnerar ett element som ska inkluderas i appens urlmönster. Namnattributet är namnutrymmet för sökvägen, som kan anropas inuti mallar om det behövs.

Låt oss nu ändra de övergripande projektadresserna.

# config/urls.py

from django.contrib import admin
from django.urls import path, include

urlpatterns = [
    path('admin/', admin.site.urls),
    
    # Shortener Urls
    path('', include('urlshortener.urls'))
]

Låt oss nu köra servern igen.

python manage.py runserver

Om du kör servern får du ett enkelt ”Hej världen”-meddelande. Detta beror på att du inkluderar urlmönster från URL-förkortningsappen i det övergripande projektet.

Detta är bara en utgångspunkt. Nu är det dags att skapa ett formulär för att låta användaren skapa förkortade webbadresser på egen hand.

Skapa formulär

I Django, en form är en enkel klass som tillåter att få input från användaren.

Du kommer att skapa en forms.py-fil. Det är en konvention att lagra alla former av appen i den filen.

cd urlshortener/
touch forms.py

Inuti den filen kommer du att skapa en klass ”ShortenerForm” som sträcker sig från ”ModelForm”.

'''
Shortener Forms urlshortener/forms.py
'''

from django import forms

from .models import Shortener

class ShortenerForm(forms.ModelForm):
    
    long_url = forms.URLField(widget=forms.URLInput(
        attrs={"class": "form-control form-control-lg", "placeholder": "Your URL to shorten"}))
    
    class Meta:
        model = Shortener

        fields = ('long_url',)

Det är en modellform eftersom dess syfte är att skapa ett modellobjekt från användarens input. Vi använder också widgetargumentet, som låter oss specificera attributet ”class” (klass i CSS, inte python). Det beror på att vi ska stilisera appen med bootstrap senare.

Avslutar vyerna

Efter att ha byggt formulären är det dags att skapa den slutliga affärslogiken för applikationen.

Navigera till filen views.py i shortener-appen och ändra vyn home_view. Du kan kolla in Github repo i detta ögonblick för att få en uppfattning om hur projektstrukturen ser ut.

Det finns två vyer för URL-förkortningsappen:

  • Hemvy: Detta visar förkortningsformuläret och den nya URL:en om formuläret redan har skickats.
  • Omdirigeringsvy: Detta omdirigerar till den långa webbadressen och lägger till 1 till de tider som följs.
  • Låt oss börja med hemvyn som är den mest komplexa. Du måste importera Shortener-modellen och formuläret. Du använder fortfarande en funktion eftersom jag vill att du ska förstå alla dataflöden i vyn. Du kommer också att använda sökvägen för en mall (som inte har skapats ännu).

    Hemvy

    '''
    Shortener views
    '''
    from django.shortcuts import render # We will use it later
    
    from django.http import HttpResponse, Http404, HttpResponseRedirect
    
    
    # Model
    from .models import Shortener
    
    # Custom form
    
    from .forms import ShortenerForm
    
    # Create your views here.
    
    def home_view(request):
        
        template="urlshortener/home.html"
    
        
        context = {}
    
        # Empty form
        context['form'] = ShortenerForm()
    
        if request.method == 'GET':
            return render(request, template, context)
    
        elif request.method == 'POST':
    
            used_form = ShortenerForm(request.POST)
    
            if used_form.is_valid():
                
                shortened_object = used_form.save()
    
                new_url = request.build_absolute_uri('/') + shortened_object.short_url
                
                long_url = shortened_object.long_url 
                 
                context['new_url']  = new_url
                context['long_url'] = long_url
                 
                return render(request, template, context)
    
            context['errors'] = used_form.errors
    
            return render(request, template, context)
    

    Synen baseras på två villkor:

  • När HTTP-metoden är lika med GET: Vi skickar bara som sammanhang, Shortener-formuläret som används för att skapa Shortener-objekt.
  • När HTTP-metoden är lika med POST: Vi skickar fortfarande formuläret i sammanhanget eftersom vi vill att användaren ska kunna ange en annan URL. Men vi skickar Post-förfrågan till ett annat formulär som heter used_form.
  • Ett knepigt sätt att få den fullständiga webbadressen till webbplatsen dynamiskt är att använda förfrågningsobjektmetoden build_absolute_uri .

    >>> print(request.build_absolute_uri('/'))
    'https://localhost:8080/'

    Som ett säkert sätt att behandla en felaktig förfrågan (Användaren angav inte en giltig URL), får vi formulärfelen, skickar dem som sammanhang och återger mallen som vanligt. Senare kommer du att se hur du implementerar felvisningen i mallen.

    Omdirigeringsvy

    Redirect_url_view , är lite enklare. Det är en detaljerad vy vilket innebär att vyn bara fungerar med ett objekt.

    Denna funktion tar som parametrar, användarens begäran och den förkortade_delen av URL:en. Det är inte nödvändigt att hävda vilken typ av begäran vi får, eftersom vi inte arbetar med formulär i den här vyn.

    def redirect_url_view(request, shortened_part):
    
        try:
            shortener = Shortener.objects.get(short_url=shortened_part)
    
            shortener.times_followed += 1        
    
            shortener.save()
            
            return HttpResponseRedirect(shortener.long_url)
            
        except:
            raise Http404('Sorry this link is broken :(')

    Vi skyddar vyn med en try/except-sats, om den förkortade delen inte finns i databasen. Om objektet hittas lägger det till 1 i fältet times_followed och omdirigerar med funktionen HttpResponseRedirect till webbplatsens URL som motsvarar den slumpmässiga koden.

    Uppdaterar webbadresser

    När du har skapat de två vyerna av appen är det dags att skapa de slutliga webbadressmönstren genom att inkludera sökvägen till redirect_url_view.

    Som alltid börjar du med att importera vyerna och sedan skapa en sökvägsfunktion och skicka som argument:

    • URL-rutten
    • Utsikten som pekar mot stigen
    • Namnet på vägen
    '''
    Urls for shortener app urlshortener/urls.py
    '''
    
    from django.urls import path
    
    # Import the home view
    from .views import home_view, redirect_url_view
    
    appname = "shortener"
    
    urlpatterns = [
        # Home view
        path('', home_view, name="home"),
        path('<str:shortened_part>', redirect_url_view, name="redirect"),
    ]
    

    Med den här URL-inställningen ser routingen av appen ut så här.

    • localhost:8000/: Hemvy
    • localhost:8000/URL-kod: Omdirigering till den långa URL:en

    Skapa mallar

    Du är nästan där. Det enda som skiljer dig från att ha byggt den här appen är användargränssnittet. För det använder vi Django-mallar.

    Mallar används för att göra ett rent gränssnitt till appanvändaren. Dessa filer skapas inuti appen i en dubbel mappstruktur av formuläret: ”mallar/appnamn”

    # urlshortener directory
    mkdir -p templates/urlshortener/

    Obs: Den dubbla mappstrukturen och Django Template-språket ligger utanför ramen för denna handledning, men du kan läsa om dem i officiell dokumentation.

    Bas mall

    Django tillåter mallarv. Det betyder att vi kan ha en basmall och utöka den med syftet att följa DRY (Don’t repeat yourself) principen.

    cd templates/urlshortener
    touch base.html

    Filen base.html är en konvention och innebär att alla andra mallar i appen måste vara en förlängning av denna.

    <!DOCTYPE html>
    <html lang="en">
      <head>
        <meta charset="UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>Django Url shortener</title>
    
        <link
          href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
          rel="stylesheet"
          integrity="sha384-wEmeIV1mKuiNpC+IOBjI7aAzPcEZeedi5yW5f2yOq55WWLwNGmvvx4Um1vskeMj0"
          crossorigin="anonymous"
        />
    
        <link
          rel="stylesheet"
          href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"
          integrity="sha512-iBBXm8fW90+nuLcSKlbmrPcLa0OT92xO1BIsZ+ywDWZCvqsWgccV3gFoRBv0z+8dLJgyAHIhR35VZc2oM/gI1w=="
          crossorigin="anonymous"
        />
      </head>
      <body>
       
        {% block body %} 
       
       
        
        {% endblock body %}
        
        <script
          src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
          integrity="sha384-p34f1UUtsS3wqzfto5wAAmdvj+osOnFyQFpp4Ua3gs/ZVWx6oOypYoCJhGGScy+8"
          crossorigin="anonymous"
        ></script>
      </body>
    </html>
    

    Vi kommer att använda bootstrap CDN, för att skapa ett snabbt och snyggt gränssnitt utan att behöva CSS eller javascript-filer.

    Om du vill lära dig mer om DTL-taggar kan du göra det med officiella handlingar.

    Hem mall

    Hemmallen, inherence från filen base.html. Det betyder att den här mallen innehåller all HTML från den överordnade filen.

    {% extends 'urlshortener/base.html' %} 
    
    {% block body %}
    
    <div class="container">
      <div class="card mt-5">
        <div class="card-header text-center py-3">
          <h1>URL Shortner Application <i class="fas fa-link px-2"></i></h1>
        </div>
        <div class="px-3 py-4">
          <form action="" method="POST">
            {% csrf_token %}
            <div class="row g-1">
              <div class="col-10">{{form.long_url}}</div>
              <div class="col-2">
                <button class="btn btn-success btn-lg w-100" type="submit">
                  Shorten
                </button>
              </div>
            </div>
          </form>
        </div>
      </div>
      {% if errors %}
      <div class="alert alert-danger mt-4" role="alert">
        <p>{{errors}}</p>
      </div>
      {% endif %}
    
      {% if new_url %}
    
      <div class="mx-auto text-center mt-5">
        <h2 class="text-danger">Your shortened Url</h2>
        <p>You can copy the Link below and share it with your friends</p>
        <p class="">{{new_url}}</p>
        <p><span class="text-danger">Previous URL:</span> {{long_url}}</p>
      </div>
      {% endif %}
    </div>
    {% endblock body %}

    Jag ska snabbt förklara dataflödet för denna mall:

    • Formen förkortare visas. Inuti crsf token är inställd (säkerhetsskäl), och endast det långa URL-fältet i formuläret visas. Kom ihåg att det här fältet har CSS-klassen, ”form-control form-control-lg”, eftersom vi ställer in det i formuläret.
    • Om några fel hittas, visa dem
    • Om POST-operationen lyckas visas den nya URL:en.

    Slutlig ansökan

    Grattis! 🎉. Du har byggt en komplett funktionell URL-förkortningsapp med Django.

    Här är några skärmdumpar av hur applikationen ser ut.

    Få bara:

    Fel vid förkortning av URL:

    Lyckad förkortad URL:

    URL omdirigerad:

    Vad tycker du om att exponera en demo av denna URL-förkortningsapp för någon? Kolla hur du exponerar en Django Demo-app för internet.

    Utmaning 🔥

    Om du känner dig bekväm med dina Django-färdigheter, varför inte träna med en utmaning?

    Klona koden för denna applikation och skapa ett autentiseringssystem, där endast registrerade användare kan förkorta sina webbadresser.

    När du är klar, skicka en pull-förfrågan och pinga mig vidare Twitter för att visa upp dina prestationer.

    Avslutar

    Du har nått slutet av den här handledningen. Tro det eller ej, du har precis granskat alla de viktigaste aspekterna av att skapa ett Django-projekt. Jag hoppas att du tyckte att det var mycket användbart.

    I denna handledning:

    • Lärde mig om arbetsflödet för att skapa en Django-app.
    • Byggde ett CV-projekt
    • Förstod skillnaderna och strukturen för Django-projekt och Django-appar.
    • Upptäckte MVT-mönstret.
    • Skapat Funktionsbasvyer
    • Använde Django ORM (Object Relational Mapper) för att skapa enkla modeller

    Det är allt, det finns mycket att täcka med Django webbramverkså håll kontakten för fler fantastiska handledningar.