Laboratorio 6: Introducción a Django

Objetivos

Durante esta práctica, los alumnos serán capaces de:

Instalar el framework de web Django.
Conocer el proceso para crear proyectos y aplicaciones en Django.
Escribir vistas y plantillas sencillas en Django, así como configurar sus respectivos URLs.

Esta actividad promueve las siguientes habilidades, valores y actitudes: análisis y síntesis, capacidad de resolver problemas, creatividad, y uso eficiente de la informática y las telecomunicaciones.

Descripción de la actividad

NOTA IMPORTANTE: Las actividades de la práctica se pueden elaborar de manera individual o en parejas. El reporte de la práctica de laboratotio debe ser desarrollado de manera individual.

Instrucciones preliminares

Si aún no las hecho, instala Django en tu sistema. Descarga el tarball de la distribución oficial Django-1.3.1.tar.gz y ejecuta los siguiente comandos desde la terminal:
```
tar xzvf Django-1.3.1.tar.gz

cd Django-1.3.1

sudo python setup.py install
```
Para verificar que Django haya sido correctamente instalado, corre el intérprete de Python y ejecuta las siguientes instrucciones:
```
>>> import django
>>> django.VERSION
(1, 3, 1, 'final', 0)
```
Si no se reporta ningún error quiere decir que la instalación fue exitosa.

Crea un nuevo proyecto web de Django llamado ejemplo. Desde la terminal teclea:

django-admin.py startproject ejemplo

Esto crea un nuevo folder llamado ejemplo.

cd ejemplo

Al listar el directorio encontrarás cuatro archivos:

File Name	Description
`__init__.py`	Indica que el folder actual es un paquete de Python.
`manage.py`	Script que permite interactuar con el proyecto de Django en diversas maneras.
`settings.py`	Archivo de configuración para este proyecto de Django.
`urls.py`	Mapeos de URLs para este proyecto de Django.

Corre el servidor de web de desarrollo para ver si funciona correctamente. Desde la terminal teclea:
```
python manage.py runserver
```
Ahora apunta tu navegador al siguiente URL: http://localhost:8000/. Debe aparecer una página de felicitación.

Deja corriendo este servidor de web en su propia ventana.
Abre otra terminal y cámbiate al directorio ejemplo. Crea ahí un nuevo directorio llamado templates tecleando lo siguiente en la terminal:
```
mkdir templates
```
Indica a Django el sitio donde está localizado el directorio que contiene las plantillas (el folder templates). Abre en un editor el archivo ejemplo/settings.py, busca el lugar donde se asigna la variable TEMPLATE_DIRS y añade las líneas resaltadas a continuación:
```
import os.path

TEMPLATE_DIRS = (
    # Put strings here, like "/home/html/django_templates" or "C:/www/django/templates".
    # Always use forward slashes, even on Windows.
    # Don't forget to use absolute paths, not relative paths.
    os.path.join(os.path.dirname(__file__), 'templates').replace('\\','/'),
)
```
La ventaja de usar el código anterior en lugar de poner el directorio explícito (por ejemplo '/home/usuario/ejemplo/templates') es que resulta más sencillo copiar y correr el proyecto en otro equipo, incluso usando otro sistema operativo.

Crea un archivo llamado base.html dentro del directorio templates. Cada documento HTML que se escriba en lo sucesivo extenderá de este archivo. Su contenido debe ser:

<!DOCTYPE html>

<html lang="es">
    
    <head>
        <meta charset="utf-8">
        <style type="text/css">
            body {
                color: #efd;
                background: #453;
                padding: 0 2em;
                margin: 0;
                font-family: sans-serif;
                font-size: 120%;
            }
            h1 {
                padding: 30px 30px;
                background: #675;
                color: #ffa;
                font-size: 150%;
            }
            h2 {
                color: #bf8;
                border-top: 1px dotted #fff;
                margin-top: 2em
            }
            p {
                margin: 1em 0
            }
            a:link {
                color: #fe5;
            }
            a:visited {
                color: #fe5;
            }
            a:hover {
                color: #fe5;
            }        
            hr {
                margin: 20px 0px;
                color: #efd;
                background-color: #efd;
                height: 2px;
            }
            footer {
                font-size: 90%;
                color: #ffa;
                text-align: center;
            }
        </style>
        <title>{% block titulo %}Sin título{% endblock %}</title>
    </head>
    
    <body>
        {% block principal %}Sin cuerpo{% endblock %}
        <hr/>    
        <footer>
            Desarrollo de aplicaciones distibuidas        
        </footer>
    </body>

