Django 2: Como crear una aplicación web en poco tiempo



Django 2 es un framework para desarrollo web con Python y realmente simplifica mucho el trabajo de crear código. Si nunca lo has utilizado antes y si no tienes experiencia con Python, en este artículo voy a mostrarte como crear una aplicación web muy sencilla usando Django 2 y Python 3, mientras creas el código te iré explicando paso a paso todo lo que está sucediendo, así que no necesitas conocimientos previos de Django o Python.

Primero comencemos con lo que vas a aprender al leer este artículo:

Instalar Python 3 y Django 2

Lo primero que debes hacer es instalar Python, puedes descargarlo en www.python.org y luego pones el mouse sobre el menú Downloads, verás que se abre un menú en donde puedes hacer clic y descargar el instalador de Python, claro todo esto, si lo estás instalando en Windows. Si usas Mac o Linux posiblemente ya lo tengas instalado.

Descargar Python
Descargar Python

Ahora abres el instalador que descargaste y te aseguras de seleccionar la opción Add Python x.xx to PATH y hacer clic sobre Customize Installation

Opciones para instalar Python de la mejor forma y evitar problemas
Instalación personalizada

En la siguiente pantalla marcas todas las opciones y das clic en Next o Siguiente, en todas las demás pantallas hasta finalizar.

Opciones que hay que elegir al instalar Python
Opciones de instalación de python

Ahora para comprobar que todo está bien, puedes abrir una ventana de comando DOS y escribes:

python -V
Revisar la instalación de Python
Versión de Python

Ahora que Python está instalado y funcionando, vamos a instalar Django, usualmente para esto se crea un ambiente virtual, pero para simplificar este articulo, vamos a instalarlo de forma global escribiendo el comando:

pip install django

NOTA: El ambiente virtual es más que todo, para poder trabajar con diferentes versiones de cada paquete de Python por ejemplo en un proyecto usas Django con una versión y en otro proyecto usas una versión diferente.

Creando tu primer proyecto en Django

Un proyecto es una desarrollo basado de Django, para casos prácticos puedes verlo así: Si tienes una aplicación web, eso es un proyecto, si vas a crear otra aplicación web, entonces ese será otro proyecto.

Ahora, en Django una aplicación es un conjunto de modelos, vistas, plantillas, rutas, etc, que hacen proveen una funcionalidad específica. La idea es que estas aplicaciones sean independientes y que puedas utilizar en varios proyectos.

Por ejemplo, puedes crear una aplicación llamada foro, y cuando trabajes en un proyecto que necesite un foro, entonces puedes utilizar esa aplicación.

Ahora, crea tu primer proyecto en Django escribiendo este comando en una consola:

django-admin startproject app

Esto creará un proyecto llamado app, con esta estructura de carpetas y archivos

Estructura de carpetas de un proyecto de django 2

La carpeta app es la carpeta del proyecto y contiene varios archivos, también se crea un archivo llamado manage.py

  • manage.py: Es un archivo para ejecutar comandos de consola, internamente ejecuta el comando django-admyn.py que es el que usamos para crear el proyecto.
  • app: este es el archivo de proyecto, su nombre cambia según el nombre con el que creaste el proyecto y contiene estos archivos:
    • __init__.py: Es un archivo vacío, lo que hace es indicar a Python que trate esta carpeta como un módulo de Python.
    • settings.py: Configuración del proyecto
    • urls.py: Aquí colocas las url o rutas de tu aplicación web
    • wsgi.py: Contiene la configuración para correr tu proyecto como una Web Server Gateway Interface.

Con Django no inicias desde cero, así que vamos a inicializar algunas tablas que usan algunas aplicaciones que ya tienes a tu disposición, para esto ejecutamos este comando:

cd app
python manage.py migrate

Si todo se ejecutó bien, ya deberías de poder iniciar un servidor web y ver tu aplicación. Así que ejecuta este comando:

python manage.py runserver

