UNIVERSIDAD INDUSTRIAL DE SANTANDER

Escuela de Ingenieras Elctrica, Electrnica y de Telecomunicaciones

(E3T)

Perfecta Combinacin entre Energa e Intelecto

ENTREGA DE PROYECTO
Presentado a: ING. Dorfell Leonardo Parra Prada

Bohrquez Quintero, David Fernando (Author)

Serrano Pea, Ronaldo Enrique (Author)

Cdigo: 2141861
Materia: Programacin de computadores II
Bucaramanga, Colombia
e-mail: davidfbq@gmail.com

Cdigo: 2141825
Materia: Programacin de computadores II
Bucaramanga, Colombia
e-mail:c1n1v1|1196@gmail.com

Abstract In this Project is shown the development of

Djangos web tutorial and some specific things that we
consider relevant in this process.
KeywordsDatabase, Django, Framework, Python

I. INTRODUCCIN Y OBJETIVO GENERAL

Django es un framework web de Python que ofrece un
fcil desarrollo y un diseo simple. La ventaja ms
importante de este framework es que es libre y de cdigo
abierto, lo cual facilita el uso de la herramientas que este
desarrollador ofrece. El objetivo de este proyecto es
mostrar el uso de Django en el desarrollo del tutorial que
consta de 6 partes.
II. DESCRIPCIN DEL PROBLEMA
El gobierno nacional est promoviendo un programa
de soporte para PYMES que quiere crear pginas web
con encuestas a clientes, distribuidores y vendedores.
III. SOLUCIN
Una propuesta de solucin est basada en la
implementacin de las herramientas aprendidas en las
clases de programacin II, las cuales son: Python,
Django, HTML y CSS.
Para poder realizar este tutorial, se debe instalar
primero Django desde la lnea de comando con el
comando pip install Django==1.9.3, para esto se
debe configurar las variables de entorno de Windows y al
path se le agrega la direccin de Python; de esta manera:
Fig 1. Modificacin de variable de usuario

1.

PARTE 1

El objetivo inmediato es ir al proceso de desarrollo de

una encuesta bsica en Django. Para esto, es importante
iniciar con el siguiente comando:
-

django-admin startproject mysite

cd mysite (Un paso vital que tiende a omitirse

y causa inhabilidad para ejecutar el siguiente
comando)

python manage.py migrate (El comando

migration se realiza para editar la base de datos,
guardando los cambios hechos).

python manage.py runserver (Comando

usado para ejecutar el servidor y verificar que este
no presente problemas. No es necesario reiniciar
el servidor para ver los cambios de la base de
datos, basta con actualizar la pgina del
explorador que se est usando).

UNIVERSIDAD INDUSTRIAL DE SANTANDER

Escuela de Ingenieras Elctrica, Electrnica y de Telecomunicaciones
(E3T)

Perfecta Combinacin entre Energa e Intelecto

Fig. 2. Ejecucin de runserver

Python manage.py startapp polls (Y de

esta forma se crea la aplicacin para las
encuestas)

La forma ms sencilla de representar una aplicacin

es a travs de clases; en este caso, seran Question y
Choice, las cuales son los modelos requeridos por el
momento. En el siguiente cdigo (Figura 2) se ver que
cada modelo est representado por una clase heredada
de django.db.models.Model. Una Question tiene los
atributos pregunta y fecha de publicacin. Por otra
parte, Choice tiene los atributos de voto y de texto de
eleccin. Cada Choice est asociado a una Question.
Fig. 3. archivo models.py

Fig. 4. Adicin de aplicacin (127.0.0.1/polls/)

Despus de esto, se import timezone que es una

herramienta de la librera django.utils que permite
mostrar la fecha en que se crea una pregunta. Esto se
hizo desde la lnea de comando usando la instruccin
python manage.py shell.
Estando dentro del Shell en la lnea de comando, se
agregaron elecciones a la pregunta de ejemplo whats
up?
2.

PARTE 2

Esta parte del tutorial inicia con la creacin de un

