Um guia para construir um aplicativo URL Shortener com Django

A melhor maneira de aprender Django, ou qualquer habilidade, é aplicando o conhecimento que você tem criando projetos funcionais.

Django é o framework de desenvolvimento web Python mais usado. Seus recursos integrados e grande quantidade de pacotes de terceiros o tornaram um dos frameworks da web mais amados em todo o mundo.

É rápido, confiável e possui vários recursos integrados. Por exemplo, um sistema de autenticação de furo, que permite que você se concentre nos principais recursos do seu aplicativo. Além disso, você pode instalar pacotes externos para realizar tarefas ainda mais complexas, como Django-allauth , que permite registrar usuários com suas contas sociais.

Mas vamos expor alguns fatos. Django é um framework tão grande que às vezes é desafiador começar com ele.

Então, hoje você vai construir do zero um aplicativo Django totalmente funcional.

Ao final deste tutorial, você irá:

• Ter escrito um aplicativo encurtador de URL
• Entenda o padrão Django MVT
• Aprendi o fluxo de trabalho de criação de um projeto

Pré requisitos

Todos os requisitos a seguir são opcionais e o ajudarão a seguir o tutorial. Mas se você não tem experiência com nenhum desses, não se preocupe. O passo mais importante é o primeiro.

• Conhecimento básico dos comandos UNIX (ls, cd, rm, touch)
• Conhecimento básico das classes e funções do Python
• Python instalado em seu computador (talvez óbvio, mas eu tive que incluí-lo)
• Seria ótimo se você já construiu algo com Django

Todo o código de trabalho estará disponível neste repositório Github.

Agora que você entendeu perfeitamente os conceitos anteriores, vamos entrar no assunto.

Declaração do projeto

Neste tutorial, você vai construir um encurtador de URL. Basicamente, um encurtador de URL é um serviço que pega um URL longo e o transforma em um compacto.

Por exemplo, se você deseja compartilhar um tweet e incluir um link para o seu site, mas está enfrentando o limite de caracteres, pode usar um encurtador de URL.

Vamos ver com um gráfico.

Como você pode ver, o encurtador de URL obtém um URL longo e retorna um curto. Isso é exatamente o que você vai construir hoje.

Com este projeto, você praticará o uso do padrão MVT, aprenderá os fundamentos do design de banco de dados com modelos Django e aprenderá como mostrar informações ao usuário por meio de visualizações, URLs e modelos.

Estrutura de um projeto Django

Basicamente, um site Django é construído sobre um único projeto e vários aplicativos separados. Cada um desses aplicativos possui uma funcionalidade específica e é capaz de funcionar sozinho.

Vamos imaginar um aplicativo da web complexo como Stackoverflow. Sua funcionalidade é baseada em dois aspectos principais.

• Gerenciamento de usuários: login, logout, reputação, permissões
• Fórum: perguntas, respostas, tags, filtros

Portanto, seguindo a estrutura do site do Django, o projeto seria denominado StackOverflow, que tem dois aplicativos principais. O aplicativo dos usuários e o aplicativo do fórum .

Cada um desses aplicativos possui funcionalidade independente. Isso significa que ambos contêm todo o código de que precisam para funcionar corretamente.

Isso inclui modelos (estrutura de banco de dados), visualizações (solicitações e respostas), padrões de URL específicos e, claro, modelos e arquivos estáticos (imagens, CSS, JavaScript). Isso significa que qualquer aplicativo Django pode ser reutilizado, uma vez que são capazes de funcionar por conta própria.

Resumindo, um projeto se refere a um conjunto de configurações e aplicativos que se destinam a construir um aplicativo da web. Por outro lado, um aplicativo Django é parte de um projeto, que é independente (tem tudo o que precisa para funcionar) e tem como objetivo realizar uma operação específica.

Configurar um projeto Django

Nesta seção, você configurará um projeto Django. Para isso, você usará diferentes ferramentas como um ambiente virtual para organizar as dependências do Python e os scripts Django mais importantes. Django-admin e manage.py