Ahora, si ingresas en un navegador a la dirección http://127.0.0.1:8000 verás una página como esta:

Pagina de inicio predeterminada para los proyectos de django
Página de inicio de django

Creando tu primera aplicación de Django

Muy bien, ahora que tienes tu proyecto de Django funcionando, vamos a crear una aplicación. En una ventana de comandos, dentro de tu proyecto, escribe esto:

python manage.py startapp anuncios

El comando anterior creará una nueva carpeta como esta:

Estructura de carpetas de Django
Archivos en aplicación de django
  • admin.py: Aquí es donde se registran los modelos para incluirse en el sitio de administración que genera Django.
  • apps.py: Aquí se coloca la configuración principal de esta aplicación
  • models.py: Aquí se definen los modelos que se usarán (tablas de bases de datos)
  • tests.py: Aquí es donde pones los tests o pruebas de tu aplicación
  • views.py: Aquí es donde va la lógica de tu aplicación, para cada URL de tu aplicación aquí se coloca el código que va a ejecutarse. No debe ser confundida con plantillas o vistas HTML.

Ahora tenemos que activar la aplicación y decirle al proyecto que debe usarla. Para esto buscamos el archivo settings.py y agregamos la siguiente línea en la variable INSTALLED_APPS

'anuncios.apps.AnunciosConfig',
Activar una aplicación de django
Activar aplicación en django

Si quieres saber de dónde sale esa línea de código o cómo puedes hacer cuando tengas que activar otra aplicación, esta imagen lo resume todo:

Aplicación de django
De aquí sale la linea de codigo para activar la aplicación

Diseñando tu primero modelo

Los modelos son clases de Python, en donde cada clase representa una tabla en la base de datos, y sus atributos representan campos en la tabla.

Junto con la clase, Django provee métodos para poder realizar todas las operaciones de SQL: CRUD

Vamos ahora a definir una clase llamada anuncio, en esta serán almacenados anuncios que van a mostrarse en la página principal.

from django.db import models
from django.utils import timezone
from django.contrib.auth.models import User
class Anuncio(models.Model):
    STATUS_CHOICES = (
        ('draft', 'Draft'),
        ('published', 'Published'),
    )
    titulo = models.CharField(max_length=150)
    texto = models.TextField()
    created = models.DateTimeField(auto_now_add=True)
    estado = models.CharField(max_length=10,
                              choices=STATUS_CHOICES,
                              default='draft')
    class Meta:
        ordering = ('-created',)
    def __str__(self):
        return self.titulo

En el código anterior primero importamos algunas librerías, luego definimos una clase llamada Anuncio. Cada atributo se define con un tipo especial que altera el comportamiento en la aplicación.

  • titulo: Se define como char de hasta 150 letras
  • texto: Se define como un texto largo
  • created: Es un campo fecha-hora, con el parámetro auto_now_add=True, hacemos que se llene automáticamente con la fecha del sistema en su momento de creación.
  • estado: Este se define como uno entre una lista de valores, los valores los definimos en una variable llamada STATUS_CHOICES al inicio
  • __str__ : Es un método, que regresa una representación de la clase, entendible para humanos, en este caso regresa el título del anuncio.
  • class Meta: Define metadatos para la clase, en este caso, define cómo se van a ordenar los datos, y es por fecha de creación. El signo menos, hace que se ordene de mayor a menor.

NOTA: Para más información sobre los tipos que puedes usar en cada atributo puedes consultar esta página web: Documentación de fields

Ahora que hemos definido el modelo, es hora de pedirle a Django que cree las tablas en la base de datos. Esto se logra con estos dos comandos:

python manage.py makemigrations anuncios
python manage.py migrate

Editar tablas usando el Administrador de sitio

Muy bien, ahora vamos a utilizar la sección Admin de nuestro proyecto, para editar los datos en este modelo. Pero primero debemos crear un superusuario, esto se logra escribiendo este comando en una ventana de consola y siguiendo los pasos del asistente.

