Tutorial 4
Aplicaciones Web con NetBeans 5.0
Creación de un Proyecto
Para crear un programa de consola en Java utilizando NetBeans 5.0 lo primero que
hay que hacer es crear un proyecto. Un proyecto nos permite administrar los archivos
con el código fuente y compilado de una aplicación. Para crear un proyecto se sigue el
siguiente procedimiento:
1. Ejecute el programa NetBeans 5.0. Al hacerlo aparecerá la ventana principal del
programa como se ilustra en la figura 4.1.
Figura 4.1
2. Del menú principal de NetBeans 5.0, figura 1.1, seleccione la opción File/New
Project … , presione las teclas Ctrl+Mayúsculas+N o haga clic en el icono New
Project mostrado en la figura 4.2.
ITSON
Manuel Domitsu Kono
54
Aplicaciones Web con NetBeans 5.0
Figura 4.2
3. Aparecerá el primer cuadro del asistente para crear un nuevo proyecto, figura
4.3.
Figura 4.3
4. En este cuadro del asistente seleccionaremos el tipo de proyecto que deseamos
crear. Como vamos a crear una aplicación Web, seleccionaremos la opción Web
en el recuadro Categories: y la opción Web Application en el recuadro
Projets:, y luego presionaremos el botón Next>.
5. Aparecerá el segundo del asistente para crear proyectos, mostrada en la figura
4.4. En este cuadro seleccionaremos el nombre y la ubicación del proyecto.
ITSON
Manuel Domitsu Kono
Tutorial 2
Aplicaciones Web con NetBeans 5.0
55
Figura 4.4
a) Establezca el nombre del proyecto (Project Name): Por ejemplo,
“amanteMusicaWeb”.
b) Establezca el directorio donde se almacenará el proyecto (Projet Location).
Por ausencia en Windows 2000 y XP, el directorio es el directorio inicial del
usuario: “C:\Documents and Settings\usuario”. En este ejemplo, el proyecto
se ubicó en: “C:\Documents and Settings\mdomitsu\Mis
documentos\nbproject”. En la línea siguiente puede verse la ubicación del
directorio en el que se almacenarán los archivos del proyecto: Project
Location, que es el directorio con el nombre del proyecto dentro del
directorio donde se ubica el proyecto. En este ejemplo es: “C:\Documents
and Settings\mdomitsu\Mis documentos\nbproject\amanteMusicaWeb”.
c) Seleccione en la caja combinada: Source Structure: (estructura del código
d) Seleccione en la caja combinada: Server: (Servidor:)la opción Sun Java
fuente:) la opción Jakarta.
System Application Server.
e) Seleccione en la caja combinada: J2EE Version: la opción J2EE 1.4.
f) Asegúrese que las casillas de selección: Set Source Level to 1.4
(Establezca el nivel del código fuente a la versión 1.4) y Set as Main Project
(Haga que este proyecto sea el proyecto principal) estén seleccionadas.
g) Presione el botón Next>.
6. Aparecerá el tercer cuadro del asistente para crear proyectos, figura 4.5. Este
cuadro nos permite establecer si nuestra aplicación Web usará el marco de Java
ITSON
Manuel Domitsu Kono
Aplicaciones Web con NetBeans 5.0
Server Faces 1.1 o Struts 1.2.7. Como no se utilizará ninguno, presione el botón
Finish.
Figura 4.5
7. Desaparecerá el asistente para crear un nuevo proyecto y aparecerá lo
mostrado en la figura 4.6. Del lado derecho aparece el editor de NetBeans con el
esqueleto de la página JSP principal: index.jsp, mientras que del lado izquierdo
aparece el árbol de los proyectos, en el que aparece el proyecto
amanteMusicaWeb.
8. Si en el recuadro del árbol de los proyectos hacemos clic en la pestaña Files,
aparecerá un árbol con todos los archivos de los proyectos, figura 4.7. Otra vez,
en este momento sólo aparecen los archivos del proyecto amanteMusicaWeb.
56
ITSON
Manuel Domitsu Kono
Tutorial 2
Aplicaciones Web con NetBeans 5.0
57
Figura 4.6
9. Edite el archivo index.jsp para que su código sea el siguiente:
Figura 4.7
index.jsp
<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
ITSON
Manuel Domitsu Kono
58
Aplicaciones Web con NetBeans 5.0
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Amante Música</title>
</head>
<body>
<h1 align="center">Amante Música</h1>
<div align="center">
Selecciona la tarea deseada
<%-- Formulario para seleccionar y enviar la tarea deseada.
La tarea seleccionada se envía a la página control.jsp --%>
<br>
<br>
<form action="control.jsp" method="post">
<%-- Menú desplegable --%>
<select name="tarea">
<option value="tarea1" selected>Agregar una canción</option>
<option value="tarea2">Eliminar una canción</option>
<option value="tarea3">Listar todas las canciones</option>
</select>
<%-- Botón enviar --%>
<input type="submit" name="enviar" value="Continuar">
</form>
</div>
</body>
</html>
10. Guarde la página JSP seleccionando del menú principal la opción File/Save,
presione las teclas Ctrl+S o haga clic en el icono Save All, mostrado en la figura
4.8.
Figura 4.8
ITSON
Manuel Domitsu Kono
Tutorial 2
Aplicaciones Web con NetBeans 5.0
59
Ubicación de los Archivos de una
Aplicación Web
La figura 4.9, muestra los directorios y archivos generados al crear el proyecto. El
proyecto se guarda en una carpeta con el nombre del proyecto, amanteMusicaWeb en
este caso. Las páginas JSP se almacenan en un directorio llamado web, dentro del
directorio del proyecto.
Figura 4.9
Por otro lado si se crean clases, el directorio raíz de su estructura de paquetes será
directorio scr.
Creación de una Página JSP
Para crear una página JSP se sigue el siguiente procedimiento:
1. Del menú principal de NetBeans 5.0, figura 4.1, seleccione la opción Files/New
File, presione las teclas Ctrl+ N o haga clic en el icono New File, como se
muestra en la figura 4.10:
Figura 4.10
2. Aparecerá la primera ventana del asistente para crear un nuevo archivo, figura
4.11. En esta ventana del asistente seleccionaremos el tipo de archivo que
deseamos crear. Seleccionaremos la opción Web en el recuadro Categories: y
ITSON
Manuel Domitsu Kono
Aplicaciones Web con NetBeans 5.0
la opción JSP en el recuadro File Types:, y luego presionaremos el botón
Next>.
Figura 4.11
3. Aparecerá la segunda ventana del asistente para crear un archivo, mostrada en
la figura 4.12. En esta ventana seleccionaremos el nombre y la ubicación de la
página JSP.
a) Establezca el nombre de la clase (JSP File Name): Por ejemplo, “control”.
b) Deje el resto de los campos a sus valores prestablecidos.
c) Presione el botón Finish.
4. Desaparecerá el asistente para crear un nuevo archivo y aparecerá el esqueleto
de la página JSP creada.
5. Edite el archivo control.jsp para que su código sea el mostrado en la página
siguiente:
6. Guarde la página JSP.
60
ITSON
Manuel Domitsu Kono
Tutorial 2
Aplicaciones Web con NetBeans 5.0
61
Figura 4.12
control.jsp
<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<%
// Obten el número de la tarea seleccionada en index.jsp
int opcion =
Integer.parseInt(request.getParameter("tarea").substring(5));
switch(opcion) {
// Si la tarea seleccionada es la 1 o 2
case 1:
case 2:
%>
<%-- Carga la página capturaClave.jsp para capturar la
clave de la canción a agregar o borrar --%>
<jsp:forward page="capturaClave.jsp"/>
<%
ITSON
Manuel Domitsu Kono
62
Aplicaciones Web con NetBeans 5.0
// Si la tarea seleccionada es la 3
case 3:
%>
desplegar todas las canciones --%>
<%
}
%>
</body>
</html>
<%-- Carga la página consultaCancionesTodas.jsp para
<jsp:forward page="consultaCancionesTodas.jsp"/>
Edición de Múltiples Páginas JSP
Podemos editar más de una clase o página JSP en la ventana de edición, cada una en
su propio panel, como se muestra en la figura 4.13 en la que tenemos en la ventana de
edición de NetBeans dos páginas JSP: index.jsp y control.jsp. Las pestañas en la parte
superior nos permiten seleccionar la clase o página JSP que se desea editar.
Podemos eliminar una clase o página JSP de la ventana de edición, haciendo clic en el
icono con la X que se encuentra en la pestaña de cada clase, figura 4.14.
Figura 4.13
Figura 4.14
Si deseamos agregar una clase o página JSP ya creada a la ventana de edición
podemos hacer clic en su nombre en el árbol de archivos o en el árbol de proyectos
que se encuentran a la izquierda, como se muestra en la figura 4.15.
ITSON
Manuel Domitsu Kono
Tutorial 2
Aplicaciones Web con NetBeans 5.0
63
Figura 4.15
Compilación de una Página JSP
Para compilar la clase que se encuentra en la ventana de edición seleccione del menú
principal la opción Build/Compile “NombreJSP.jsp”. “NombreJSP” es el nombre de
la página JSP a compilar, por ejemplo “index”, figura 4.16. También puede presionar
la tecla F9.
Figura 4.16
Compilación del Proyecto
Para compilar todas las clases y páginas JSP de un proyecto, seleccione del menú
principal la opción Build/Build Main Project, figura 4.17, presione la tecla F11 o
presione el icono Build Main Project, mostrado en la figura 4.18.
ITSON
Manuel Domitsu Kono
64
Aplicaciones Web con NetBeans 5.0
Figura 4.17
Figura 4.
Crear cuenta
Comentarios de: Tutorial 4 - Aplicaciones Web con NetBeans 5 (0)
No hay comentarios