Ambiente virtual

Eu sempre recomendo trabalhar com ambientes virtuais ao construir aplicativos com Django. É a maneira mais eficiente de manter um conjunto específico de dependências. Mas seu objetivo principal é isolar os pacotes de desenvolvimento dos globais.

Portanto, vamos criar um ambiente virtual com python, o comando de formulário integrado.

Observação: este método requer Python 3.6 ou versões mais recentes para funcionar.

 python -m venv .venv

Este comando usa o comando python -m ou python –mod . Fundamentalmente, ele executa um módulo ou biblioteca, como um script. De acordo com o significado desse comando, venv é a biblioteca que estamos executando e .venv se refere ao nome do ambiente virtual que queremos criar.

Então, em linguagem simples, este comando significa.

Ei Python, execute como um script a biblioteca interna venv e crie um nome virtualenv .venv

Agora é hora de ativar o ambiente virtual que acabamos de criar, com o seguinte comando.

 source .venv/bin/activate

Para afirmar que você não tem nenhum pacote instalado no novo venv, você executa.

 pip freeze

Se você ativou o ambiente virtual corretamente, não obterá nenhuma saída. Isso porque ainda não instalamos nada.

Vamos entrar em Django

Para criar nosso aplicativo encurtador de URL, vamos começar instalando o pacote Django. Django é um pacote de terceiros, portanto, precisamos instalá-lo com Pip (Pip instala pacotes).

 $ 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

Nota: Lembre - se de que $ nada mais é que o seu símbolo de shell.

Para verificar se a instalação ocorreu corretamente, verificamos novamente os pacotes instalados em nosso venv.

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

Não se preocupe se as versões que você obtiver forem diferentes das minhas. Se o Django ainda estiver na versão 3.x, você pode continuar sem problemas.

Iniciando um projeto Django

Depois de instalar o Django, é hora de criar a estrutura do site do encurtador de URL. Você se lembra o que é um projeto Django? Vamos criar um executando o seguinte comando.

 django-admin startproject config

Explicando tudo sobre este comando, django-admin é um utilitário de linha de comando que realiza todas as tarefas necessárias para criar um projeto Django. A parte “startproject” é o comando executado pelo utilitário Django-admin e config é o nome do projeto que iremos criar.

É importante enfatizar que config pode ser qualquer nome que você quiser. A razão pela qual uso config como o nome deste projeto é apenas por conveniência. É bom alternar entre projetos e ainda ter a mesma convenção de nomenclatura. Portanto, não tenha medo de usar outros nomes de projeto sempre que quiser.

Como você pode notar agora, você tem uma pasta / config e, dentro dela, muitos arquivos. Mais tarde veremos a estrutura de arquivos do projeto. Por enquanto, vamos entrar no diretório do projeto e executar o servidor local.

 cd config/

O arquivo mais importante que você usará é o script manage.py . Tem a mesma funcionalidade do django-admin , mas a principal vantagem de usá-lo é que permite gerenciar as configurações ao executar o projeto.

Agora vamos ver se tudo está funcionando corretamente.

 python manage.py runserver

Criação do aplicativo encurtador de URL

É hora de criar o aplicativo principal do projeto. Você usará o arquivo manage.py para realizar esta tarefa.

 python manage.py startapp urlshortener

Isso cria um aplicativo Django, com o nome urlshortener . Se você executar o comando tree, obterá algo assim.

 . ├── 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

Vamos esclarecer os diferentes arquivos criados até o momento. “Config” é o nome do nosso projeto e é assim nomeado apenas para a convenção. Dentro do config, você obtém settings.py , é o arquivo onde você define todas as configurações do seu projeto. urls.py é a configuração geral dos URLs dentro do projeto. Ele define os caminhos de URL de todos os aplicativos dentro do projeto.

Não se preocupe muito com o asgi.py e wsgi.py arquivos. Esses são arquivos que permitem configurar seu aplicativo na implantação.

O manage.py é o script python que permite que você execute todos os comandos disponíveis do Django-admin.

