Publicado el 17/04/2023 12:04:00 en Programación Web.
Author: M20191 | Total de votos: 5   Vote

Temario
- Entender MVT
- Instalación
- Configuraciones iniciales
- Crear modelos
- Crear vistas/urls/templates

MVT Django

El patrón MVT (Modelo-Vista-Template) es un patrón de diseño que se utiliza en el framework web de Django para separar las responsabilidades en una aplicación web.

El modelo representa los datos y las reglas de negocio de la aplicación. Es decir, es la capa encargada de la interacción con la base de datos y de realizar validaciones en los datos ingresados por el usuario.

La vista es la capa que se encarga de procesar la petición del usuario y de devolver una respuesta adecuada. Aquí es donde se realiza la lógica de negocio de la aplicación. Por ejemplo, si el usuario solicita una página web, la vista se encarga de generar la respuesta HTML adecuada.

Por último, el template es la capa encargada de la presentación de los datos al usuario. Es decir, aquí es donde se define cómo se verán los datos en la página web. Django utiliza el lenguaje de plantillas para definir los templates.

En resumen, el patrón MVT de Django nos ayuda a estructurar nuestra aplicación de forma clara y ordenada, separando las responsabilidades en distintas capas para facilitar el desarrollo y el mantenimiento de nuestra aplicación.

Instalación

Creamos entorno virtual

python -m venv .env

De esta manera nos aseguramos que los paquetes estén aislados entre sí.

Descargamos django

Activamos entorno virtual

cd .env
cd Scripts
activate
pip install django

Si se presenta algun error puedes hacer un ls y ejecutar un script de activación diferente correspondiente a tu terminal.

Creamos un proyecto

django-admin startproject core .

core es la nomenclatura correcta que se le debe dar al archivo raíz de configuración en nuestro proyecto, el "." al final es para crearlo en el directorio actual.

Creamos app

py manage.py startapp blog

NOTA: Debemos registrar la app dentro de core/settings.py

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',

    'blog' # Registramos la app
]

Configuraciones iniciales

Manejo de imágenes
Al final de core/settings.py debemos implementar las siguientes líneas de código

STATIC_URL = 'static/'
STATICFILES_DIRS = [os.path.join(BASE_DIR, 'static')]
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

NOTA: Debemos haber importando os, y tener las carpetas "media" y "static" creadas en el directorio raíz (afuera del core)

Creamos los modelos

Nos dirigimos al archivo (blog/models.py).

El archivo debe verse así:

from django.db import models
# Create your models here.

Debemos crear el modelo de Post, y de las imágenes del Post

Quedaría algo como:

from django.db import models
# Create your models here.
from django.db import models
# Create your models here.
class Post(models.Model):
    titulo = models.CharField("Titulo Post", max_length=50)
    contenido = models.TextField("Contenido")
    created_at = models.DateTimeField(auto_now_add=True) 
    images = models.ManyToManyField('PostImages')
    
    def __str__(self):
        return self.titulo

class PostImages(models.Model):
    image = models.ImageField(upload_to='media/imagenes', verbose_name='Imagenes')
    description = models.CharField(max_length=100, blank=True, verbose_name='Descripción')

Te explico brevemente:
- CharField -> Campo de texto corto (input text)
- TextField -> Campo de texto largo (textarea)
- DateTimeField -> Campo de fecha y tiempo
- ManyToManyField -> Establece una relacion con las imagenes a subir

Migrando modelos a la DB

Django por defecto nos ofrece un ORM predeterminado y una base de datos Sqlite3
Para migrar nuestras tablas y columnas a la base datos debemos realizar los siguientes comandos:

py manage.py makemigrations
py manage.py migrate

NOTA: Si utilizamos imagenes debemos tener instalado Pillow en nuestros entorno virtual pip install Pillow

Registramos el modelo en el admin

En blog/admin.py debemos registrar nuestro modelo, para eso lo importamos y escribimos admin.site.register(MiModelo)