usuario que pueda iniciar sesin en el sitio de
administracin, para ello se ejecuta el comando
manage.py createsuperuser el cual muestra la
opcin de nombre de usuario y su respectivo correo
contrasea.
Seguido de esto, se puede iniciar el sitio del
administrador usando el ya usado comando manage.py
runserver de ah, nos dirigimos al explorador web hacia
/admin/, donde encontramos:
Fig. 5. Tomada de http://127.0.0.1:8000/admin/

Ahora se incluye la nueva aplicacin dentro del archivo

settings.py contenido dentro de la carpeta interna de
mysite, esto con la finalidad de habilitar las nuevas
migraciones de los modelos. (Python manage.py
makemigrations polls y Python manage.py
migrate):

Al ingresar al sitio de administracin, se encuentran

unas opciones editables, las cuales son las preguntas y
los usuarios. Adicional a eso, se ve en un costado de la
2

UNIVERSIDAD INDUSTRIAL DE SANTANDER

Escuela de Ingenieras Elctrica, Electrnica y de Telecomunicaciones
(E3T)

Perfecta Combinacin entre Energa e Intelecto

pgina, las actividades recientes de la pgina. Pero no

aparece la aplicacin creada polls.

Fig. 8. Filtro y barra de bsqueda

Para esto, se debe decir al administrador qu objetos

de la clase Question tienen una interfaz de administracin,
esto se realiza dentro del archivo admin.py que se
encuentra dentro de la carpeta polls.
Fig. 6. Modificacin de entorno de administracin

Despus se crea una carpeta de plantillas dentro de la

primera carpeta mysite, y en esta se agregan unas listas
DIRS.
Finalmente: se copia el archivo base_site.html que se
encuentra por defecto en la carpeta de Django y se pega
en la carpeta templates, ah se modifica el ttulo de la
pgina principal de administracin, obteniendo el
siguiente resultado:
Fig. 9: 127.0.0.1:8000/admin/polls

Despus, en el documento admin.py que se

encuentra en la carpeta polls, se agregan unos campos
que brindan informacin sobre la fecha de publicacin o
modificacin de una pregunta con la instruccin
fieldsets, y dentro de sta, pub_date:
Fig. 7. Informacin de preguntas.

3. PARTE 3
En esta tercera parte, se crea la interfaz pblica, las
vistas (views).
Una vista es una especie de pgina web en la
aplicacin de Django que generalmente tiene una funcin
y una plantilla (template) especficas.
Cada vista est representada por una funcin sencilla
de Python. Django elige la vista examinando la URL
requerida (la parte de URL despus del nombre del
dominio)
Primero se crea la vista, modificando el archivo
view.py que se encuentra en la carpeta polls:
Luego, se pueden agregar campos de bsqueda de
pregunta y un filtro de fechas usando dentro de admin.py
en la clase Question los siguientes comandos:
list_filter= [pub_date] y search_fields=
[QUESTION_TEXT] lo cual muestra el siguiente
entorno:

Fig. 10. Creacin de vistas

UNIVERSIDAD INDUSTRIAL DE SANTANDER

Escuela de Ingenieras Elctrica, Electrnica y de Telecomunicaciones
(E3T)

Perfecta Combinacin entre Energa e Intelecto

Esta es la vista ms simple de Django. Para acceder

a la vista, esta debe ser asignada a una URL, y para ello,
se requiere una URLconf (configuracin de URL). Lo
siguiente es direccionar la configuracin realizada hacia
polls.urls, para ello se modifica el archivo urls.py
contenido dentro de la carpeta de mysite, y se actualiza
la pgina del explorador que se est usando, se mostrar
el mensaje Hello world, Youre at the polls
index. que se haba agregado en view.py.

Fig. 14. Modificacin de vista

Ahora, para aadir las vistas modificadas

anteriormente, se aade un nuevo mdulo en el archivo
urls.py:
Fig. 11. Adicin de mdulo

Despus de esto, se crea una nueva plantilla en la ruta