Dando uma olhada dentro do urlshortener que é o nome do aplicativo que você acabou de criar, você notará que existe uma pasta estranha chamada “migrations /” e alguns outros arquivos que são cruciais para a lógica de qualquer aplicativo.

apps.py é onde reside a configuração do aplicativo. Normalmente, você não mexe com isso, exceto que está fazendo coisas bem avançadas.

admin.py é onde você registra seus modelos para torná-los visíveis dentro do painel de administração do Django.

models.py é o mais importante. Dentro deste módulo, você deve definir os modelos, que (vagamente dizendo) são a forma como os dados são armazenados. Você ouvirá mais sobre os modelos mais tarde.

migrations/ é a pasta onde as migrações do Django são armazenadas. Vamos dar uma olhada em profundidade mais tarde.

tests.py é o arquivo onde os testes são armazenados. Não cobriremos os testes neste tutorial.

views.py é o arquivo que armazena visualizações. Basicamente, ele define como o usuário irá interagir com todos os aspectos do seu aplicativo.

Instalando um aplicativo Django

Antes de continuar, abra o arquivo settings.py e modifique a variável INSTALLED_APPS adicionando o aplicativo urlshortener.

 # 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', ]

Este é um processo de rotina ao criar um aplicativo. Portanto, toda vez que você fizer isso, não se esqueça de instalá-lo nas configurações do projeto.

Compreendendo o padrão MVT

O padrão Model, View, Template é o padrão de design de software que os desenvolvedores Django usam para criar aplicativos da web.

É baseado em 3 conceitos principais. Modelo (dados), Visualização (interação do usuário com os dados), Modelo (como os usuários veem os dados).

Modelos são classes Python, que definem todos os campos e comportamento dos dados que você deseja armazenar. Normalmente, cada modelo se refere a uma tabela única no banco de dados

As visualizações, em sua expressão mais simples, são chamáveis ​​que recebem uma solicitação do usuário e geram uma resposta. Entre esse processo ocorre a lógica de negócios. Eu sei que “lógica de negócios” é um conceito bastante obscuro, então deixe-me explicar exatamente o que é. A lógica de negócios é a forma como os dados são criados, armazenados e excluídos, isso é tudo.

Finalmente, os modelos são documentos de texto (geralmente Html) que são mostrados aos usuários. Seu objetivo é apresentar os dados o mais limpos possível. Django incorpora uma minilinguagem chamada Django template language (DTL) que permite incorporar um pouco do poder do python em documentos de texto.

Crie o modelo Shortener

Depois que você tiver uma rápida compreensão do padrão MVT, vamos começar a criar o encurtador de URL do Django do zero.

Em primeiro lugar, vamos definir o modelo de encurtador dentro do arquivo 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}'

Eu sei. É uma aula bem grande, com muitas coisas estranhas acontecendo, mas não se desespere. Vou passo a passo em cada coisa importante.

Explicação do modelo

Em primeiro lugar, importamos o módulo de models . Este módulo contém todas as funcionalidades de que precisamos para criar um modelo Django.

Dando uma olhada no modelo “Shortener”, a primeira coisa a notar é que ele estende os models.Model . Na verdade, qualquer modelo em qualquer aplicativo Django deve ser uma subclasse da classe models.Model.

Em seguida, definimos todos os campos que o modelo terá no banco de dados. O campo “criado” é a data e hora em que o link encurtado é criado, portanto usamos DateTimeField para criar este tipo de funcionalidade. Usamos o argumento auto_now_add = True porque queremos que o campo seja alterado apenas quando a instância for criada.

O segundo campo times_followed refere-se às vezes que o URL encurtado foi usado. É um PositiveIntegerField e especificamos um padrão de zero. Isso significa que toda vez que uma instância criar o campo times_followed , o Django preencherá esse campo com 0.

Por outro lado, long_url se refere à URL que o usuário insere. É um URLField , pois desejamos apenas que o usuário insira caracteres do formulário: http://yoursite.com .

