Documentos de Académico
Documentos de Profesional
Documentos de Cultura
Utilización de Plantillas Con Struts
Utilización de Plantillas Con Struts
GUIA DE LABORATORIO #7
Nombre de la
UTILIZACIN DE PLANTILLAS
Practica:
Lugar de
CENTRO DE COMPUTO
Ejecucin:
Tiempo Estimado: 3 HORAS CLASE
MATERIA:
DOCENTE:
Que el alumno
Las plantillas o tiles, como habitualmente se les conoce en Struts, fueron incorporados al ncleo de la
especificacin a partir de la versin 1.1.
Su objetivo no es otro que posibilitar la reutilizacin de cdigo HTML/JSP durante el desarrollo de la vista
en una aplicacin Web MVC, simplificando el desarrollo de las pginas y haciendo tambin ms cmodos y
menos propensos a errores los posibles cambios que se puedan realizar a posteriori sobre esta capa de la
aplicacin.
La utilizacin de plantillas resulta adecuada por tanto en aquellas aplicaciones Web en las que tenemos un
grupo de pginas con estructura similar, en las que el contenido de ciertas partes de las mismas es igual en
todas ellas.
Encabezado de pginas
Men superior
Men lateral
Cuerpo de pginas
Pie de pginas
Figura 1: Clsico tipo de pginas para utilizacin de plantillas
Este es el caso de las pginas que suelen tener la tpica estructura que se muestra en la figura anterior, donde
la zona de encabezado, pie y men suele ser idntica para un cierto grupo de pginas de la aplicacin,
cambiando slo el cuerpo de una a otro.
Configuracin de la aplicacin para el uso de plantillas
Para poder utilizar plantillas en una aplicacin Struts es necesario realizar dos operaciones previas en el
archivo de configuracin struts.config.xml.
La primera de ellas consiste en indicar al controlador de struts que debe utilizar un objeto RequestProcessor a
partir de una clase diseada explcitamente para el uso de plantillas, como es el caso de las clase
La segunda de las operaciones previas ser la activacin del plug-in tiles encargado de gestionar las
plantillas. Para ello aadiremos la siguiente entada en struts-config.xml:
<plug-in className="org.apache.struts.tiles.TilesPlugin" >
<set-property property="definitions-config" value="/WEB-INF/tiles-defs.xml" />
<set-property property="moduleAware" value="true" />
</plug-in>
III. PROCEDIMIENTO
Pasos previos
Paso 1
Crear un proyecto web dinmico llamado Guia7Poo2
Paso 2
Agregar las lineas para la activacin de Tiles en el archivo struts-config.xml, estas debern estar
ubicadas despus del elemento </action-mappins>, estas se presentan a continuacin.
<controller processorClass="org.apache.struts.tiles.TilesRequestProcessor"/>
<message-resources parameter="sv.edu.udb.resources.AplicationResource"/>
<plug-in className="org.apache.struts.tiles.TilesPlugin" >
<set-property property="definitions-config" value="/WEB-INF/tiles-defs.xml" />
<set-property property="moduleAware" value="true" />
</plug-in>
Paso 3
Agregar todas las libreras del proyecto Guia6Poo2 a Guia7Poo2.
Paso 4
Crear las carpetas css, js, img, images, mod_categorias, mod_productos.
2
insert: Esta accin tiene diversos usos como iremos viendo a lo largo del captulo. En las
pginas maestras se utiliza para indicar la existencia de una seccin de contenido, seccin a
al que se le asignar un nombre mediante el atributo atribute de la accin. El siguiente
ejemplo define una seccin de contenido llamada header, situada dentro de una etiqueta
<div>:
<div><tiles:insert attribute="header"/></div>
Durante la creacin de las pginas de la aplicacin estas secciones sern sustituidas por el
contenido definido en determinados ficheros externos, habitualmente pginas JSP.
getAsString: Define una seccin de texto, utilizando el atributo name para asignar el
nombre de la seccin:
<h1><tiles:getAsString name="titulo"/></h1>
Como sucede con <tiles:insert>, ser durante la creacin de la pgina de aplicacin cuando esta
accin sea sustituida por un texto real.
Nuestro primer ejemplo completo servir para aclarar conceptos.
Imagnese que se quiere crear una aplicacin con dos pginas cuyo aspecto se muestra en las
siguientes figuras.
Como se puede observar, ambas pginas estn organizadas en cuatro zonas: un texto en la parte
superior, que es distinto para cada pgina, un encabezado, un men en el lateral izquierdo, ambos
idnticos en las dos pginas, y un cuerpo que ocupa la parte central de la pgina y que tambin
estar personalizado para cada una de ellas, para obtener el resultado deseado seguir los siguientes
pasos.
Paso 1
Crear la plantilla que define la organizacin anterior, para ello crear una carpeta dentro de WEBINF una carpeta llamada platillas y crear dentro de ella una pagina jsp llamada plantilla.jsp, y
agregar el siguiente cdigo.
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%@ taglib uri="http://struts.apache.org/tags-tiles" prefix="tiles" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title><tiles:getAsString name="titulo"/></title>
</head>
<body>
<center>
<h1><tiles:getAsString name="titulo"/></h1>
</center>
<table width="90%">
<tr>
<td
height="25%" colspan="2">
<tiles:insert attribute="encabezado"/>
</td>
</tr>
<tr>
<td>
<tiles:insert attribute="menu"/>
</td>
<td>
<tiles:insert attribute="cuerpo"/>
</td>
</tr>
</table>
</body>
</html>
titulo.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<div align="center" style="background-color:aqua">
<h1>Aplicacin de ejemplo</h1>
</div>
menu.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<table>
<tr>
<td>
<a href="">Opcion 1</a><br>
</td>
</tr>
<tr>
<td>
<a href="">Opcion 2</a><br>
</td>
</tr>
<tr>
<td>
<a href="">Opcion 3</a><br>
</td>
</tr>
<tr>
<td>
<a href="">Opcion 4</a><br>
</td>
</tr>
</table>
body1.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<h1>Contenido Primero</h1>
<h3>Este es el cuerpo de la pagina 1</h3>
body2.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<h1>Contenido segundo</h1>
<h3>Este es el cuerpo de la pagina 2</h3>
ejemplo, suponiendo que la plantilla se encuentra, definida en un archivo llamado base.jsp que est
situado en el directorio WEB-INF, la declaracin de la plantilla en la pgina de aplicacin sera:
<tiles:insert page="/WEB-INF/base.jsp">
<!--Aqu referencias a pginas de contenido-->
</tiles:insert>
pagina2.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%@ taglib uri="http://struts.apache.org/tags-tiles" prefix="tiles" %>
<tiles:insert page="/WEB-INF/plantillas/plantilla.jsp">
<tiles:put name="titulo" value="Pagina 2"/>
<tiles:put name="encabezado" value="/WEB-INF/plantillas/titulo.jsp"/>
<tiles:put name="menu" value="/WEB-INF/plantillas/menu.jsp"/>
<tiles:put name="cuerpo" value="/WEB-INF/plantillas/body2.jsp"/>
</tiles:insert>
Paso 4
Si corremos cada una de las dos paginas anteriores el resultado debe ser similar al de las imgenes
mostradas en la Figura 2.
6
Definiciones
El mecanismo de utilizacin de plantillas que se acaba de analizar nos permite reutilizar cdigo en
las aplicaciones, adems de proporcionarnos gran flexibilidad a la hora de crear las pginas finales
de la aplicacin. Sin embargo es en la creacin de estas pginas finales donde observamos tambin
la aparicin de numerosos elementos repetitivos, por ejemplo, en el cdigo de las pginas anteriores
vemos como el elemento <tiles:put> utilizado en la definicin de las zonas de encabezado y men
idnticos en ambas pginas.
Otro defecto que presenta el sistema anterior es el hecho de que cualquier cambio en la ubicacin de
alguno de estos archivos de contenido implicar tener que actualizar todas las pginas de la
aplicacin donde se haga referencia a stos, lo que puede resultar en una importe fuente de errores.
La solucin que propone Struts para estos problemas consiste en la utilizacin de definiciones. Una
definicin, como su nombre indica, define una manera de distribuir las piezas de contenido en una
plantilla, de modo que a la hora de crear una definicin con contenido similar a otra ya existente no
sea necesario volver a definir de nuevo los mismos elementos ya establecidos en la anterior
definicin, sino que bastar con que la nueva definicin herede a la primera y redefina
nicamente aquellas zonas cuyo contenido es diferente al indicado en la definicin padre.
Creacin de una definicin
Antes de crear una definicin debemos disponer de una plantilla y una serie de pginas de
contenido. El desarrollo de estos elementos se lleva a cabo tal y como explicamos en la seccin
anterior.
En cuanto a las definiciones, stas se crean en nuevo archivo de configuracin llamado
tiles-defs.xml, cuya ubicacin deber estar indicada en el elemento <plug-in> definido en
struts-config.xml, tal y como se indic al comienzo de esta gua. Lo habitual es que tiles-defs.xml
se site en el directorio WEB-INF de la aplicacin.
Nota: Este archivo de tiles-defs.xml sera proporcionado por el docente.
Definiciones base
Una definicin base es aquella que define explcitamente la distribucin de los contenidos de cada
zona indicada en la plantilla, sin heredar de ninguna otra definicin existente.
En este tipo de definicin habr que especificar los siguientes atributos del elemento <definition>:
path: URL relativa de la pgina maestra que contiene la plantilla a partir de la que se va a
crear la definicin.
Para indicar el contenido de cada zona se utilizar el sub-elemento <put> de <definition>, el cual
dispone a su vez de los atributos:
value: En el caso de las zonas definidas con <tiles:insert> este atributo indicar la URL
relativa de la pgina de contenido, mientras que para las zonas <tiles:getAsString>
contendr la cadena de texto equivalente.
Definiciones derivadas
A la hora de crear una definicin derivada de otra debemos especificar en el atributo extends del
elemento <definition> el nombre de la definicin base. De esta manera, el elemento heredar todas
las definiciones <put> especificadas en el <definition> padre. Si queremos redefinir el contenido de
cualquiera de las zonas utilizaremos nuevamente el elemento <put>
A continuacin se presentaran los pasos necesarios para arreglar los inconvenientes de los puntos
anteriores, para esto realizar los siguiente:
Paso 1
Ir al archivo tiles-defs.xml y agregar las siguientes definiciones, dentro de los elementos
<tiles-definitions> </tiles-definitions> tal y como se muestra a continuacin.
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE tiles-definitions PUBLIC
"-//Apache Software Foundation//DTD Tiles Configuration 1.1//EN"
"http://jakarta.apache.org/struts/dtds/tiles-config_1_1.dtd">
<!--->
<tiles-definitions>
<definition name="principal" path="/WEB-INF/plantillas/plantilla.jsp">
<put name="titulo" value=""/>
<put name="encabezado" value="/WEB-INF/plantillas/titulo.jsp"/>
<put name="menu" value="/WEB-INF/plantillas/menu.jsp"/>
<put name="cuerpo" value=""/>
</definition>
<definition name="parapagina1" extends="principal">
<put name="titulo" value="Pagina 1"/>
<put name="cuerpo" value="/WEB-INF/plantillas/body1.jsp"/>
</definition>
<definition name="parapagina2" extends="principal">
<put name="titulo" value="Pagina 2"/>
<put name="cuerpo" value="/WEB-INF/plantillas/body2.jsp"/>
</definition>
pagina1.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%@ taglib uri="http://struts.apache.org/tags-tiles" prefix="tiles" %>
<tiles:insert definition="parapagina2" />
Paso3
Correr las paginas anteriores y debe ver un resultado como el mostrado en la Figura 2.
Aplicacin practica apoyndonos de lo realizado en la gua 6.
En esta parte utilizaremos lo realizado en la gui practica numero 6, es por ello que en los pasos
previos se le dice que debe de copiar todos los paquetes que manejen la lgica de negocio, para
completar el funcionamiento total de la aplicacin, seguir los pasos siguientes.
Paso 1
Copiar dentro de la carpeta css las hojas de estilo brindada por el docente.
Copiar dentro de la carpeta images las imagines proporcionadas por el docente.
Copiar dentro de la carpeta img las imgenes de de la carpeta img de la gui 6.
Copiar dentro de la carpeta js los javascript proporcionados en la gui 6.
Paso 2
Crear dentro del WEB-INF en la carpeta plantillas una pagina JSP llamada plantillamsj.jsp y
agregar el siguiente cdigo.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<%@ taglib uri="http://struts.apache.org/tags-tiles" prefix="tiles" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Splendid by Free CSS Templates</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href="css/style.css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>
<div id="wrapper">
<div id="logo">
<h1><a href="#">Aplicacin Web</a></h1>
<p><em>Para el manejo de productos</em></p>
</div>
<hr />
<!-- end #logo -->
<div id="header">
<div id="menu">
<ul>
<tiles:insert attribute="menumsj"/>
</ul>
</div>
<!-- end #menu -->
</div>
<!-- end #header -->
<!-- end #header-wrapper -->
<div id="page">
<div id="page-bgtop">
<div id="content">
<div class="post">
<h2 class="title"><tiles:getAsString
name="titulo"/></h2>
<div class="entry">
<tiles:insert attribute="bodymsj"/>
</div>
</div>
</div>
<!-- end #content -->
<div id="sidebar">
<ul>
<li>
<h2>Opciones de Mensaje </h2>
<ul>
<tiles:insert attribute="menumsj"/>
</ul>
</li>
</ul>
</div>
<!-- end #sidebar -->
<div style="clear: both;"> </div>
</div>
</div>
<!-- end #page -->
<div id="footer">
<p>Visita <a href="http://www.udb.edu.sv/">la pagina de la
Universidad Don Bosco</a>.</p>
</div>
<!-- end #footer -->
</div>
</body>
</html>
Paso 3
Crear dentro del WEB-INF en la carpeta plantillas una pagina JSP llamada menusmsj.jsp y
agregar el siguiente cdigo.
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%@ include file="/top-tags.jsp"%>
<li><html:link href="productos.do?method=llenar">Productos</html:link></li>
<li><html:link forward="formcategoria">Categorias</html:link></li>
Paso 4
Crear dentro del WEB-INF en la carpeta plantillas una pagina JSP llamada bodymsj.jsp y
agregar el siguiente cdigo.
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
Este es el cuerpo del mensaje
Paso 5
Como siguiente punto agregaremos las nuevas definiciones al archivo tiles-defs.xml, estas
quedaran como se muestran a continuacin.
<definition name="principalmsj" path="/WEB-INF/plantillas/plantillamsj.jsp">
<put name="titulo" value=""/>
10
Paso 6
Como se esta haciendo uso de lo realizado en la practica 6 deberemos de agregar los
<action-mappings> al archivo struts-config.xml, para simplificar se le presentan toda la
configuracin del archivo struts-config.xml.
<?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE struts-config PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 1.3//EN"
"http://struts.apache.org/dtds/struts-config_1_3.dtd">
<struts-config>
<form-beans>
<form-bean name="CategoriaForm" type="sv.edu.udb.form.CategoriaForm" />
<form-bean name="ProductosForm" type="sv.edu.udb.form.ProductosForm" />
</form-beans>
<global-exceptions>
</global-exceptions>
<global-forwards>
<forward name="formcategoria" path="/categorias.do"/>
<forward name="menu" path="../Menu.jsp"/>
<forward name="menu1" path="/Menu.jsp"/>
</global-forwards>
<action-mappings>
<action name="CategoriaForm"
path="/Categoria" parameter="method" scope="request"
type="sv.edu.udb.action.CategoriaAction">
<forward name="inicio" path="categorias"/>
</action>
<action name="ProductosForm"
path="/productos" parameter="method" scope="request"
type="sv.edu.udb.action.CargarCombosAction">
<forward name="ingresado" path="productos"/>
</action>
<action path="/categorias" forward="categorias"/>
</action-mappings>
<controller
processorClass="org.apache.struts.tiles.TilesRequestProcessor"/>
11
<message-resources parameter="sv.edu.udb.resources.AplicationResource"/>
<plug-in className="org.apache.struts.tiles.TilesPlugin" >
<set-property property="definitions-config" value="/WEB-INF/tilesdefs.xml" />
<set-property property="moduleAware" value="true" />
</plug-in>
</struts-config>
Paso 7
Dentro de la carpeta mod_categorias copiaremos la pgina JSP FormCat.jsp, esta deber tener
unos cambios directamente en el javascript, a continuacin se le presenta esta pagina con los
cambios realizados.
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%@ include file="/top-tags.jsp"%>
<html:html>
<head>
<title>Categoria</title>
<script type="text/javascript" language="JavaScript">
function nuevo(){
document.CategoriaForm.method.value ="agregar";
document.CategoriaForm.submit();
}
function update(){
document.CategoriaForm.method.value ="actualizar";
document.CategoriaForm.submit();
}
function remove(){
document.CategoriaForm.method.value ="eliminar";
document.CategoriaForm.submit();
}
function show(){
document.CategoriaForm.method.value ="mostrar";
document.CategoriaForm.submit();
}
</script>
<script type="text/javascript">
function rafa(){
alert("rafa");
}
</script>
</head>
<body>
<center>
12
<tr>
<td colspan="2">
<html:button property="ingresar"
onclick="nuevo()"><bean:message key="label.agregar"/></html:button>
<html:button property="actualizar"
onclick="update()"><bean:message key="label.actualizar"/></html:button>
<html:button property="eliminar" ><bean:message
key="label.eliminar"/></html:button>
<html:button property="mostrar"
onclick="show()"><bean:message key="label.mostrar"/></html:button>
<html:hidden property="method" value=""/>
</td>
</tr>
</table>
</html:form>
<logic:present name="mensaje">
<logic:equal name="mensaje" value="Exito">
<bean:message key="label.insert"/>
</logic:equal>
<logic:equal name="mensaje" value="Fracaso">
<font color="red">
<bean:message key="error.insert"/>
</font>
</logic:equal>
</logic:present>
<logic:present name="update">
<logic:equal name="update" value="Exito">
<bean:message key="label.update"/>
</logic:equal>
<logic:equal name="update" value="Fracaso">
<font color="red">
<bean:message key="error.update"/>
</font>
</logic:equal>
</logic:present>
<logic:present name="delete">
<logic:equal name="delete" value="Exito">
<bean:message key="label.delete"/>
</logic:equal>
<logic:equal name="delete" value="Fracaso">
<font color="red">
<bean:message key="error.delete"/>
</font>
</logic:equal>
</logic:present>
</center>
<center>
<logic:present name="categoria">
<display:table name="categoria" pagesize="3" requestURI="/Categoria.do?
method=display">
<display:column property="codigo" title="Codigo" sortable="true" />
<display:column property="nombre" title="Categoria"/>
</display:table>
</logic:present>
</center>
</body>
</html:html>
13
Paso 8
Dentro de la carpeta mod_productos copiaremos la pgina JSP FormProductos.jsp, esta deber
tener unos cambios directamente en el javascript, a continuacin se le presenta esta pagina con los
cambios realizados.
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%@ include file="/top-tags.jsp"%>
<script type="text/javascript" language="JavaScript">
function nuevo(){
document.ProductosForm.method.value ="agregar";
document.ProductosForm.submit();
}
function update(){
document.ProductosForm.method.value ="actualizar";
document.ProductosForm.submit();
}
function remove(){
document.ProductosForm.method.value ="eliminar";
document.ProductosForm.submit();
}
function show(){
document.ProductosForm.method.value ="mostrar";
document.ProductosForm.submit();
}
</script>
<html:form action="/productos" method="get">
<center>
<table>
<tr>
<td>Codigo: </td>
<td><html:text property="codigo"/></td>
</tr>
<tr>
<td>Nombre del Producto: </td>
<td><html:text property="nombreproducto"/></td>
</tr>
<tr>
<td>Precio: </td>
<td><html:text property="precio"/></td>
</tr>
<tr>
<td>Proveedor: </td>
<td>
<logic:present name="proveedor">
<html:select property="provee" >
<html:options collection="proveedor" property="codigo"
labelProperty="nombre" />
</html:select>
</logic:present>
</td>
</tr>
<tr>
<td>Categoria: </td>
<td>
<logic:present name="categoria">
<html:select property="cat" styleClass="textBox">
14
15
CargarCombosAction
public ActionForward mostrar(ActionMapping mapping,
ActionForm form,
HttpServletRequest request,
HttpServletResponse response)
throws Exception {
LlenarCombos llenar=new LlenarCombos();
ArrayList<ProductosForm> listaproductos=llenar.mostrarProductos();
request.setAttribute("productos",listaproductos);
ArrayList<CategoriaBean>
listacategoria=llenar.llenearComboCategoria();
request.setAttribute("categoria", listacategoria);
ArrayList<ProveedorBean>
listaproveedor=llenar.llenearComboProveedor();
request.setAttribute("proveedor", listaproveedor);
System.out.println("LLegue hasta mostrar");
return mapping.findForward("ingresado");
}
public ActionForward display(ActionMapping mapping,
ActionForm form,
HttpServletRequest request,
HttpServletResponse response)
throws Exception {
return mapping.findForward("ingresado");
}
Paso 10
Crear una pagina JSP llamada pagina1msj.jsp esta implementara la aplicacin de la plantilla,
agregar el siguiente cdigo.
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%@ taglib uri="http://struts.apache.org/tags-tiles" prefix="tiles" %>
<tiles:insert definition="principalmsj" />
16
Paso 11
Correr la pagina anterior y vera un resultado como el que se muestra a continuacin.
Si da click en cada uno de los link podr ver los resultados tal y como se muestra en las siguientes
imgenes:
17
Crear una plantilla que sera utilizada para su proyecto y en ella reflejar las diferentes opciones que
este contiee, como grupo deberan repartirse las opciones para que cada uno haga una parte del
proyecto. El proyecto no es necesariamente funcional es nada ms las vista de este.
V. REFERENCIA BIBLIOGRAFICA
18