miércoles, 6 de mayo de 2015

Tutorial Django: Parte I


​ Después de haber recorrido el camino de desarrollo de sistemas web dentro de todos los post que he realizado, voy a empezar con otra de las opciones que tenemos dentro de los frameworks web Django. ​


Este proyecto consistirá en desarrollo de un blog. Lo voy a tener al día en mi repositorio de Github y me basaré en la documentación oficial de Django.

1 - Instalación

Existen según la documentación oficial la instalación a manual y través de la herramienta pip, siendo esta última la que voy a usar. Los comandos de instalación en Linux son:

2 - Crear un proyecto

Lo primero que debemos hacer es posicionarnos en la carpeta donde deseamos tener nuestro proyecto y luego ejecutar el comando django-admin.py startproject blog para crear un proyecto, donde blog es el nombre. Esto creará una carpeta con la siguiente estructura:


  • manage.py: Es el que permite correr el proyecto. Toma la configuración del archivo blog/settings.py.
  • blog/__init__.py: Este archivo es más una convención que cualquier otra cosa, ya que indica que este proyecto se trata de un paquete de Python.
  • blog/settings.py: Contiene todas las configuraciones del proyecto.
  • blog/urls.py: Tiene la tabla de asociaciones de URLS y los views.
  • blog/wsgi.py: Es el que permite llamar a este proyecto como aplicación.
Ya con esto somos capaces de montar el servidor, así que ejecutamos en la consola python manage.py runserver y podremos visitar en la dirección (por defecto) localhost:8000. La página que verán a continuación luce como la siguiente:


3 - Crear una aplicación y modelo

En Django para tener un modelo necesitamos una aplicación dentro del proyecto y para eso ejecutamos python manage.py startapp posts, donde posts es el nombre de la aplicación. La estructura de carpetas que se creará es:
  • posts/__init__.py: Nuevamente configuración de paquete de Python.
  • posts/models.py: Contiene los modelos.
  • posts/tests.py: Tienes funciones de prueba para esta aplicación.
  • posts/views.py: Posee las funciones que controlan las vistas.
Ahora podemos crear nuestro modelo dentro de la aplicación y para esto modificaré el archivo posts/models.py así:

Con esto estaré creando un modelo Post que tiene:
  • Nombre del post y de autor con un máximo de 200 caracteres.
  • Valor de contenido del tipo texto (permite saltos de línea).
  • Fecha de publicación.
En este momento le avisamos a nuestro proyecto que deseamos usar este modelo en la base de datos y para esto agregamos primeramente a la lista de aplicaciones en blog/settings.py. El archivo lucirá como el siguiente:

Línea 24 agrega la aplicación.

Luego utilizaré la herramienta de migraciones de Django python manage.py makemigrations posts. Con esto último la aplicación posts ya tiene la carpeta de migraciones preparada y podemos migrar hasta esta versión de la base de datos (por defecto usa el manejador Sqlite), entonces ejecutamos python manage.py migrate. Visita aquí el commit del proyecto hasta este punto.

4 - CRUD del modelo Post

En este momento voy a crear una primera vista dentro de la aplicación, por lo que se necesita:
  • Agregar al archivo blog/settings.py el siguiente código para permitir agregar archivos de HTML.
  • Crear una subcarpeta dentro de la carpeta posts que contenga los archivos HTML, en este tutorial se llamará templates.
  • Crear un archivo HTML con el la vista que deseamos, en este caso mostrar la lista de posts que se tengan almacenados.
En este archivo verán el uso de las etiquetas especiales {% if ... %} (línea 1) y la etiqueta {% for .. in .. %} (línea 3), con estas Django es capaz de utilizar código python dentro del HTML y por lo tanto interactuar con la información que venga de la función del view.
  • Crear una función dentro del views de la aplicación posts.
  • Crear un archivo de dentro de posts con el nombre urls.py y que luzca como el siguiente archivo:
Con esto estamos indicando que el url / usará la función index dentro del archivo views.py.
  • Y por último notificar al blog/urls.py con los links de nuestra aplicación y se logra agregando la siguiente línea: url(r'^posts/', include('posts.urls'))
Al finalizar tendremos un estado del proyecto como el de este commit en mi repositorio. Para verificar que todo haya funcionado levantamos el servidor nuevamente python manage.py runserver, visitamos localhost:8000 y veremos un mensaje que indicará que no se tienen posts publicados.

Ahora bien el hacer cada una de las funciones del modelo y conectarlos con una vista resulta ser un poco más laborioso en Django que en Rails, es por esto que les dejo los HTML correspondientes, las funciones de los views y urls.

Obtener y ver un sólo post:

Crear post:

Editar post:

Eliminar post:

Exportar a Json los post:

5 - Archivos estáticos

Ahora agregare estilo a nuestra página y para eso creare primero una plantilla que le sirva a todos los HTML que tengo hasta ahora. El archivo lucirá como el siguiente y estará en la carpeta de templates.

Y para que todos los archivos HTML que tengo hasta ahora lo conozcan, deberán agregar al principio la instrucción {% extends "base.html" %} y encerrar con las etiquetas {% block principal_content %} y {% endblock principal_content %} el código que se tiene hasta ahora.

Aún así se necesitan agregar los archivos de Bootstrap y Jquery que son invocados desde nuestra plantilla. Para esto creas una carpeta llamada static dentro de la carpeta blog y almacenas los archivos que puedes descargar aquí (fuentes, librerías de Jquery y Bootstrap).

Y para que el proyecto conozca esta carpeta, agrego en blog/settings.py el siguiente código:

Ya con esto podremos visitar nuestras vistas y lucirán como las siguientes imágenes, si agregamos las clases de Bootstrap que corresponden (visita el commit del proyecto para ver esos cambios necesarios).

Crear Post localhost:8000/posts/crear


Lista de Posts localhost:8000


Visitar el Post con identificador 1 localhost:8000/posts/1


Editar el Post con identificador 1 localhost:8000/posts/editar/1



6 - Admin

Por último en este tutorial quiero mostrarles como agregamos el admin a nuestro proyecto y es realmente muy fácil.
  • Primero habilitamos el url /admin desde blog/urls.py.
  • Luego creamos un usuario de tipo administrador. Usamos el comando python manage.py createsuperuser damos un nombre, correo y contraseña.
  • Importamos al archivo posts/admin.py el modelo Post from .models import Post y lo registramos en el admin con el comando admin.site.register(Post).
  • Podemos opcionalmente, editar en el archivo blog/settings.py la variable LANGUAGE_CODE y colocar el valor 'es-es' para ver el sitio web del admin en español.
Con esto podremos visitar nuestro admin y ver bajo la dirección localhost:8000/admin la siguiente página:


Ahora bien cuando navegamos hasta la opción de los posts, veremos que tenemos una lista de posts con atributos poco amigables, así que para eso lo podemos mejorar creando un manejador de modelo. Esto último se logra editando el archivo posts/admin.py como sigue: De esta forma tendremos la lista que luce así:


Y si queremos agregar un nuevo Post, el menú luce de la siguiente forma:


Visita aquí el commit del proyecto hasta este punto.

Como siempre, si algo no queda muy claro siempre me pueden escribir a mi correo tonylattke@gmail.com o también pueden dejar comentarios al final de este post y trataré de ayudarles lo antes posible.

No hay comentarios:

Publicar un comentario