polls/templates/polls/index.html donde este archivo
tendr el siguiente cdigo:
Fig. 15. Creacin de index.html.

Con esta modificacin, al actualizar la pgina que se

est usando, se vera lo siguiente:
Fig. 12. Resultados de pregunta (localhost:8000/polls/34/results)

Seguido de esto, se modifica el archivo ubicado en

polls/views.py donde se digita el comando from
django.template import loader. Al hacer este
cambio, y actualizar la pgina del explorador, se tendra:

Fig. 13. Vista despus de una votacin

Fig. 16. localhost:8000/polls/

Ahora se crearn las vistas que hacen algo, adems

de mostrar texto.

Con el objetivo de mostrar un error de tipo

http404error en caso de que no halla Httpresponse, se
modifica el archivo views.py de la siguiente manera:

Cada punto de vista es responsable de hacer una de

dos cosas: devolver un HttpResponse el cual es un objeto
que contiene el contenido de la pgina solicitada o lanzar
una excepcin como Http404. Esto se hace hiendo al
archivo views.py que est dentro de polls e
importando Questions desde models.py; adems se
modifica index para que no se siga mostrando el mensaje
inicial hello world para que muestre esto:

UNIVERSIDAD INDUSTRIAL DE SANTANDER

Escuela de Ingenieras Elctrica, Electrnica y de Telecomunicaciones
(E3T)

Perfecta Combinacin entre Energa e Intelecto

Fig. 17. mysite/polls/views.py

En la anterior parte se haba creado una carpeta polls

dentro de templates, y a su vez, un archivo detail.html,
al cual se le har la siguiente actualizacin:
Fig. 20. Actualizacin de detail.html.

Finalmente, en esta parte del tutorial se mejora la

barra de bsqueda dentro del entorno de Question en el
admin site. Se puede buscar una pregunta por una parte
de la misma, o la letra inicial, y se muestran los resultados
obtenidos:
Fig. 18. Ninguna pregunta encontrada.

En la plantilla anterior se muestra un botn de tipo

radio para cada eleccin de pregunta. El valor de cada
botn es el ID de la eleccin asociada a una pregunta. El
nombre de cada botn es choice. Lo cual significa que,
cuando el usuario selecciona uno de los botones y enva
el formulario, este enviar los datos de POST choice= #,
donde # es el ID de la opcin seleccionada. Este es el
concepto bsico de los formularios de HTML.
Luego se crear una view de Django que maneje los
datos enviados y realiza algo con ellos. En la parte
anterior se ha creado una URLconf para la presentacin
de encuestas y otra de relleno de la funcin vote(). Ahora
se crea una versin real, con la siguiente modificacin al
archivo views.py dentro de la carpeta polls:
Fig. 21. mysite/polls/views.py

Fig. 19. Pregunta encontrada.

Se ha utilizado la funcin reverse() en este ejemplo.

Esto ayuda a evitar tener que codificar una direccin URL
en la funcin de vista.
Despus se crea un archivo llamado results.html con
el siguiente cdigo:
4. PARTE 4
Esta parte del tutorial se centra en la forma de procesar
y cortar el cdigo que se est empleando.
5

UNIVERSIDAD INDUSTRIAL DE SANTANDER

Escuela de Ingenieras Elctrica, Electrnica y de Telecomunicaciones
(E3T)

Perfecta Combinacin entre Energa e Intelecto

Fig. 22. polls/templates/polls/results.html.

Fig. 25. modificacin de mysite\polls\views.py

Al ejecutar dicho cdigo, se actualiza la pgina del

explorador y se obtiene:
Figura 23: Ejecucin del archivo results.html.

Las vistas detail() y results() usadas en la parte