O último campo é short_url e possui detalhes interessantes. Especificamos que só pode ter 15 caracteres, deve ser único, o que significa que não pode haver elementos repetidos nesse campo. Por fim, indicamos que pode ser deixado em branco, o que significa que, ao trabalhar com formulários, os usuários não precisarão escrever seu próprio código abreviado.

A classe interna Meta nos diz como a classe deve se comportar e definimos que a ordem (chamando Shortener.objects.all () ) dos objetos encurtadores será discriminada pelos mais recentes.

O método __str__ informa como o modelo deve ser impresso. Portanto, se tivermos um objeto com long_url = “https://geekflare.com/” e a parte abreviada “123456”, o imprimiremos.

 https://geekflare.com/ to 123456

Agora é hora de procurar uma maneira de salvar o link curto de forma aleatória.

Criação de funcionalidade de redução

Vamos criar 2 funções personalizadas. O primeiro irá gerar um código aleatório e o segundo irá prevenir a obtenção de códigos aleatórios repetidos do modelo Shortener. Para fazer isso, crie um arquivo utils.py dentro do aplicativo “urlshortener”.

 touch utils.py

Dentro deste arquivo, vamos usar a função Choose do módulo embutido aleatório. Isso facilita a tarefa de escolher caracteres aleatórios para criar o código.

 ''' 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)] )

Como você pode ver, esta função retorna uma string aleatória do comprimento especificado no arquivo de configurações ou 7 por padrão. Você está usando a função getattr para obter uma variável do módulo de configurações, mas sem lançar um erro se a variável não for especificada.

Vamos fazer algumas contas. Se tivermos 7 lugares onde pode haver até 62 caracteres disponíveis para cada lugar, as permutações possíveis são:

Portanto, com base nesses cálculos rápidos, a parte reduzida pode ser preenchida com até 2,5 trilhões de códigos diferentes. Portanto, podemos esquecer de sair de URLs encurtados aleatórios.

Embora possa haver muita permutação, há uma pequena probabilidade de obter partes encurtadas repetidas. Isso é um problema, pois configuramos o campo shortened_url para ser único. É por isso que a função a seguir é tão útil.

 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

Vamos ver o que está acontecendo aqui. A função leva como argumento uma instância de modelo “Shortener”. Primeiro, a função gera um código aleatório usando o create_random_code . Em seguida, ele obtém a classe do modelo e verifica se há algum outro objeto que possui o mesmo short_url . Se isso acontecer, ele se executa mais uma vez, mas se tudo estiver bem, ele retorna o random_code.

Posteriormente, você irá interagir com o shell, a fim de dar uma olhada nesta função de perto.

Depois de criar a função de utilidade, vamos usá-la para criar códigos aleatórios no modelo de encurtador.

Modificando o método de salvamento

No final da classe “Shortener”, você modificará o método de salvamento do modelo. O método save é chamado toda vez que um objeto é salvo no banco de dados, então veremos como usá-lo aqui.

 # 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)

O método save está sendo sobrescrito, o que significa que você está introduzindo uma nova funcionalidade para um método pai pré-existente. Basicamente, ele diz ao Django que cada vez que um objeto “Shortener” é salvo e o short_url não é especificado, ele deve ser preenchido com um código aleatório.

Migrações em execução

Agora é hora de fazer e executar as migrações do modelo Shortener. Para fazer isso, execute os seguintes comandos na pasta raiz do projeto.

 $ 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

Por enquanto, você não precisa se preocupar com o que são migrações. Apenas tenha em mente que ao executar esses dois comandos, o Django cria um arquivo de banco de dados db.sqlite, baseado nos modelos que você definiu.

Vamos criar alguns objetos com o shell do Django.

 $ python manage.py shell >>> from urlshortener.models import Shortener >>> s = Shortener(long_url="https://geekflare.com") >>> s.short_url '' >>> s.save() >>> s.short_url 'kdWFVIc' >>> s.long_url 'https://geekflare.com' >>> print(s) https://geekflare.com to kdWFVIc

É basicamente assim que todos os objetos encurtadores funcionam.

Escrevendo visualizações

Como eu disse antes, uma visão é uma função simples que recebe uma solicitação e retorna uma resposta. Então, vamos ver como criar uma visão de mundo hello.

Resposta do modelo básico

Dentro do arquivo “urlshortener / views.py” crie uma função home_view . 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")

Ele retorna uma mensagem simples “Olá, mundo”. Mais tarde você verá como fica no navegador. Agora crie um “urls.py”, lá estarão todos os padrões de URL do aplicativo.

touch urls.py


Adicione o seguinte código.

 ''' 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") ]

