Lista (CRUD) — Desarrollo con el framework Django

• Agregar la URL
• Crear la vista que devuelve la lista
• Crear la plantilla para mostrar los artículos

Al trabajar en una aplicación web con Django, para permitir operaciones CRUD (Crear, Leer, Actualizar, Eliminar), lo primero es mostrar una lista de objetos. En este caso, trabajaremos con artículos y los mostraremos en una tabla o lista.

Veremos cómo hacerlo paso a paso: configuramos la URL, creamos la vista, diseñamos el template y luego veremos cómo funciona todo junto.

Agregar la URL

Para empezar, le decimos a Django qué dirección debe mostrar nuestra lista de artículos. Esto se hace en el archivo urls.py.

📁 Archivo: article/urls.py

from django.urls import path
from hexlet_django_blog.article.views import IndexView

urlpatterns = [
    path('', IndexView.as_view()),  # Ruta principal que muestra la vista IndexView
]

Estamos utilizando una clase llamada IndexView, que crearemos en el próximo paso. La función as_view() convierte la clase en algo que Django puede usar como una vista.

Crear la vista que devuelve la lista

Una vista en Django es básicamente una función (o clase) que recibe una solicitud (request), hace algo (como consultar una base de datos), y luego devuelve una respuesta, normalmente una página HTML.

📁 Archivo: article/views.py

from django.shortcuts import render        # Para devolver la respuesta con una plantilla
from django.views import View              # Vista basada en clase
from hexlet_django_blog.article.models import Article  # Importar el modelo Article

class IndexView(View):
    def get(self, request, *args, **kwargs):
        articles = Article.objects.all()[:15]  # Traemos los 15 primeros artículos
        return render(request, 'articles/index.html', context={
            'articles': articles,  # Enviamos los artículos al template
        })

¿Qué hace este código?

• Article.objects.all()[:15]: estamos obteniendo los primeros 15 artículos de la base de datos.
• render(...): muestra un archivo HTML que se llama index.html. También le pasamos información adicional usando un diccionario llamado context.

Crear la plantilla para mostrar los artículos

En este archivo HTML vamos a escribir cómo se ven los artículos en la página web.

📁 Archivo: templates/articles/index.html

{% extends "base.html" %}  <!-- Usamos una plantilla base común -->

{% block content %}
    <h1>Lista de artículos</h1>
    {% for article in articles %}
        <h2>{{ article.name }}</h2>  <!-- Título del artículo -->
        <div>{{ article.body|slice:":200" }}</div>  <!-- Primeras 200 letras del contenido -->
    {% endfor %}
{% endblock %}

¿Qué hace esta plantilla?

• {% extends "base.html" %}: hereda una estructura base común que tiene cosas como el encabezado o el menú.
• {% for article in articles %}: recorremos todos los artículos que llegaron en el contexto.
• {{ article.name }}: se reemplaza con el nombre del artículo.
• {{ article.body|slice:":200" }}: muestra solo los primeros 200 caracteres del cuerpo (body) del artículo, como un resumen.

¿Cómo se conectan todas las piezas?

Trabajo independiente