anterior, son demasiado simples.
Estas views representan un caso comn en el
desarrollo web bsico: obtener datos de una base de
datos de acuerdo a un parmetro pasado en la URL,
cargar un template y devolver el template renderizado.
Por ser tan usual, Django provee un atajo, el sistema de
generic views (vistas genricas)
Ahora se convierte la aplicacin para poder usar estas
vistas genricas y poder borrar parte del cdigo general;
son tres pasos a seguir:
i) Convertir el URLconf (esto se realiza desde el
archivo urls.py)
Fig. 24. mysite\polls\urls.py.

ii)

Borrar algunas de las vistas que ahora son

innecesarias

iii)

5.

Arreglar el manejo de URL para las nuevas

vistas

PARTE 5

Los tests son rutinas simples que revisan el

funcionamiento del cdigo que se est trabajando.
Lo que diferencia a los tests automatizados es que el
trabajo de realizar las revisiones lo ejecuta el sistema por
quien est trabajando en l. Se crea un conjunto de tests
una vez, y luego a medida que se hacen cambios a la
aplicacin, en este caso polls, se puede verificar que el
cdigo an funciona como estaba originalmente
pensado, necesidad de hacer testing manual.
Hay un bug dentro de la aplicacin que se puede
arreglar: el mtodo Question.was_published_recently()
devuelve True si una Question fue publicada el da
anterior, pero tambin si el campo pub_date es en el
futuro, no est bien.
Fig. 26. Ejecucin de bug del mtodo
Question.was_published_recently()

UNIVERSIDAD INDUSTRIAL DE SANTANDER

Escuela de Ingenieras Elctrica, Electrnica y de Telecomunicaciones
(E3T)

Perfecta Combinacin entre Energa e Intelecto

Lo realizado en el Shell para verificar el problema, es

exactamente lo que se puede hacer en un test
automatizado.
El lugar por convencin para los tests de una
aplicacin es el archivo test.py el corredor de test va a
buscar los test all automticamente, en aquellos archivos
cuyo nombre empiece por test.

regresar False si pub_date tiene un valor en el futuro.

As que se debe modificar el mtodo en models.py para
que slo devuelva True, si adems la fecha es en el
pasado.
Fig. 28. Modificacin de la funcin was_published_recently()

Fig. 27. Modificacin del archivo polls/test.py para modificar el test.

Se puede volver a correr el test nuevamente para ver

cmo funciona.
Hasta este punto, lo que se ha hecho es crear una
subclase de django.test.TestCase con un mtodo
que genera una instancia de Question.

Fig. 29. Ejecucin del test despus de la modificacin de la funcin.

Desde la lnea de comando, consola o terminal, se

puede ejecutar la revisin (el test).
Fig. 27. Ejecucin del test en el Shell por medio de la consola.

Es posible mejorar la cobertura del mtodo

was_published_recently(), se debera revisar si
debido al intento de arreglo de un bug, se haya
introducido otro.
Para ello se agrega dos mtodos ms a la misma
clase, para testear el comportamiento del mtodo de
forma ms exhaustiva.

Aqu, el comando python manage.py test polls

busc test en la aplicacin polls, encontr una subclase
de django.test.TestCase y cre una base de datos
especial para los test. Adems, busc los mtodos de
test, aquellos cuyo nombre comienza con test en
test_was_published_recently_with_future_q
uestion, cre una instancia de Question cuyo valor para
el campo pub_date es 30 dias en el futuro, y haciendo
uso del mtodo asserEqual() descubri que
was_published_recently() muestra un valor True ,
a pesar de que lo esperado era que devolviera False.
Ya es sabido que el inconveniente planteado es que
Question.was_published_recently()
debera
7

UNIVERSIDAD INDUSTRIAL DE SANTANDER

Escuela de Ingenieras Elctrica, Electrnica y de Telecomunicaciones
(E3T)

Perfecta Combinacin entre Energa e Intelecto

Fig. 30. Adicin de dos mtodos ms para evitar ms bug.

En este momento, es posible ver que el