A variável appname declara (como seu nome sugere) o namespace do aplicativo urlshortener.

Explicando rapidamente que estamos importando a função path, que retorna um elemento para incluir no urlpatterns do aplicativo. O atributo name é o namespace do caminho, que pode ser chamado dentro dos templates, se necessário.

Agora, vamos modificar os URLs gerais do projeto.

 # 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')) ]

Agora vamos executar o servidor novamente.

 python manage.py runserver

Se você executar o servidor, receberá uma mensagem simples “Hello world”. Isso ocorre porque você está incluindo os urlpatterns do aplicativo encurtador de URL no projeto geral.

Isto é só um ponto de partida. Agora é hora de criar um formulário para permitir que o usuário crie URLs encurtados por conta própria.

Criação de formulários

No Django, um formulário é uma classe simples que permite obter a entrada do usuário.

Você irá criar um arquivo forms.py. É uma convenção armazenar todas as formas do aplicativo nesse arquivo.

 cd urlshortener/ touch forms.py

Dentro desse arquivo você irá criar uma classe “ShortenerForm” que estende a partir de “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',)

É um formulário de modelo, pois seu objetivo é criar um objeto de modelo a partir da entrada do usuário. Também usamos o argumento widget, que nos permite especificar o atributo “class” (classe em CSS, não python). Isso ocorre porque vamos estilizar o aplicativo com bootstrap mais tarde.

Finalizando as visualizações

Depois de construir os formulários, é hora de criar a lógica de negócios final do aplicativo.

Navegue até o arquivo views.py dentro do aplicativo shortener e modifique a visualização home_view . Você pode verificar o repositório do Github neste momento para ter uma ideia de como a estrutura do projeto se parece.

Existem duas visualizações para o aplicativo encurtador de URL:

1. Visualização inicial: mostra o formulário abreviador e a nova URL, se o formulário já tiver sido enviado.
2. Visualização de redirecionamento: redireciona para a URL longa e adiciona 1 aos tempos seguidos.

Vamos começar com a visualização inicial, que é a mais complexa. Você precisará importar o modelo e o formulário do Shortener. Você ainda está usando uma função, pois quero que você entenda todo o fluxo de dados da view. Além disso, você usará o caminho para um modelo (que ainda não foi criado).

Vista inicial

 ''' 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)

A visualização é baseada em duas condicionais:

1. Quando o método HTTP é igual a GET: Passamos apenas como contexto, a forma Shortener usada para criar objetos Shortener.
2. Quando o método HTTP é igual a POST: Ainda estamos passando o formulário no contexto, pois queremos que o usuário possa inserir outra URL. Mas estamos passando a solicitação Post para outro formulário chamado used_form.

Uma maneira complicada de obter o URL completo do site dinamicamente é usando o método do objeto de solicitação build_absolute_uri .

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

Como uma forma segura de processar uma solicitação errada (O usuário não inseriu uma URL válida), obtemos os erros do formulário, passamos-os como contexto e renderizamos o modelo normalmente. Posteriormente, você verá como implementar a exibição de erro no modelo.

Visualização de redirecionamento

O redirect_url_view , é um pouco mais simples. É uma visão detalhada, o que significa que a visão só funciona com um objeto.

Esta função leva como parâmetros, a solicitação do usuário e a shortened_part da URL. Não é necessário afirmar o tipo de solicitação que estamos recebendo, pois não estamos trabalhando com formulários nesta visualização.

 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 :(')

Protegemos a visualização com uma instrução try / except , caso a parte encurtada não seja encontrada no banco de dados. Se o objeto for encontrado, ele adiciona 1 ao campo times_followed e redireciona com a função HttpResponseRedirect para a URL do site correspondente ao código aleatório.

Atualizando URLs

Depois de criar as duas visualizações do aplicativo, é hora de criar os padrões de URL final incluindo o caminho para redirect_url_view .

Como sempre, você começa importando as visualizações e, em seguida, criando uma função de caminho e passando como argumentos:

• A rota do URL
• A vista apontando para o caminho
• O nome do caminho

 ''' 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'), ]