</html>

Crea una nueva aplicación llamada saluda. En la terminal teclea:
```
python manage.py startapp saluda
```
Crea una función de vista que envíe información a una plantilla. Edita el archivo ejemplo/saluda/views.py para que tenga el siguiente contenido:
```
from django.shortcuts import render_to_response

def hola(request):
    return render_to_response('saluda.html', {'nombre': 'Juan Camaney'})
```

Crea la plantilla en el archivo saluda.html en el folder templates. Su contenido debe ser:

{% extends "base.html" %}

{% block titulo %}Hola{% endblock %}

{% block principal %}
    <h1>Hola {{ nombre }}!</h1>
    <p>
        ¡Sí! Esta es mi primera aplicación web en Django.
    </p>
{% endblock %}

Relaciona la función de vista con un patrón URL. Edita el archivo ejemplo/urls.py añadiendo la línea resaltada:

urlpatterns = patterns('',
    # Examples:
    # url(r'^$', 'ejemplo.views.home', name='home'),
    # url(r'^ejemplo/', include('ejemplo.foo.urls')),

    # Uncomment the admin/doc line below to enable admin documentation:
    # url(r'^admin/doc/', include('django.contrib.admindocs.urls')),

    # Uncomment the next line to enable the admin:
    # url(r'^admin/', include(admin.site.urls)),
    (r'^saluda/$', 'ejemplo.saluda.views.hola'),
)

En tu navegador, visita el siguiente URL: http://localhost:8000/saluda/

Problema

En el mismo proyecto ejemplo de Django, crea una nueva aplicación llamada fibonacci, la cual debe calcular y desplegar los primeros 100 números de la serie de Fibonacci al momento de solicitar al navegador el siguiente URL: http://localhost/fibonacci/. Los primeros dos números de la serie de Fibonacci son 0 y 1; los siguientes se calculan sumando los dos números anteriores. Todos los números resultantes se deben desplegar usando una lista ordenada (usando la etiqueta <ol> de HTML) con numeración romana (usando CSS). Por ejemplo:

...

Verifica que la página producida sea HTML5 válido utilizando el Servicio de Validación de W3C.

¿Qué se debe entregar?

Para entregar tu trabajo individual, sigue las siguientes instrucciones:

Escribe el reporte de la práctica tal como se detalla en el documento Lab Reports. El nombre del archivo fuente de AsciiDoc debe ser reporte_lab6_A0MMMMMMM.txt, en donde A0MMMMMMM corresponde a tu matrícula. A partir del código fuente de AsciiDoc debes generar el archivo HTML correspondiente. Dicho archivo se debe llamar reporte_lab6_A0MMMMMMM.html. Coloca ambos archivos dentro del directorio ejemplo.
Crea un archivo tarball con todo el contenido del directorio ejemplo. Nombra a este archivo ejemplo.tgz. Este archivo se puede crear desde la línea de comando tecleando lo siguiente (asegúrate que te encuentres en el mismo nivel que el directorio ejemplo):
```
tar czf ejemplo.tgz ejemplo
```
Usando el Sistema de Entrega de Tareas Automatizado (SETA), entrega el archivo tarball.

Fecha límite: Martes, Octubre 4.

Evaluación

Esta actividad será evaluada usando los siguientes criterios:

50%	Implementación de los requerimientos.
50%	Reporte de la práctica de laboratorio.
DA	El programa y/o reporte es un plagio.

Desarrollo de aplicaciones distribuidas