comportamiento es el que se espera, ejecutando el
servidor de desarrollo, cargando el sitio en el explorador
de internet empleado, creando Questions con fechas en
el pasado y en el futuro y revisando que solamente se
listan aquellas que han sido publicadas.
Ahora se realiza la adicin del mdulo reverse
contenido en django.core.urlresolvers y crear un
mtodo de atajo para las preguntas, adems de una
nueva clase test.
Fig. 33. Modificacin del archivo test.py.

Django provee un cliente para test, client, para simular

la interaccin del usuario con el cdigo a nivel view. Se
puede usar en test.py o incluso en el shell.
Fig. 31. Importacin de la clase client para test.

Las listas de preguntas, muestra entradas que no

estn publicadas por el momento, aquellas que tienen
pub_date en el futuro; por lo cual es necesario un
arreglo:
Fig. 32. Importacin de django.utils y modificacin del mtodo
get_queyset.

Lo que se tiene funciona bien; sin embargo, aunque

las encuestas futuras no aparecen en el ndice, un
usuario todava puede verlas si sabe o adivinan la URL
correcta. Por ende se coloca restricciones similares para
DetailViews.

UNIVERSIDAD INDUSTRIAL DE SANTANDER

Escuela de Ingenieras Elctrica, Electrnica y de Telecomunicaciones
(E3T)

Perfecta Combinacin entre Energa e Intelecto

Fig. 34. Modificacin del archivo views.py.

Adicional a eso, se debe modificar el archivo

index.html para cargar styles.css.
Al actualizar la pgina del explorador, se evidencian
los cambios. y se miran los cambios.

Adems se agregan ms tests para chequear que una

Question cuya fecha de publicacin es en el pasado se
pueda ver, mientras que una con pub_date en el futuro,
no.
Fig. 37.

http://localhost:8000/polls/

Fig. 35. Modificacin del archivo test.py para agregar ms tests.

A continuacin se crea una carpeta para imgenes en

la direccin polls/static/polls.
Dentro de la carpeta imgenes se guarda un archivo
llamado background.gif.
Ahora se agrega a la hoja de estilos styles.css las
siguientes lneas de cdigo.
Fig. 38. Se agrega background.gif a la hoja de estilos.

6.

PARTE 6

En esta parte del tutorial primero se crea una carpeta

llamada static en nuestro directorio polls, Django va a
buscar archivos estticos, de forma similar a como
Django busca por plantillas dentro de polls/templates/.

Finalmente, se actualiza la pestaa en la que se est

tratando la aplicacin

Dentro del directorio que se ha creado, se crea otro

directorio llamado polls y dentro del mismo un archivo
llamado style.css. En otras palabras, la hoja de datos
de estilos estara en polls/static/polls/style.css.
Fig. 36. Creacin del archivo styles.css.

Fig. 39. http://localhost:8000/polls/.

UNIVERSIDAD INDUSTRIAL DE SANTANDER

Escuela de Ingenieras Elctrica, Electrnica y de Telecomunicaciones
(E3T)

Perfecta Combinacin entre Energa e Intelecto

IV. CONCLUSIONES

V. BIBLIOGRAFA

1. Durante todo el desarrollo del tutorial, se debe

tener cuidado con la ortografa y escribir los
comando adecuadamente, de lo contrario, se
puede generar un error, y en el peor de los casos,
puede haber daos considerables en la base de
datos.
Fig. 40. Digitacin de maage.py en lugar de manage.py

1.
2.
3.
4.
5.
6.
7.

https://docs.djangoproject.com/en/1.8/intro/
http://docs.python.org.ar/tutorial/django/
https://en.wikipedia.org/wiki/Foreign_key
https://es.wikipedia.org/wiki/Framework
https://images.google.com/
http://www.djangobook.com/en/2.0/index.html
http://www.ieee.org

2. Cuando se modifica un documento en formato

.py, hay que guardarlo para que se realicen los
cambios en la base de datos, de lo contrario, al
actualizar la pgina del explorador, se ver un
error al actualizar, o simplemente no mostrar las
modificaciones.
Fig.
41.
Error
al
no
guardar
(127.0.0.1.8000/admin/polls/question/1change/)

los

cambios.

10