Com essa configuração de URL, o roteamento do aplicativo fica assim.

• localhost:8000/ : visualização inicial
• localhost:8000/URL-code : redirecionamento para o URL longo

Criação de modelos

Você está quase lá. A única coisa que o separa de ter criado este aplicativo é a interface do usuário. Para isso, usamos modelos Django.

Os modelos são usados ​​para renderizar uma interface limpa para o usuário do aplicativo. Esses arquivos são criados dentro do aplicativo em uma estrutura de pasta dupla da forma: “templates / appname”

 # urlshortener directory mkdir -p templates/urlshortener/

Nota: A estrutura de pasta dupla e a linguagem Django Template estão além do escopo deste tutorial, mas você pode ler sobre eles na documentação oficial.

Template base

Django permite herança de template. Isso significa que podemos ter um template base e estendê-lo com o propósito de seguir o princípio DRY (Não se repita).

 cd templates/urlshortener touch base.html

O arquivo base.html é uma convenção e significa que todos os outros modelos do aplicativo devem ser uma extensão deste.

 <!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>

Vamos usar o bootstrap CDN, para fazer uma interface rápida e bonita sem a necessidade de arquivos CSS ou javascript.

Se você deseja aprender profundamente sobre as tags DTL, pode fazê-lo com os documentos oficiais.

Modelo de casa

O modelo inicial, herança do arquivo base.html. Isso significa que este modelo inclui todo o HTML do arquivo principal.

 {% 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 %}

Vou explicar rapidamente o fluxo de dados deste modelo:

• O formulário Shortener é exibido. Dentro, o token crsf é definido (razões de segurança), e apenas o campo de URL longo do formulário é mostrado. Lembre-se de que este campo possui a classe CSS, “form-control form-control-lg”, porque definimos isso no formulário.
• Se algum erro for encontrado, mostre-os
• Se a operação POST for bem-sucedida, o novo URL será mostrado.

Aplicação final

Parabéns! . Você construiu um aplicativo encurtador de URL funcional completo com Django.

Aqui estão algumas imagens de como o aplicativo se parece.

Obtenha apenas:

Erro ao encurtar URL:

URL encurtado bem-sucedido:

URL redirecionado:

O que você acha de expor uma demonstração deste aplicativo encurtador de URL para alguém? Veja como expor um aplicativo Django Demo para a Internet.

Desafio

Se você se sente confortável com suas habilidades em Django, por que não praticar com um desafio?

Clone o código deste aplicativo e crie um sistema de autenticação, onde apenas usuários cadastrados podem encurtar seus URLs.

Quando terminar, envie uma solicitação de pull e me envie um ping no Twitter para mostrar suas conquistas.

Empacotando

Você chegou ao final deste tutorial. Acredite ou não, você acabou de revisar todos os principais aspectos da criação de um projeto Django. Espero que você tenha achado extremamente útil.

Neste tutorial, você:

• Aprendeu sobre o fluxo de trabalho de criação de um aplicativo Django.
• Construiu um projeto de currículo
• Entendeu as diferenças e a estrutura dos projetos Django e aplicativos Django.
• Descobriu o padrão MVT.
• Visualizações da base de funções criadas
• Usei o Django ORM (Object Relational Mapper) para criar modelos simples

Isso é tudo, há muito a ser abordado com a estrutura da Web do Django, portanto, mantenha contato para obter mais tutoriais incríveis.