from django.contrib import admin
from .models import Post
# Register your models here.
admin.site.register(Post)
admin.site.register(PostImages)

Creamos un super usuario

py manage.py createsuperuser

De esta manera creamos el super usuario para acceder al /admin

Iniciamos la app

py manage.py runserver

Interfaz admin

Adentro del admin puedes jugar con lo que quieras... suerte!

Crear vistas/urls

Bueno, ya tenemos la forma de crear/modificar/eliminar dentro del admin en un entorno totalmente seguro.
Ahora es el turno de cargar las vistas y los templates.

Vistas

Usaremos BCV es decir Vistas Basadas en Clases (Por sus siglas en ingles), ya que nos ahorra mucho código y es mucho más facil de manejar a futuro.

En el archivo blog/views.py creamos las vistas encargadas

from django.views.generic import ListView, DetailView
from .models import Post

# Vista encargada de listar los articulos
class BlogListView(ListView):
    template_name = 'blog/blog_list.html'
    model = Post

# Vista encargada del detalle del articulo
class BlogDetailView(DetailView):
    template_name = 'blog/blog_detail.html'
    model = Post

Url

Configurar urls, para esto django nos facilita la posibilidad de escribir paths los cuales son literalmente los paths que se van a ver.

En core/urls.py debemos incluir las urls de blog/urls.py

from django.contrib import admin
from django.urls import path, include
from django.conf import settings
from django.conf.urls.static import static

# Incluimos que todas las urls que tengan blog/algo sean del urls.py de blogs
urlpatterns = [
    path('admin/', admin.site.urls),
    path('blog/',include('blog.urls',namespace='blog')) # Incluimos aquí
]

# Nos asegura que las imágenes carguen
if settings.DEBUG:
    urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
    urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

En blog/urls.py debemos escribir las urls con sus respectivas funciones de vista

from django.urls import path
from django.conf import settings
from django.conf.urls.static import static
from .views import BlogDetailView, BlogListView

app_name = 'blog'

urlpatterns = [
    path('', BlogListView.as_view(), name='blog-list'), # Path para listar
    path('detail/<int:pk>', BlogDetailView.as_view(), name='blog-detail') # Path del detalle
]

if settings.DEBUG:
    urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
    urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

Templates

No mencione anteriormente pero en core/settings.py debemos implementar esta porción de código adentro de la variable TEMPLATE

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [os.path.join(BASE_DIR,'templates')] # Esto de acá

... (Sigue mucho codigo)

Los templates deben ir en una carpeta nombrada templates en el directorio raíz.
Para mejor orden en mi caso puse los templates en:
- templates/blog/list_view.html
- templates/blog/detail_view.html

Contenido de los templates

ListView

<h1>Articles</h1>
<ul>
    {% for article in object_list %}
    <li><a href="{% url 'blog:blog-detail' article.id %}">{{ article.titulo }}</a> </li>
    {% empty %}
    <li>No articles yet.</li>
    {% endfor %}
</ul>

https://docs.djangoproject.com/en/4.1/ref/class-based-views/generic-display/#listview

Detail View

<span>{{created_at}}</span>
<h1>{{ object.titulo }}</h1>
<p>{{ object.contenido }}</p>

<h2>Imágenes</h2>
{% if post.images.all %}
    {% for image in post.images.all %}
        <img src="{{ image.image.url }}" alt="{{ image.description }}" class="img-fluid">
    {% if image.description %}
        <p>{{ image.description }}</p>
{% endif %}

{% endfor %}
{% else %}
    <p>No hay imágenes asociadas a este post.</p>
{% endif %}

https://docs.djangoproject.com/en/4.1/ref/class-based-views/generic-display/#detailview

Fin

Así de fácil puedes crear un blog simple con Django 4.1, si no entendiste nada pero te has motivado a seguir aprendiendo toma las riendas y hazlo, no te vas a arrepentir nunca!

Hasta luego!