python manage.py createsuperuser

Ahora tenemos que editar el archivo app/anuncios/admin.py de forma que quede así:

from django.contrib import admin
from .models import Anuncio
admin.site.register(Anuncio)

Para probar esto, levantamos nuevamente el servidor e ingresamos a esta dirección: http://127.0.0.1:8000/admin/

Si todo esta bien, veras una pantalla como esta

Backend en Django
Admin

Desde la pantalla anterior puedes realizar todas las operaciones de actualización: Agregar, eliminar, consultar y modificar.

Crear vistas y plantillas

Ahora vamos a crear una vista pública, para que cualquiera pueda ver los anuncios que crees. Para esto debes de crear un archivo llamado app/anuncios/views.py y con este código:

from django.shortcuts import render, get_object_or_404
from .models import Anuncio
def anuncios_list(request):
    anuncios = Anuncio.objects.filter(estado="published")
    return render(request,
                  'anuncios.html',
                  {'anuncios': anuncios})

El archivo anterior es lo que se conoce como el controlador en el modelo MVC, ahí se crea una función, esta llena una variable llamada anuncios con el objeto Anuncio (del modelo que creaste antes) y llama a su método objects.filter que hace un select a la tabla para todos aquellos anuncios que tenga el campo estado igual “published”.

Luego llama a la función render, que crea una versión HTML para mostrar al usuario, usando el parámetro request que se recibió en la función, luego manda el nombre de la plantilla HTML y finalmente envía una variable con todos los anuncios que se recuperaron de la base de datos.

Ahora vamos a crear la URL para mostrar la vista que acabamos de crear. En el archivo app/anuncios/urls.py coloca este código:

from django.urls import path
from . import views
app_name = 'anuncios'
urlpatterns = [
    # post views
    path('', views.anuncios_list, name='anuncios_list')
]

Con el código anterior creamos una URL, en este caso path está vacía, entonces será la ruta conocida como home o inicio

Ahora modifica el archivo app/urls.py para que quede de esta forma:

from django.contrib import admin
from django.urls import path,  include
urlpatterns = [
    path('admin/', admin.site.urls),
    path('', include('anuncios.urls', namespace='anuncios')),
]

Muy bien, ya casi terminamos, ahora solo falta crear un archivo llamado anuncios\templates\anuncios.html con este código:

<!DOCTYPE html>
<html>
<head>
  <title>Listado de anuncios</title>
</head>
<body>
  <div id="content">
    {% block content %}
      <h1>Lista de anuncios</h1>
      {% for anuncio in anuncios %}
        <h2>
            {{ anuncio.titulo }}
        </h2>
        <p>
          {{ anuncio.texto }}
        </p>
      {% endfor %}
    {% endblock %}
  </div>
</body>
</html>

Cómo ves el código anterior es muy sencillo, la mayoría es código HTML y entre bloques {% %} se coloca el código, y entre bloques {{ }} se colocan variables. En este caso se hace un bloque foreach y se imprimen todos los anuncios que se reciben desde la vista que creamos unos pasos antes.

tu primera pagina de frontend en django
Ejemplo de django: Vistas, url y plantilla

Si quieres más información sobre como trabajar con estas plantillas HTML, puedes consultar esta dirección: Documentación de plantillas

He tratado de mantener el ejemplo lo más sencillo posible, porque es solo una introducción. Mostrar todas las capacidades de Django tomaría mucho más tiempo. Pero si te mantienes pendientes de este blog, voy a seguir escribiendo artículos que seguramente van a gustarte.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

5 Comments

  1. Avatar de dayana

    excelente sigue asi es de mucha ayuda, como utilizo la ruta de los archivos staticos el static-root, media utilizo pycharm

  2. Avatar de Nese

    Una maravilla de artículo, pude construir paso a paso el listado de anuncios, te agradezco lo fácil que lo explicas, un diez para ti.
    Podías publicar más cositas de Django.