7/24/2019 Trabajo Practico MVC

1/3

Universidad Abierta InteramericanaModelo Computacionales - MCGA

Trabajo practico Modelo Computacionales

Desarrollo de una aplicacin web siguiendo el patrn MVC

Vamos a construir una aplicacin web para elaborar y consultar un repositorio de alimentos con

datos acerca de sus propiedades dietticas. Utilizaremos una base de datos para almacenar dichos

datos que consistir en una sola tabla con la siguiente informacin sobre alimentos:

El nombre del alimento,

La energa en kilocaloras,

La cantidad de protenas,

La cantidad hidratos de carbono en gramos

La cantidad de fibra en gramos y

La cantidad de grasa en gramos,

Todo ello por cada 100 gramos de alimento.

Aunque se trata de una aplicacin muy sencilla, cuenta con los elementos suficientes para trabajar

el aspecto que realmente pretendemos estudiar en esta unidad: la organizacin del cdigo

siguiendo las directrices del patrn MVC. Comprobaremos como esta estrategia nos ayuda a mejorar

las posibilidades de crecimiento (escalabilidad) y el mantenimiento de las aplicaciones que

desarrollamos.

URLS

URL Accin

http://servidor/alimentos/Index Mostrar pantalla inicio

http://servidor/alimentos/Listar Listar alimentos

http://servidor/alimentos/Create Insertar un alimento

http://servidor/alimentos/buscar Buscar alimentos

http://servidor/alimentos/Ver/id Ver el alimento x

NOTA

Aplique los conceptos de arquitectura vistos en campo y diploma, adems de las nociones de

accesibilidad y usabilidad advertidos en clases anteriores.

http://servidor/alimentos/$vista?ctl=iniciohttp://servidor/alimentos/Listarhttp://servidor/alimentos/Listarhttp://servidor/alimentos/Createhttp://servidor/alimentos/Createhttp://servidor/alimentos/buscarhttp://servidor/alimentos/buscarhttp://servidor/alimentos/Ver/idhttp://servidor/alimentos/Ver/idhttp://servidor/alimentos/Ver/idhttp://servidor/alimentos/buscarhttp://servidor/alimentos/Createhttp://servidor/alimentos/Listarhttp://servidor/alimentos/$vista?ctl=inicio

7/24/2019 Trabajo Practico MVC

2/3

Parte 2 - Extendido

Ejercicio 1.

Aade al men una opcin para mostrar un listado con todos los alimentos con enlaces a los

artculos correspondientes de la Wikipedia y construye dicha funcionalidad.

ConsejoLos artculos de la Wikipedia presentan la siguiente URL:

http://es.wikipedia.org/wiki/{trmino}, teniendo en cuenta tildes, de manera que el artculo

correspondiente a la fruta meln ser: http://es.wikipedia.org/wiki/ meln, puedes construir una

tabla con dos columnas, en la primera muestras el nombre del alimento y en la segunda el enlace a

la Wikipedia.

Ejercicio 2

Enriquece los enlaces del ejercicio anterior con ventanas modales.

Consejo Las interfaces HTML de las aplicaciones web pueden enriquecerse gracias al uso de

JavaScript en la parte del cliente. En este ejercicio se propone que convierta los enlaces del ejercicio

anterior de manera que cuando haga clic en ellos el vnculo aparezca en una ventana situada encima

de la pgina que muestra los enlaces, es decir, en una ventana modal. Esto se consigue utilizando

JavaScript. Vamos a proyectar una posible solucin que te ayude a realizar el ejercicio:

Descarga las siguientes libreras JavaScript:

Jquery,

colorbox, http://colorpowered.com/colorbox/colorbox.zip

El siguiente cdigo convierte todos los enlaces cuya clase (atributo class del elemento HTML) sea

winmodal:

$(document).ready(function(){$(". winmodal ").colorbox();

});

Para que dicho ejemplo funcione, el documento HTML debe incluir las libreras de Jquery y

colorbox.js (en ese orden). Adems, si quieres ver bien la ventana modal, debes incluir la hoja de

estilo colorbox.css que viene tambin en el archivo colorbox.zip. Si quieres ms ayuda mira el cdigo

HTML de esta direccin:

http://colorpowered.com/colorbox/core/example1/index.html

Tu tarea consiste en ubicar en los lugares que correspondan las libreras y el cdigo anterior paraque los enlaces a los artculos de la Wikipedia del ejercicio anterior se vean en una ventana modal.

http://colorpowered.com/colorbox/core/example1/index.htmlhttp://colorpowered.com/colorbox/core/example1/index.htmlhttp://colorpowered.com/colorbox/core/example1/index.html

7/24/2019 Trabajo Practico MVC

3/3

Ejercicio 3

Agrega al listado de alimentos del ejercicio 1 una columna ms donde ubicars un enlace que

proporcione un archivo Excel con los datos del alimento.

Consejo Un posible formato para el archivo Excel que esta funcionalidad debe entregar como

respuesta puede ser (Los datos dietticos No son reales):

Nombre= Meln

Energa=100

protenas=150

hc=45

fibra=24

grasa= 10