Programación

< > Programación
1
< > Programación
Somos una empresa 100% mexicana, con más de 20 años de experiencia siendo el Centro líder de Capacitación en informática.
Hoy en día, tener las mejores herramientas es sólo una parte del todo lo que signi-
fica que conviene siempre estar en permanente capacitación.
Grupo Eduit ha establecido un programa integrado capaz de identificar y perso-
nalizar las necesidades de los diferentes niveles educativos del país manteniéndose en
cada paso como asesor y colaborador, generando un “programa conforme a sus necesidades”.
Misión
Satisfacer las necesidades de capacitación en tecnologías de informática a través de
programas de entrenamiento de calidad, siendo siempre una empresa a la vanguardia.
Visión
Ser líder de soluciones de capacitación a nivel internacional.
2
< > Programación
1 Contenido
1
Aplicaciones Web 1.1
7
1.1.1 Páginas Web / Formularios Web
7
1.1.2 Controles HTML
7
1.1.3 Controles Web.
9
1.1.4 Componentes de las aplicaciones Web
10
1.1.5 Ciclo de vida de las aplicaciones Web
10
1.1.6 Herramientas de desarrollo
10
1.2
Desarrollo de aplicaciones Web
11
1.2.1 Crear Formas Web
11
1.2.2 Agregar y configurar controles de servidor en Formas Web
16
1.2.3 Trabajar con archivos de código adjunto
21
1.2.4 Manejo de eventos
21
1.2.5 Controles de validación
22
1.2.6 Depuración en aplicaciones web
23
1.3
3
Introducción a ASP.NET
7
Acceso a datos desde aplicaciones web
23
< > Programación
2
1.3.1 Introducción a ADO.NET
23
1.3.2 Controles de acceso a datos
23
1.3.3 Administrar información de la base de datos desde una aplicación web
24
Introducción a PHP
2.1
27
2.1.1 Declaración y uso de variables
28
2.1.2Operadores
29
2.1.3 Estructuras de control
32
2.1.4Arreglos
37
2.1.5Funciones
38
2.1.6 Incluir funciones en un script
39
2.2
Librerías de PHP
40
2.2.1 Funciones para trabajar con arreglos
40
2.2.2 Funciones para trabajar con cadenas
41
2.2.3 Funciones para trabajar con fecha y hora
42
2.3
4
Sintaxis Básica de PHP
27
Creación de Formularios con PHP
43
2.3.1 Elementos de un formulario
43
2.3.2 Validación de datos en un formulario
47
< > Programación
3
Desarrollo de Aplicaciones Web para dispositivos móviles
3.1Introducción
3.1.1 Características de las aplicaciones para dispositivos móviles
3.2Formularios Web con emuladores de dispositivos para móviles
49
49
50
3.2.1 Formularios Web para Móviles
50
3.2.2 Redirección y detección de dispositivos móviles
52
3.3
5
49
Desarrollo de aplicaciones Web para dispositivos móviles
53
3.3.1 Consideraciones de diseño
53
3.3.2 Diseño de la interface
54
• Conocer los componentes y el ciclo de vida de las aplicaciones ASP.NET.
• Realizar interfaces Web utilizando los diversos componentes que conforman
una aplicación web ASP.NET.
• Identificar los componentes principales de ADO.NET y como enlazarlos con
aplicaciones web.
< > Programación
1 Aplicaciones Web
1.1 Introducción a ASP.NET
ASP.NET es una tecnología gratuita que permite a los programadores crear páginas web dinámicas, desde
websites personales hasta aplicaciones web empresariales.
1.1.1 Páginas Web / Formularios Web
Las formularios Web son el corazón y el alma de ASP.NET. Las formularios Web son los elementos de interfaz de usuario (UI), que dan a las aplicaciones web de su apariencia. Son similares a los Windows Forms
ya que proporcionan propiedades, métodos y eventos de los controles que se colocan sobre ellos.
Las formularios Web están formados por dos componentes: la parte visual (el archivo ASPX), y el código
detrás de la forma, que reside en un archivo de clase independiente como se observa en al figura 1.1.
Figura 1.1
1.1.2 Controles HTML
Los Controles HTML imitan a los elementos HTML reales que usarías si estuvieras utilizando Front Page o
cualquier otro editor HTML para dibujar la interfaz de usuario. Puedes usar los elementos HTML estándar
en Formularios Web
Por ejemplo, si deseas crear un cuadro de texto, debería escribir:
<input type=”text” id=txtFirstName size=25>
7
< > Programación
Si está utilizando Visual Studio. NET, elije un TextField de control de la caja de herramientas HTML y dibuja el control que desea en la página HTML.
Controles HTML disponibles en ASP.NET
Control
Botón
Botón Restablecer
Botón
Enviar
Campo de texto
Área de texto
Campo de archivo
Campo de contraseña
CheckBox
Radio Botón
Tabla
Imagen
ListBox
8
Descripción
Un botón normal que se puede utilizar
para responder a eventos de Clic
Restablece todos los elementos de formulario a un valor predeterminado
Un botón normal que se puede utilizar
para responder a eventos de Clic
Hace automáticamente un POST de los
datos del formulario a una página especificada
Proporciona al usuario un campo de entrada en un formulario HTML
Se utiliza para la entrada de varias líneas
en un formulario HTML
Coloca un campo de texto y un botón
de búsqueda en un formulario y permite
al usuario seleccionar un archivo de su
máquina
Un área de entrada de un formulario
HTML, todos los caracteres escritos en
este campo se muestran como asteriscos
Proporciona al usuario una casilla de verificación que puede activar o desactivar
Se utiliza dos o más en un formulario,
y permite al usuario elegir uno de los
controles
Permite presentar la información en un
formato de tabla
Muestra una imagen en un formulario
HTML
Muestra una lista de elementos para el
usuario. . Si hay más elementos de los
que caben dentro de este límite, una
barra de desplazamiento se agrega automáticamente a este control.
Ejemplos de Formularios Web
<input type=button runat=server>
<input type=reset runat=server>
<input type=button runat=server>
<input type=submit runat=server>
<input type=text runat=server>
<input type=textarea runat=server>
<input type=file runat=server>
<input type=password runat=server>
<input type=checkbox runat=server>
<input type=radio runat=server>
<table runat=server> </ table>
<img src=”FileName” runat=server>
<seleccionar size=2 runat=server> </ select>
< > Programación
1.1.3 Controles Web.
Los controles de servidor Web ASP.NET son objetos de páginas Web ASP.NET que se ejecutan cuando se
solicita la página y representan el formato en un explorador. Muchos controles de servidor Web son similares a elementos HTML conocidos, como botones y cuadros de texto. Sin embargo, otros controles abarcan un comportamiento complejo, por ejemplo un control de calendario o los controles que administran
conexiones de datos.
Las propiedades que figuran en la siguiente tabla se aplican a todos los controles de servidor Web que se
deriven de la clase WebControl. Los controles de servidor Web que no heredan de la clase WebControl
incluyen Literal, PlaceHolder, Repeater y Xml.
1.1.3.1 Propiedades de controles Web
Propiedad
AccessKey
Attributes
BackColor
BorderColor
BorderWidth
BorderStyle
CssClass
9
Descripción
Tecla de método abreviado del control (AccessKey). Esta propiedad especifica una
sola letra o un solo número que el usuario puede presionar mientras presiona la
tecla ALT. Por ejemplo, especifique “K” si desea que el usuario presione ALT+K para
obtener acceso al control. Las teclas de método abreviado se admiten únicamente
en Microsoft Internet Explorer 4.0 y versiones posteriores.
Colección de atributos adicionales del control no definidos por una propiedad pública pero que también se han de representar. Cualquier atributo no definido por el
control de servidor Web se agrega a esta colección. Esto permite utilizar un atributo
HTML que el control no admite directamente.
Color de fondo del control. La propiedad BackColor se puede establecer mediante
identificadores de color HTML estándar: el nombre de un color (“black” o “red”) o
un valor RGB expresado con formato hexadecimal (“#ffffff”).
Color del borde del control. La propiedad BorderColor se puede establecer mediante identificadores de color HTML estándar: el nombre de un color (“black” o “red”)
o un valor RGB expresado con formato hexadecimal (“#ffffff”).
Ancho, en píxeles, del borde del control si existe.
Estilo del borde del control, si existe. Algunos valores posibles son:
•
•
•
•
•
NotSet
None
Dotted
Solid
Double
Clase de hojas de estilos en cascada (CSS) que se va a asignar al control.
< > Programación
1.1.4 Componentes de las aplicaciones Web
En las páginas Web ASP.NET, la programación de la interfaz de usuario se divide en dos partes: el componente visual y el lógico. Es la división entre la parte visible de una página y el código que se oculta detrás
y que interactúa con ella.
El elemento visual está compuesto por un archivo que contiene el marcado estático como HTML o controles de servidor ASP.NET o ambos. La página Web ASP.NET funciona como un contenedor del texto y los
controles estáticos que se desea mostrar.
La lógica de las páginas Web ASP.NET se compone del código creado para interactuar con la página. El código puede residir en un bloque de script en la página o en una clase independiente. Si el código está en un
archivo de clase independiente, a este archivo se le conoce como archivo de código subyacente. El código
del archivo de código subyacente se puede escribir en Visual Basic, Visual C#, Visual J# o JScript .NET.
Las páginas Web ASP.NET se compilan en un archivo de biblioteca de vínculos dinámicos (.dll). La primera
vez que un usuario examina la página .aspx con el explorador, ASP.NET genera automáticamente un archivo
de clase .NET que representa a la página y la compila.
El archivo .dll se ejecuta en el servidor y genera dinámicamente la salida HTML para su página.
1.1.5 Ciclo de vida de las aplicaciones Web
En aplicaciones web, a diferencia de las tradicionales de escritorio, nos encontramos con una dificultad
adicional a la hora de controlar en ambiente.
Tanto el software como el hardware cliente cambian sin previo aviso. Es fundamental en función de esta
complejidad, encontrar marcos de referencia adecuados.
La existencia de estándares y componentes web estandarizados sin duda ayuda, pero no es suficiente, por
lo que el proceso de adecuación se vuelve continuo.
1.1.6 Herramientas de desarrollo
El Kit de desarrollo de software (SDK) de Windows incluye varias herramientas que puede utilizar al desarrollar sitios Web ASP.NET.
• Herramienta Registro de IIS en ASP.NET (Aspnet_regiis.exe).- Permite que un programa administrador o de instalación actualice las asignaciones de secuencias de comandos de una aplicación
ASP.NET para que señalen a la versión de la ISAPI de ASP.NET asociada a la herramienta. Esta
herramienta también se puede utilizar para mostrar el estado de todas las versiones de ASP. NET
instaladas, registrar la versión de ASP.NET que se corresponde con la herramienta, crear directorios
de secuencias de comandos de cliente y realizar otras operaciones de configuración.
• Complemento MMC para ASP.NET
10
< > Programación
1.1.6.1 Herramienta Registro de IIS en ASP.NET (Aspnet_regiis.exe)
Cuando se ejecutan varias versiones de .NET Framework simultáneamente en un único equipo, la versión
de las API de servidor de Internet (ISAPI) de ASP.NET asignada a una aplicación ASP.NET determina qué
versión de Common Language Runtime (CLR) se utiliza para la aplicación.
La herramienta Registro de IIS en ASP.NET (Aspnet_regiis.exe) permite que un programa administrador o
de instalación pueda actualizar fácilmente las asignaciones de secuencias de comandos de una aplicación
ASP.NET para que señalen la versión de ISAPI (API de servidor de Internet) de ASP.NET asociada a la herramienta. Esta herramienta también se puede utilizar para mostrar el estado de todas las versiones de ASP.
NET instaladas, para registrar la versión de ASP.NET que se corresponde con la herramienta, para crear
directorios de secuencias de comandos de cliente y para realizar otras operaciones de configuración.
1.1.6.2 Complemento MMC para ASP.NET
MMC aloja herramientas administrativas que puede utilizar para administrar equipos, servicios, otros componentes del sistema y redes. Se puede agregar una o varias de estas herramientas administrativas, denominados complementos, a la consola para administrar una aplicación Web.
La herramienta Complemento de ASP.NET para Microsoft Management Console (MMC) proporciona una
interfaz de usuario (UI) única para configurar servidores Web y las aplicaciones que alojan. Incluye varios
cuadros de diálogo que permiten administrar características específicas, como por ejemplo, control de
errores personalizado o autenticación de usuario.
1.2 Desarrollo de aplicaciones Web
1.2.1 Crear Formas Web
1.2.1.1 Para crear un sitio web del sistema de archivos
1. Abra Microsoft Visual Studio o Microsoft Visual Web Developer Express.
2. En el menú Archivo, haga clic en Nuevo sitio Web.
a. Aparecerá el cuadro de diálogo Nuevo sitio web tal y como se muestra en la Figura 1.2:
11
< > Programación
Figura 1.2
3. En Plantillas instaladas, haga clic en Visual Basic o en C# y, a continuación, seleccione Sitio web
ASP.NET.
a. Cuando se crea un proyecto de sitio web, se especifica una plantilla. Cada plantilla crea
un proyecto web que contiene diferentes archivos y carpetas. En este tutorial, creará un
sitio web basado en la plantilla Sitio web ASP.NET, que crea archivos y carpetas que normalmente se usan en sitios web ASP.NET.
4. En el cuadro Ubicación web, seleccione Sistema de archivos y, a continuación, escriba el nombre
de la carpeta en la que desea guardar las páginas del sitio web.
a. Por ejemplo, escriba el nombre de carpeta C:\BasicWebSite.
5. Haga clic en Aceptar.
Visual Studio crea un proyecto web que incluye la funcionalidad preintegrada para el diseño (una página
maestra, las páginas de contenido About.aspx y Default.aspx y una hoja de estilos en cascada), para Ajax
(archivos de script de cliente) y para la autenticación (pertenencia de ASP.NET). Cuando se crea una nueva
página, Visual Web Studio muestra de forma predeterminada la página en la vista Código, donde se pueden
ver los elementos HTML de la página. En la Figura 1.3 se muestra la vista Código fuente de una página web.
12
< > Programación
Figura 1.3
1.2.1.2 Para agregar una página al sitio Web
1. Cierre la página Default.aspx. Para ello, haga clic con el botón secundario en la pestaña que muestra el nombre del archivo y, a continuación, haga clic en Cerrar.
2. En el Explorador de soluciones, haga clic con el botón secundario en el sitio web, (por ejemplo, C:\
BasicWebSite) y, a continuación, haga clic en Agregar nuevo elemento.
Se abrirá el cuadro de diálogo Agregar nuevo elemento. En la figura 1.4 se muestra un ejemplo del cuadro
de diálogo Agregar nuevo elemento:
13
< > Programación
Figura 1.4
3. En la lista de plantillas, seleccione Formulario Web Forms.
4. En el cuadro Nombre, escriba FirstWebPage.
a. Cuando creó el proyecto de sitio web, especificó un lenguaje predeterminado basado en
la plantilla de proyecto que seleccionó. Sin embargo, cada vez que se crea una página o un
componente nuevo para el sitio web, se puede seleccionar el lenguaje de programación
para esa página o componente. Puede utilizar diferentes lenguajes de programación en el
mismo sitio Web.
5. Desactive la casilla Colocar el código en un archivo independiente.
a. A continuación crearemos una página de un sólo archivo con código y HTML en la misma
página. El código para las páginas ASP.NET se puede ubicar en la página o en un archivo de
clase independiente.
6. Haga clic en Agregar.
Visual Studio crea la nueva página y la abre.
14
< > Programación
1.2.1.3 Para agregar texto a la página
1. En la parte inferior de la ventana de documento, haga clic en la ficha Diseño para pasar a la vista
Diseño.
a. La Vista de diseño muestra la página en la que se está trabajando en modo WYSIWYG. En
este momento, no hay texto ni controles en la página, por lo que está en blanco, aparte de
una línea discontinua que forma un rectángulo. Este rectángulo representa un elemento
div en la página.
2. Haga clic en el interior del rectángulo formado por la línea discontinua.
3. Escriba “Welcome to Visual Web Developer” y, a continuación, presione ENTRAR dos veces.
La Figura 1.5 muestra el texto que escribió en la Vista de diseño.
Figura 1.5
4. Cambie a la vista Código fuente.
Puede ver el código HTML que ha creado escribiendo en la Vista de diseño, como se muestra en la Figura
1.6.
15
< > Programación
Figura 1.6
1.2.2 Agregar y configurar controles de servidor en Formas Web
Ahora agregará controles de servidor a la página. Los controles de servidor, entre los que se incluyen
botones, etiquetas, cuadros de texto y otros controles familiares, proporcionan las funciones típicas de
procesamiento de formularios para las páginas Web ASP.NET. Sin embargo, puede programar los controles
con código que se ejecuta en el servidor, no el cliente.
Agregará a la página un control Button, un control TextBox y un control Label y escribirá código para controlar el evento Click para el control Button.
16
< > Programación
1.2.2.1 Para agregar controles a la página
1. Haga clic en la pestaña Diseño para cambiar a la Vista de diseño.
2. Sitúe el punto de inserción al final del texto “Welcome to Visual Web Developer” y presione ENTRAR al menos cinco veces para ampliar el espacio del cuadro del elemento div.
3. En el Cuadro de herramientas, expanda el grupo Estándar.
4. Arrastre un control TextBox hasta la página y colóquelo en el centro del cuadro del elemento div
con el texto “Welcome to Visual Web Developer” en la primera línea.
5. Arrastre un control Button hasta la página y colóquelo a la derecha del control TextBox.
6. Arrastre un control Label hasta la página y colóquelo en una línea independiente debajo del control Button.
7. Sitúe el punto de inserción encima del control TextBox y, a continuación, escriba el texto “Escriba
su nombre:”.
8. Este texto HTML estático es el título del control TextBox. Puede mezclar HTML estático y controles
de servidor en la misma página. La Figura 1.7 muestra cómo aparecen los tres controles en la Vista
de diseño.
Figura 1.7
17
< > Programación
1.2.2.2 Para establecer las propiedades de los controles
1. Seleccione el control Button y después, en la ventana Propiedades, establezca Text en Display
Name. El texto que escribió aparece en el botón en el diseñador, tal y como se muestra en la
Figura 1.8.
Figura 1.8
2. Cambie a la vista Código fuente.
En la vista Código, se muestra el código HTML de la página, incluidos los elementos que Visual
Studio ha creado para los controles de servidor. Los controles se declaran utilizando sintaxis de
tipo HTML, con la excepción de que las etiquetas utilizan el prefijo asp: e incluyen el atributo
runat=”server”.
Las propiedades del control se declaran como atributos. Por ejemplo, cuando estableció la propiedad Text del control Button en el paso 1, en realidad estableció el atributo Text del marcado
del control.
Observe que todos los controles están dentro de un elemento form, que también tiene el
atributo runat=”server”. El atributo runat=”server” y el prefijo asp: de las etiquetas de los controles marcan los controles para que ASP.NET los procese en el servidor cuando se ejecuta la
página. El código que se encuentra fuera de los elementos <form runat=”server”> y <script
runat=”server”> se envía sin cambios al explorador; este es el motivo por el que el código ASP.
NET debe estar dentro de un elemento cuya etiqueta de apertura contiene el atributo runat=”server”.
3. Sitúe el punto de inserción detrás de asp:Label en la etiqueta <asp:Label> y, a continuación,
presione la BARRA ESPACIADORA.
Aparece una lista desplegable que muestra las propiedades que se pueden establecer para un
control Label. Esta característica, denominada IntelliSense, ayuda en la vista Código fuente con
la sintaxis de los controles de servidor, los elementos HTML y otros elementos de la página. La
Figura 1.9 muestra la lista desplegable de IntelliSense para el control Label.
18
< > Programación
Figura 1.9
4. Seleccione ForeColor y, a continuación, escriba un signo igual y comillas (=”).
IntelliSense muestra una lista de colores.
5. Seleccione un color para el texto del control Label. Asegúrese de seleccionar un color suficientemente oscuro para que se pueda leer el texto sobre un fondo de color blanco.
El atributo ForeColor se completa con el color que ha seleccionado, incluidas las comillas de
cierre.
1.2.2.3 Para agregar un controlador de eventos de botón predeterminado
1. Cambie a la Vista de diseño.
2. Haga doble clic en el control Button.
Visual Studio cambia a la vista Código y crea un esquema del controlador de eventos para el evento predeterminado del control Button, es decir, el evento Click.
3. Dentro del controlador, escriba Label1 seguido de un punto (.).
19
< > Programación
Cuando se escribe un punto después de Label, Visual Studio muestra una lista de los miembros disponibles
para el control Label, tal como se muestra en la Figura 1.10.
Figura 1.10
4. Complete el controlador de eventos Click para el botón de manera que tenga el aspecto mostrado en el ejemplo de código siguiente
C#
protected void Button1_Click(object sender, System.EventArgs e)
{
Label1.Text = TextBox1.Text + “, welcome to Visual Studio!”;
}
5. Desplácese hasta el elemento <asp:Button>. Observe que el elemento <asp:Button> tiene ahora el atributo onclick=”Button1_Click”.
20
< > Programación
Este atributo enlaza el evento Click del botón al método controlador que codificó en el paso
anterior.
Los métodos de control de eventos pueden tener cualquier nombre; el nombre que se ve es el
nombre predeterminado creado por Visual Studio. Lo importante es que el nombre utilizado
para el atributo onclick debe coincidir con el nombre de un método de la página.
1.2.3 Trabajar con archivos de código adjunto
1.2.4 Manejo de eventos
Cuando trabajas con controles de servidor en una página Web ASP.NET, mucha de la lógica de la página
implica responder a los eventos provocados por controles.
Una característica importante de ASP.NET es que permite programar páginas Web utilizando un modelo
basado en eventos similar al de las aplicaciones de cliente.
Sólo que los eventos producidos por los controles de servidor ASP.NET funcionan de manera diferente a los
eventos de las páginas HTML tradicionales. La diferencia se basa principalmente en la separación existente
entre el propio evento y el lugar donde se controla el evento.
En las aplicaciones basadas en cliente, los eventos se producen y controlan en el cliente y en las páginas
Web ASP.NET, los eventos asociados a los controles de servidor se originan en el cliente (explorador) pero
los controla la página ASP.NET en el servidor Web.
ASP.NET controla la tarea de capturar, transmitir e interpretar el evento. Al crear controladores de eventos
en una página Web ASP.NET, no es necesario saber capturar la información del evento y hacer que esté
disponible para el código. En cambio, se pueden crear controladores de eventos casi de la misma forma que
en un formulario de cliente tradicional.
1.2.4.1 Conjunto de eventos para controles de servidor y páginas
Debido a que los eventos de controles de servidor ASP.NET requieren un viaje de ida y vuelta al servidor
para procesarse, pueden afectar al rendimiento de una página.
Por lo tanto, los controles de servidor ofrecen un conjunto limitado de eventos, normalmente sólo de tipo
clic.
Los eventos que tienen lugar con frecuencia (y que pueden provocarse sin que el usuario lo sepa), como
onmouseover, no se pueden usar en los controles de servidor.
Los controles de servidor ASP.NET siguen pudiendo llamar a los controladores de cliente para esos eventos.
21
< > Programación
1.2.4.2 Argumentos de eventos
Los eventos de los controles y de páginas ASP.NET siguen un modelo de .NET Framework estándar para los
métodos de controladores de eventos.
Todos los eventos pasan dos argumentos: un objeto que representa al objeto que ha provocado el evento,
y un objeto evento que contiene la información específica del evento. El segundo argumento suele ser de
tipo EventArgs, pero para algunos controles es de un tipo específico de dicho control.
Por ejemplo, para un control ImageButton de servidor Web, el segundo argumento es de tipo ImageClickEventArgs, que incluye información sobre las coordenadas donde el usuario ha hecho clic.
1.2.5 Controles de validación
Los controles de validación proporcionan un mecanismo fácil de utilizar para todos los tipos comunes de
validación estándar (por ejemplo, probar fechas válidas o valores comprendidos en un intervalo), además
de otras formas para proporcionar validación escrita personalizada.
Se pueden utilizar con cualquier control que se coloque en una página Web ASP.NET, incluidos los controles HTML y de servidor Web.
Estos controles llevan a cabo la validación (Validation controls) en el servidor. También es posible validar
en el cliente gracias a código JavaScript y, en muchas ocasiones, ello puede ser válido para nuestros propósitos, pero la validación en el servidor es necesaria para tareas más complejas en las que la seguridad
adquiere mayor importancia, y Asp .NET tiene un mecanismo sencillo para realizarla.
Los Validation controls de Asp .NET permiten:
• Capturar y validar cualquier cosa enviada por el usuario desde un formulario Web
• Personalizar los avisos de error cuando los datos no pasan la validación
• Escribir validaciones personalizadas de acuerdo a nuestras preferencias
Todos los Validation controls son controles Web, se ejecutan en el servidor y generan HTML que es enviado
al cliente. La sintaxis básica es similar en todos aunque hay diferencias en las propiedades que admiten,
según el tipo de control.
1.2.5.1 Utilizar controles de validación
Los controles de validación más comunes son los siguientes:
CompareValidator: Compara un control de entrada de datos con otro, un valor fijo, un tipo de datos o un
archivo. Por ejemplo, este control puede utilizarse para campos de verificación de contraseñas.
CustomValidator: Nos permite escribir nuestro propio código para crear la expresión de validación. Por
ejemplo, este control puede utilizarse para verificar que el valor es un número primo.
22
< > Programación
RangeValidator: Verifica que la entrada de datos de usuario esta entre dos valores o los valores de otros
controles de entrada de datos. Por ejemplo, este control puede utilizarse para verificar que la entrada del
usuario coincide con el intervalo de edad esperado.
RegularExpressionValidator: Verifica que la entrada coincide con un modelo definido por una expresión
habilitar. Este control de validación permite comprobar secuencias predecibles de caracteres, como números de la seguridad social, direcciones electrónicas, número de teléfono y códigos postales.
RequiredFieldValidator: Comprueba si se ha introducido un valor en un control. Es el único control de
validación que requiere un valor.
ValidationSummary: Muestra un resumen de todos los errores de validación para todos los controles de
validación de la página. Este control se ubica normalmente cerca del botón Submit para proporcionar respuesta inmediata sobre el estado de entrada de datos de la página.
1.2.6 Depuración en aplicaciones web
Depurar las aplicaciones Web de ASP.NET es similar a depurar un formulario Windows Forms o cualquier
otra aplicación para Windows porque ambos tipos de aplicación implican controles y eventos. No obstante,
hay también diferencias básicas entre ambos tipos de aplicación:
El seguimiento del estado es más complejo en una aplicación Web.
En una aplicación para Windows, el código que se va a depurar está principalmente en un solo lugar; en
una aplicación Web, el código puede estar en el cliente y en el servidor. El código de ASP.NET está completamente en el servidor, si bien también puede haber código de JavaScript o Visual Basic en el cliente.
1.3 Acceso a datos desde aplicaciones web
1.3.1 Introducción a ADO.NET
ADO.NET es un conjunto de componentes del software que pueden ser usados por los programadores para
acceder a datos y a servicios de datos. Es una parte de la biblioteca de clases base que están incluidas en
el Microsoft .NET Framework.
Es comúnmente usado por los programadores para acceder y para modificar los datos almacenados en un
Sistema Gestor de Bases de Datos Relacionales, aunque también puede ser usado para acceder a datos
en fuentes no relacionales.
1.3.2 Controles de acceso a datos
La mayoría de las aplicaciones Web ASP.NET implican el acceso a datos. Muchas aplicaciones recogen datos
para almacenarlos en una base de datos o en un archivo y, a menudo, se basan en información procedente
de los usuarios.
Puesto que los datos originales pueden proceder de orígenes que no son de confianza (ya que la informa-
23
< > Programación
ción se almacena en un formato permanente) y hay que asegurarse de que los usuarios no autorizados
no puedan obtener acceso al origen de datos directamente, es necesario prestar especial atención a los
problemas de seguridad relacionados con el acceso a datos.
Aunque se puede mejorar la seguridad de la aplicación siguiendo las buenas prácticas en materia de codificación y configuración, también es importante mantener actualizado el servidor Web con las últimas
actualizaciones de seguridad de Microsoft Windows e Internet Information Services (IIS), así como las actualizaciones de seguridad de Microsoft SQL Server o cualquier otro software de base de datos.
1.3.2.1 Proteger el acceso a un origen de datos
Las secciones siguientes proporcionan información sobre cómo ayudar a proteger diferentes aspectos del
acceso a datos.
1.3.2.2 Cadenas de conexión
Para conectar con una base de datos, se necesita una cadena de conexión. Puesto que las cadenas de conexión pueden contener datos confidenciales, se deben seguir estas instrucciones:
• No almacenes cadenas de conexión en ninguna página. Almacénelas en el archivo Web.config del
sitio.
• No almacenes cadenas de conexión como texto sin formato. Para proteger la conexión al servidor
de bases de datos, se recomienda cifrar la información de la cadena de conexión del archivo de
configuración mediante la configuración protegida. Conexión a bases de datos
1.3.3 Administrar información de la base de datos desde una aplicación web
Si es posible, conéctate a una instancia de SQL Server utilizando la seguridad integrada en lugar de un
nombre de usuario explícito y una contraseña. De esta forma, se evita la posibilidad de comprometer la
integridad de la cadena de conexión y de exponer el identificador de usuario y la contraseña.
Se recomienda que te asegures de que la identidad del proceso (por ejemplo, la agrupación de aplicaciones) que está ejecutando ASP.NET sea la cuenta de proceso predeterminada o una cuenta de usuario
restringida.
En los casos en los que distintos sitios Web conectan con diversas bases de datos de SQL Server, puede que
no resulte práctico utilizar la seguridad integrada. Por ejemplo, en los sitios de alojamiento Web, se suele
asignar a cada cliente una base de datos de SQL Server diferente, pero todos utilizan el servidor Web como
usuarios anónimos. En estos casos, debe utilizar credenciales explícitas para conectarse a una instancia de
SQL Server.
24
< > Programación
1.3.3.1 Permisos de base de datos de SQL Server
Se recomienda asignar los privilegios mínimos al identificador de usuario que se utiliza para la conexión a
las bases de datos de SQL Server usadas en la aplicación.
1.3.3.2 Restringir las operaciones de SQL
Los controles enlazados a datos pueden admitir una gran variedad de operaciones con datos como selección, inserción, eliminación y actualización de registros en las tablas de datos. Se recomienda configurar los
controles de datos para realizar la funcionalidad mínima necesaria de la página o aplicación. Por ejemplo,
si un control no debe permitir a los usuarios que eliminen datos, no incluya una consulta Delete con un
control de origen de datos y no permita eliminación en el control.
1.3.3.3 SQL Server Express
Para asociar un proceso a una base de datos de SQL Server Express (archivo .mdf), debe tener permisos
de administrador. En general, esta es la razón por la que las bases de datos de SQL Server Express no son
prácticas para la creación de sitios Web, ya que el proceso de ASP.NET no se ejecuta (ni se debe ejecutar)
con privilegios administrativos. Por consiguiente, utilice las bases de datos de SQL Server Express sólo en
los siguientes casos:
Como base de datos de prueba al desarrollar la aplicación Web. Cuando estés listo para implementar la
aplicación, puede transferir la base de datos de SQL Server Express a una instancia de producción de SQL
Server.
Utilízalas si estás ejecutando un sitio Web que permita la suplantación y pueda controlar los privilegios del
usuario suplantado. En la práctica, esta estrategia es conveniente si la aplicación se está ejecutando en una
red de área local (no en un sitio Web público).
Almacena el archivo .mdf en la carpeta App_Data del sitio porque el contenido de la carpeta no se devolverá para enviar solicitudes HTTP. También debes asignar la extensión .mdf a ASP.NET en IIS y al controlador
HttpForbiddenHandler en ASP.NET mediante el siguiente elemento en el archivo Web.config del sitio:
“<httpHandlers>”
“ <add verb=”*” path=”*.mdf” type=”System.Web.HttpForbiddenHandler” />”
“</httpHandlers>”
25
• Conocer las capacidades básicas del lenguaje de programación PHP.
• Conocer la sintaxis del lenguaje, tipos de datos y su manejo en PHP, operadores y
expresiones, estructuras de control y funciones.
• Trabajar con pequeñas funciones que permitan manipular datos.
• Realizar aplicaciones web sencillas centradas en el uso de formularios.
< > Programación
2 Introducción a PHP
PHP (acrónimo de PHP: Hypertext Preprocessor) es un lenguaje de código abierto especialmente adecuado para desarrollo web y que puede ser incrustado en HTML.
PHP nos permite embeber sus pequeños fragmentos de código dentro de la página HTML y realizar determinadas acciones de una forma fácil y eficaz, combinando lo que ya sabemos del desarrollo HTML.
Es decir, con PHP escribimos scripts dentro del código HTML.
2.1 Sintaxis Básica de PHP
2.1.3.1 Etiquetas de PHP
Cuando PHP interpreta un archivo, busca las etiquetas de apertura y cierre, que son:
<?php  inicializa
?> 
finaliza la interpretación del código.
Este mecanismo permite a PHP ser incrustado en todo tipo de documentos, ya que todo lo que esté fuera
de las etiquetas de PHP será ignorado por el intérprete.
Ejemplo
<?php
echo “Hola mundo”;
// ... más código
echo «Última sentencia»;
// el script finaliza aquí sin etiqueta de cierre de PHP
27
< > Programación
2.1.3.2 Separación de instrucciones
PHP requiere que las instrucciones terminen en punto y coma al final de cada sentencia.
<?php
echo ‘Esto es una prueba’;
?>
<?php echo ‘Esto es una prueba’ ?>
<?php echo ‘Hemos omitido la última etiqueta de cierre’;
Nota: La etiqueta de cierre de un bloque de PHP es opcional al final de un archivo
2.1.1 Declaración y uso de variables
En PHP las variables se representan con un signo de dólar seguido por el nombre de la variable. El nombre
de la variable es sensible a minúsculas y mayúsculas.
Un nombre de variable válido tiene que empezar con una letra o un carácter de subrayado seguido de cualquier número de letras, números y caracteres de subrayado.
Ejemplo:
<?php
$var1 = ‘Roberto’;
$Var2 = ‘Juan’;
echo “$var1, $Var2”;
$4site = ‘aun no’;
$_4site = ‘aun no’;
// imprime “Roberto, Juan”
// inválido; comienza con un número
// válido; comienza con un carácter de subrayado
$täyte = ‘mansikka’; // válido; ‘ä’ es ASCII (Extendido) 228
?>
28
< > Programación
2.1.2 Operadores
Los operadores se pueden agrupar de acuerdo con el número de valores que toman.
Los operadores unarios toman sólo un valor, por ejemplo ! (el operador lógico de negación) o ++ (el operador de incremento). Los operadores binarios toman dos valores, como los familiares operadores aritméticos + (suma) y - (resta), y la mayoría de los operadores de PHP entran en esta categoría. Finalmente, hay
sólo un operador ternario, “? :”, el cual toma tres valores y podríamos interpretarlo de la forma siguiente:
condición ? valorSiEsVerdadero : valorSiEsFalso
Un ejemplo sería:
<?php
$mensaje = ($dinero > 10) ? ‘Me puedo ir al cine!’ : ‘Me tengo que quedar en casa’;
?>
2.1.2.1 Operadores aritméticos
Ejemplo
Nombre
Negación
Suma
Resta
Multiplicación
División
Módulo
-$a
$a + $b
$a - $b
$a * $b
$a / $b
$a % $b
Resultado
Opuesto de $a
Suma de $a y $b
Resta de $a y $b
Multiplicación de $a y $b
División de $a y $b
Residuo de $a dividido entre $b
El operador de división (“/”) devuelve un valor flotante a menos que los dos operandos sean int (o strings
que se conviertan a int) y los números sean divisibles, en cuyo caso será devuelto un valor int.
Los operandos del módulo se convierten en int (por extracción de la parte decimal) antes del procesamiento.
El resultado del operador módulo % tiene el mismo signo que el dividendo — es decir, el resultado de $a %
$b tendrá el mismo signo que $a. Por ejemplo:
<?php
29
echo (5 % 3).”\n”;
// muestra 2
echo (5 % -3).”\n”;
// muestra 2
echo (-5 % 3).”\n”;
// muestra -2
< > Programación
echo (-5 % -3).”\n”;
// muestra -2
?>
2.1.2.2 Operadores de asignación
El operador básico de asignación es “=”. Se podría inclinar a pensar primero que es como un “igual a”. No
lo es. Realmente significa que el operando de la izquierda se establece con el valor de la expresión de la
derecha (es decir, “se define como”).
El valor de una expresión de asignación es el valor asignado. Es decir, el valor de “$a = 3” es de 3. Esto
permite hacer algunas cosas intrincadas:
<?php
$a = ($b = 4) + 5; // ahora $a es igual a 9 y $b se ha establecido en 4.
?>
2.1.2.3 Operadores bit a bit
Los operadores bit a bit permiten la evaluación y la manipulación de bits específicos dentro de un integer.
Ejemplo
$a & $b
$a | $b
$a ^ $b
~ $a
$a << $b
$a >> $b
30
Nombre
Resultado
AND (Y)
Los bits que están activos en ambos $a y $b son activados
OR (O inclusivo)
Los bits que están activos ya sea
en $a o $b son activados
XOR (O exclusivo)
Los bits que están activos en $a
o en $b , pero no en ambos son
activados
NOT (No)
Los bits que están activos en $a
son desactivados y viceversa
SHIFT LEFT (desplazamiento a la Desplaza los bits de $a, $b pasos
izquierda)
a la izquierda (cada paso quiere
decir “multiplicar por dos”)
SHIFT RIGHT (desplazamiento a la Desplaza los bits de $a, $b pasos
derecha)
a la derecha (cada paso quiere
decir “dividir por dos”)
< > Programación
2.1.2.4 Operadores de comparación
Los operadores de comparación, como su nombre lo indica, permiten comparar dos valores. Puede también estar interesado en ver las tablas de comparación de tipos, ya que muestran ejemplos de las varias
comparaciones relacionadas con tipos.
Ejemplo
$a == $b
Nombre
Igual
$a === $b
$a != $b
Idéntico
Diferente
$a <> $b
Diferente
$a != =$b
No idéntico
$a < $b
$a > $b
$a <= $b
$a >= $b
Menor que
Mayor que
Menor o igual que
Mayor o igual que
Resultado
TRUE si $a es igual a $b después de la manipulación
de tipos
TRUE si $a es igual a $b, y son del mismo tipo
TRUE si $a no es igual a $b después de la manipulación de tipos
TRUE si $a no es igual a $b después de la manipulación de tipos
TRUE si $a no es igual a $b, o si no son del mismo
tipo
TRUE si $a es estrictamente menor que $b
TRUE si $a es estrictamente mayor que $b
TRUE si $a es menor o igual que $b
TRUE si $a es mayor o igual que $b
Si se compara un número con un string o la comparación implica strings numéricos, entonces cada string
es convertido en un número y la comparación realizada numéricamente. Estas reglas también se aplican a
la sentencia switch. La conversión de tipo no tiene lugar cuando la comparación es === o !== ya que esto
involucra comparar el tipo así como el valor.
Ejemplo:
<?php
var_dump(0 == “a”); // 0 == 0 -> true
var_dump(“1” == “01”); // 1 == 1 -> true
var_dump(“10” == “1e1”); // 10 == 10 -> true
var_dump(100 == “1e2”); // 100 == 100 -> true
switch (“a”) {
case 0:
echo “0”;
break;
31
< > Programación
case “a”: // nunca alcanzado debido a que “a” ya ha coincidido con 0
echo “a”;
break;
}
?>
2.1.3 Estructuras de control
Todo script PHP está construido en base a una serie de sentencias. Una sentencia puede ser una asignación, una llamada de función, un ciclo, una sentencia condicional o incluso una sentencia que no hace nada
(una sentencia vacía). Las sentencias generalmente finalizan con un punto y coma.
Adicionalmente, las sentencias pueden agruparse en un conjunto de sentencias, encapsulándolas entre
corchetes. Un grupo de sentencias es una sentencia por sí misma también.
2.1.3.1 if
Permite la ejecución condicional de fragmentos de código. PHP dispone de una estructura if que es similar
a la de C:
if (expr)
sentencia
la expresión es evaluada a su valor booleano. Si la expresión se evalúa como TRUE, PHP ejecutará la sentencia y si se evalúa como FALSE la ignorará.
El siguiente ejemplo mostraría a es mayor que b si $a es mayor que $b:
<?php
if ($a > $b) {
echo “a es mayor que b”;
}
?>
32
< > Programación
A menudo se desea tener más de una sentencia para ser ejecutada condicionalmente. Por supuesto, no
hay necesidad de envolver cada sentencia con una cláusula if. En cambio, se pueden agrupar varias sentencias en un grupo de sentencias.
Por ejemplo, este código mostraría a es mayor que b si $a es mayor que $b y entonces asignaría el valor
de $a a $b:
<?php
if ($a > $b) {
echo “a es mayor que b”;
$b = $a;
}
?>
2.1.3.2 else
Con frecuencia si deseas ejecutar una sentencia si una determinada condición se cumple y una sentencia
diferente si la condición no se cumple. Esto es para lo que sirve else. El else extiende una sentencia if para
ejecutar una sentencia en caso que la expresión en la sentencia if se evalúe como FALSE.
Por ejemplo, el siguiente código deberá mostrar a es mayor que b si $a es mayor que $b y a NO es mayor
que b en el caso contrario:
<?php
if ($a > $b) {
echo “a es mayor que b”;
} else {
echo “a NO es mayor que b”;
}
?>
La sentencia else sólo es ejecutada si la expresión if es evaluada como FALSE.
33
< > Programación
2.1.3.3 elseif / else if
elseif, como su nombre lo sugiere, es una combinación de if y else. Del mismo modo que else, extiende
una sentencia if para ejecutar una sentencia diferente en caso que la expresión if original se evalúe como
FALSE.
Sin embargo, a diferencia de else, esa expresión alternativa sólo se ejecutará si la expresión condicional del
elseif se evalúa como TRUE.
Por ejemplo, el siguiente código debe mostrar a es mayor que b, a es igual que b o a es menor que b:
<?php
if ($a > $b) {
echo “a es mayor que b”;
} elseif ($a == $b) {
echo “a es igual que b”;
} else {
echo “a es menor que b”;
}
?>
Puede haber varios elseif dentro de la misma sentencia if. La primera expresión elseif (si hay alguna) que
se evalúe como TRUE sería ejecutada. En PHP también se puede escribir ‘else if’ (en dos palabras) y el comportamiento sería idéntico al de ‘elseif’ (en una sola palabra).
La sentencia elseif es ejecutada solamente si la expresión if precedente y cualquiera de las expresiones
elseif precedentes son evaluadas como FALSE, y la expresión elseif actual se evalúa como TRUE.
2.1.3.4 while
Los ciclos while son el tipo más sencillo de ciclo en PHP. La forma básica de una sentencia while es:
while (expr)
sentencia
El significado de una sentencia while es simple. Le dice a PHP que ejecute las sentencias anidadas, mientras
que la expresión while se evalúe como TRUE. El valor de la expresión es verificado cada vez al inicio del
ciclo, por lo que incluso si este valor cambia durante la ejecución de las sentencias anidadas, la ejecución
no se detendrá hasta el final de la iteración (cada vez que PHP ejecuta las sentencias contenidas en el ciclo
es una iteración).
34
< > Programación
A veces, si la expresión while se evalúa como FALSE desde el principio, las sentencias anidadas no se ejecutarán ni siquiera una vez.
Al igual que con la sentencia if, se pueden agrupar varias instrucciones dentro del mismo ciclo while rodeando un grupo de sentencias con corchetes, o utilizando la sintaxis alternativa:
while (expr):
sentencias
...
end while;
Los siguientes ejemplos son idénticos y ambos presentan los números del 1 al 10:
<?php
/* ejemplo 1 */
$i = 1;
while ($i <= 10) {
echo $i++; /* el valor presentado sería $i antes del incremento (post-incremento) */
}
/* ejemplo 2 */
$i = 1;
while ($i <= 10):
echo $i;
$i++;
endwhile;
?>
35
< > Programación
2.1.3.5 do-while
Los ciclos do-while son muy similares a los ciclos while, excepto que la expresión verdadera es verificada
al final de cada iteración en lugar de al principio. La diferencia principal con los ciclos while es que está
garantizado que corra la primera iteración de un ciclo do-while (la expresión verdadera sólo es verificada al
final de la iteración), mientras que no necesariamente va a correr con un ciclo while regular (la expresión
verdadera es verificada al principio de cada iteración, si se evalúa como FALSE justo desde el comienzo, la
ejecución del ciclo terminaría inmediatamente).
Hay una sola sintaxis para ciclos do-while:
<?php
$i = 0;
do {
echo $i;
} while ($i > 0);
?>
El ciclo de arriba se ejecutaría exactamente una sola vez, ya que después de la primera iteración, cuando
la expresión verdadera es verificada, se evalúa como FALSE ($i no es mayor que 0) y termina la ejecución
del ciclo.
2.1.3.6 for
Los ciclos for son los más complejos en PHP. Se comportan como sus homólogos en C#. La sintaxis de un
ciclo for es:
for (expr1; expr2; expr3)
sentencia
La primera expresión (expr1) es evaluada (ejecutada) una vez incondicionalmente al comienzo del ciclo.
En el comienzo de cada iteración, se evalúa expr2. Si se evalúa como TRUE, el ciclo continúa y se ejecutan
la(s) sentencia(s) anidada(s). Si se evalúa como FALSE, finaliza la ejecución del ciclo.
Al final de cada iteración, se evalúa (ejecuta) expr3.
Cada una de las expresiones puede estar vacía o contener múltiples expresiones separadas por comas. En
expr2, todas las expresiones separadas por una coma son evaluadas, pero el resultado se toma de la última
parte. Que expr2 esté vacía significa que el ciclo debería ser corrido indefinidamente (PHP implícitamente
lo considera como TRUE, como en C).
36
< > Programación
Ejemplo. Muestra los números del 1 al 10:
<?php
for ($i = 1; $i <= 10; $i++) {
echo $i;
}
2.1.4 Arreglos
Un arreglo es realmente un mapa ordenado. Un mapa es un tipo de datos que asocia valores con claves.
Este tipo es optimizado para varios usos diferentes; puede ser usado como una matriz real, una lista (vector), una tabla asociativa (una implementación de un mapa), diccionario, colección, pila, cola, y posiblemente más. Ya que los valores de un arreglo pueden ser otros arreglos, árboles y también son posibles
arreglos multidimensionales.
Sintaxis:
Especificación con array()
Un arreglo puede ser creado usando el constructor del lenguaje array(). Éste toma un cierto número de
parejas clave => valor como argumentos.
array(
clave => valor,
clave2 => valor2,
clave3 => valor3,
...
)
La coma después del elemento del arreglo es opcional y se puede omitir. Esto normalmente se hace para
arreglos de una sola línea, esto es, es preferible array(1, 2) que array(1, 2, ).
Por otra parte, para arreglos multilínea, la coma final se usa comúnmente, ya que permite la adición sencilla de nuevos elementos al final.
Ejemplo #1: Un arreglo simple
<?php
$array = array(
“foo” => “bar”,
“bar” => “foo”,
);
37
< > Programación
2.1.5 Funciones
La función podría ser definida como un conjunto de instrucciones que explotan ciertas variables para realizar una tarea más o menos elemental.
PHP basa su eficacia principalmente en este tipo de elemento. Una gran librería que crece constantemente, a medida que nuevas versiones van surgiendo, es complementada con las funciones de propia cosecha
dando como resultado un sinfín de recursos que son aplicados por una simple llamada.
Las funciones integradas en PHP son muy fáciles de utilizar. Tan sólo hemos de realizar la llamada de la
forma apropiada y especificar los parámetros y/o variables necesarios para que la función realice su tarea.
Lo que puede parecer ligeramente más complicado, pero que resulta sin lugar a dudas muy práctico, es
crear nuestras propias funciones. De una forma general, podríamos crear nuestras propias funciones para
conectarnos a una base de datos o crear los encabezados o etiquetas meta de un documento HTML. Para
una aplicación de comercio electrónico podríamos crear por ejemplo funciones de cambio de una moneda
a otra o de cálculo de los impuestos a añadir al precio de artículo. En definitiva, es interesante crear funciones para la mayoría de acciones más o menos sistemáticas que realizamos en nuestros programas.
Un esqueleto típico de una función es:
function outputcol($strCadena, $strColor) {
// Saca una cadena con el color deseado
Echo(“<FONT COLOR=”#$strColor”>$strCadena</FONT>”);
}
Y se llama con:
outputcol(“Rojo”, “FF0000”);
outputcol(“Verde”, “00FF00”);
Dando el resultado:
<FONT COLOR=”#FF0000”>Rojo</FONT>
<FONT COLOR=”#00FF00”>Verde</FONT>
38
< > Programación
2.1.6 Incluir funciones en un script
Un script es un conjunto de instrucciones generalmente almacenadas en un archivo de texto que deben
ser interpretados línea a línea en tiempo real para su ejecución, se distinguen de los programas, pues deben ser convertidos a un archivo binario ejecutable para correrlos.
Los scripts pueden estar embebidos en otro lenguaje para aumentar las funcionalidades de este, como es
el caso los scripts PHP o Javascript en código HTML.
Aquí daremos el ejemplo de creación de una función que, llamada al comienzo de nuestro script, nos crea
el encabezado de nuestro documento HTML y coloca el título que queremos a la página:
<?
function hacer_encabezado($titulo)
{
$encabezado=”<html><head>t<title>$titulo</title></head>”;
echo $encabezado;
}
?>
Esta función podría ser llamada al principio de todas nuestras páginas de la siguiente forma:
$titulo=”Mi web”;
hacer_encabezado($titulo);
De esta forma automatizamos el proceso de creación de nuestro documento. Podríamos por ejemplo incluir en la función otras variables que nos ayudasen a construir la etiquetas meta y de esta forma, con un
esfuerzo mínimo, crearíamos los encabezados personalizados para cada una de nuestras páginas. De este
mismo modo nos es posible crear cierres de documento o formatos diversos para nuestros textos como si
se tratase de hojas de estilo que tendrían la ventaja de ser reconocidas por todos los navegadores.
Por supuesto, la función ha de ser definida dentro del script ya que no se encuentra integrada en PHP sino
que la hemos creado nosotros.
39
< > Programación
2.2 Librerías de PHP
2.2.1 Funciones para trabajar con arreglos
Algunas de las funciones más utilizadas y útiles con respecto a arreglos son:
2.2.1.1 array_diff
Muestra las diferencias entre un arreglo y otro:
$a = array( “hola”, “adios”, “como” );
$b = array( “hola”, “va”, “como” );
$dif = array_diff( $a, $b );
print_r($dif);
mostrará algo asi:
Array
(
[1] => “adios”
)
2.2.1.2 array_search
Buscará un valor específico en un arreglo y devuelve el índice si lo encuentra, por ejemplo:
$a = array( 0 => “Justi”, 1 => “Thor”, 2 => “Debi” );
$key = array_search(’Debi’, $a);
La variable $key va a tener valor 2.
40
< > Programación
2.2.1.3 in_array
Es similar a la anterior pero en lugar de devolver el indice de la coincidencia, devuelve true o false.
Por ejemplo:
if ( in_array( “Justi”, $a ) ) {
$cuerso = “php”;
}
A continuación mostramos una lista de otras funciones:
Sort(): Nos permite ordenar los elementos de un array de un orden numérico o alfabético del siguiente
modo: Primero los números, luego signos de puntuación y finalmente las letras.
Asort(): Nos permite ordenar el array de índice de texto manteniendo el valor de sus índices.
Rsort(): Igual que la función sort() con la diferencia de que el ordenamiento es a la inversa de dicha función.
Arsort(): Idem que asort() con la diferencia de que el ordenamiento es en forma descendente.
Ksort(): Ordena el arreglo de acuerdo con su índice.
Krsort(): Opera de manera idéntica a la explicada anteriormente pero ordena el array de acuerdo a su
índice con orden inverso.
Shuffle(): Función que nos permite mezclar los elementos de un array.
Range(): Con esta función definimos rapidamente un array definiendo un rango de elementos entre los
dos parámetros de inicio y de fin.
2.2.2 Funciones para trabajar con cadenas
A continuación le mostramos una lista de las 10 funciones más utilizadas con cadenas:
Strtolower(string): Nos permite convertir una cadena a minúsculas, por ejemplo tenemos un libro de visitas donde no aceptamos mayúsculas, solo debemos usar esta función y pasará automáticamente todo el
texto a minúsculas.
Trim(string): Elimina los espacios en blanco al final y al inicio de una cadena. En caso de que solo queramos borrar los espacios al principio de la cadena usamos itrim() y en caso de que sea al final usaremos la
41
< > Programación
función chop(), esto sirve para por ejemplo cuando se crea un usuario que el mismo no pueda contener
espacios ni al principio ni al fin del mismo.
Strlen(string): Función muy útil ya que nos permite saber la cantidad de caracteres que tiene una cadena
con lo cual podríamos saber si supera el largo deseado.
Chr(valor ascii): Recibe como parámetro un carácter ascii y devuelve su equivalente.
Substr(“cadena original”, inicio_a_extraer, largo_a_extraer): Esta función nos permitirá extraer parte de
una cadena la cual le es pasada como parámetro.
Ereg(“busqueda”, “cadena”): Esta función nos permite buscar una cadena dentro de otra cadena y nos
devolverá verdadero en caso de encontrarla por lo cual su utilización viene acompañada de un if.
Eregi(“busqueda”, “cadena”): Igual que la anterior pero esta función no hace diferencias entre mayúsculas
y minúsculas.
Ereg_replace(“busqueda”, “reemplazo”, “cadena”): Esta función nos permite buscar una cadena dentro
de otra y reemplazarla por la que hemos definido como segundo parámetro.
Eregi_replace(“busqueda”, “reemplazo”, “cadena”): Funciona como la anterior pero no diferencia entre
mayúsculas y minúsculas.
Split(“separador”, “cadena”): Nos permite separar una cadena de caracteres con el valor que le pasamos
como parámetro de separador.
2.2.3 Funciones para trabajar con fecha y hora
Algunas de las funciones más utilizadas son las siguientes:
checkdate — Validar una fecha gregoriana.
date_default_timezone_get — Obtiene la zona horaria predeterminada usada por todas las funciones de
fecha/hora en un script.
date_default_timezone_set — Establece la zona horaria predeterminada usada por todas las funciones de
fecha/hora en un script.
42
< > Programación
2.3 Creación de Formularios con PHP
Otra de las características más importantes de PHP es que gestiona formularios HTML. El concepto básico
que es importante entender es que cualquier elemento de los formularios estará disponible automáticamente en su código PHP.
Ejemplo #1 Un formulario HTML simple
<form action=”accion.php” method=”post”>
<p>Su nombre: <input type=”text” name=”nombre” /></p>
<p>Su edad: <input type=”text” name=”edad” /></p>
<p><input type=”submit” /></p>
</form>
2.3.1 Elementos de un formulario
2.3.1.1 TEXT
Introduzca la cadena a buscar:
<INPUT TYPE=”text” NAME=”cadena” VALUE=”valor por defecto” SIZE=”20”>
<?PHP
print ($cadena);
//print ($_REQUEST [‘cadena’]);
?>
El resultado dell código anterior se puede ver en la figura 2.1.
Figura 2.1
43
< > Programación
2.3.1.2 RADIO
<INPUT TYPE=”radio” NAME=”titulacion” VALUE=“II“ CHECKED>I.Informática
<INPUT TYPE=”radio” NAME=”titulacion” VALUE=”ITIG”>I.T.I. Gestión
<INPUT TYPE=”radio” NAME=”titulacion” VALUE=”ITIS”>I.T.I. Sistemas
<?PHP
print ($titulacion);
//print ($_REQUEST [‘titulacion’]);
?>
El resultado dell código anterior se puede ver en la figura 2.2.
Figura 2.2
2.3.1.3 CHECKBOX
<INPUT TYPE=”checkbox” NAME=”extras[]” VALUE=”garaje” CHECKED>Garaje
<INPUT TYPE=”checkbox” NAME=”extras[]” VALUE=”piscina”>Piscina
<INPUT TYPE=”checkbox” NAME=”extras[]” VALUE=”jardin”>Jardín
<?PHP
$n = count ($extras);
for ($i=0; $i<$n; $i++)
print (“$extras[$i]<BR>\n”);
//foreach ($_REQUEST[‘extras’] as $extra)
//print (“$extra<BR>\n”);
?>
El resultado dell código anterior se puede ver en la figura 2.3.
Figu 2.3
44
< > Programación
2.3.1.4 BUTTON
<INPUT TYPE=”button” NAME=”nueva” VALUE=”Añadir una más”>
<?PHP
if ($nueva)
print (“Se va a añadir una nueva”);
//if ($_REQUEST [‘nueva’])
//print (“Se va a añadir una nueva”);
?>
El resultado dell código anterior se puede ver en la figura 2.4.
Figura 2.4
2.3.1.5 FILE
<FORM ACTION=”procesa.php” METHOD=”post“
ENCTYPE=”multipart/form-data”>
<INPUT TYPE=”file” NAME=”fichero”>
</FORM>
El resultado dell código anterior se puede ver en la figura 2.5.
Figura 2.5
45
< > Programación
2.3.1.6 PASSWORD
Contraseña: <INPUT TYPE=”password” NAME=”clave”>
<?PHP
print ($clave);
//print ($_REQUEST [‘clave’]);
?>
El resultado dell código anterior se puede ver en la figura 2.6.
Figura 2.6
2.3.1.7 SUBMIT
<INPUT TYPE=”submit” NAME=”enviar” VALUE=”Enviar datos”>
<?PHP
if ($enviar)
print (“Se ha pulsado el botón de enviar”);
//if ($_REQUEST [‘enviar’])
//print (“Se ha pulsado el botón de enviar”);
?>
El resultado dell código anterior se puede ver en la figura 2.7.
Figura 2.7
46
< > Programación
2.3.2 Validación de datos en un formulario
Toda la información proveniente de un formulario debe considerarse por norma como contaminada, y
hay que validarla antes de darla por buena y procesarla
La validación de datos se hace verdaderamente importante para cualquier proyecto, ya que así impedimos que los usuarios que hagan uso del software tengan menos posibilidad de cometer errores en el
traspaso de datos.
La validación de datos se hace de distintas formas, pero también hay distintos tipos, por ejemplo, lo primero que tenemos que validar es si el usuario ingresó o no datos, luego validamos los tipos de datos que
el usuario introduzca en los formularios.
Lo más eficiente es mostrar los errores sobre el propio formulario para facilitar su corrección. Procedimiento:
si se ha enviado el formulario:
si hay errores:
Mostrar formulario con errores
si no:
Procesar formulario
fsi
si no:
Mostrar formulario
Fsi
Este procedimiento se puede resumir para que sólo haya que mostrar una vez el formulario, bien con los
valores por defecto o con los valores introducidos, y con los errores en su caso:
si se ha enviado el formulario:
validar datos
fsi
si se ha enviado el formulario y no hay errores:
Procesar formulario
si no:
Mostrar formulario con valores por defecto o ya enviados
fsi
47
• Conocer las capacidades de los dispositivos móviles y los tipos de aplicación
adecuadas para dichos dispositivos.
• Comprender las características que conforman una aplicación web destinada
a ambientes móviles.
• Conocer las mejores prácticas en el ciclo de desarrollo de aplicaciones web
para dispositivos móviles.
< > Programación
3 Desarrollo de Aplicaciones Web para dispositivos móviles
3.1 Introducción
Una aplicación móvil es un software escrito para dispositivos móviles que realiza una tarea específica,
como un juego, un calendario, un reproductor de música, etc.
Se define como nativa aquella aplicación específicamente diseñada para ejecutarse en el sistema operativo de un dispositivo y en el firmware de la máquina, y que, por lo general, tiene que ser adaptada para
distintos dispositivos.
Una aplicación Web o una aplicación de navegador, en cambio, es aquella en la cual la totalidad o algunas
partes de los programas se descargan de la Web cada vez que se ejecuta. Por lo general, se puede acceder
desde todos los dispositivos móviles con capacidad Web.
Para aplicaciones web para móviles, sin embargo, el interés de desarrolladores surgió sólo en los dos últimos años, específicamente después de la implementación exitosa por parte de Google de las aplicaciones
basadas en HTML 5. Naturalmente, los sitios Web móviles habían existido mucho antes, por ejemplo,
Portales WAP.
En cuanto a los motivos para preferir una aplicación nativa a una Web, la mayoría de los desarrolladores
de aplicaciones nativas argumentan que la interfaz de usuario es superior y las oportunidades comerciales
que ofrece por ejemplo, el iPhone App Store, son mejores.
3.1.1 Características de las aplicaciones para dispositivos móviles
• Mayor compatibilidad con diferentes modelos y sistemas operativos.
• No es necesario distribuir ni instalar ninguna aplicación.
• Podemos utilizar la aplicación en sistemas operativos propietarios que no permiten la instalación
de aplicaciones Stand-alone.
• Podemos realizar cálculos y algoritmos complejos dado que la ejecución se realiza en el servidor.
• Se puede trabajar con gran cantidad de información.
49
< > Programación
3.2 Formularios Web con emuladores de dispositivos para móviles
3.2.1 Formularios Web para Móviles
Cuando se diseña un formulario que queremos que sea sencillo de usar en un móvil es útil aplicar la máxima “Más es menos”, porque cuanto menor y más objetivo sea el formulario, más contentos estarán tus
usuarios.
1.- Minimizar la entrada de texto
Como decíamos, cuanto menos texto haya que escribir, mucho mejor. Existen muchas veces opciones alternativas a un campo de texto, como cajas de selección, botones de radio, “sliders”, etc. En muchos casos
sólo nos servirá colocar un campo de texto y tampoco debe significar un problema, pero al menos sí debemos minimizar el número de campos donde tener que escribir datos con el incómodo teclado virtual.
Un claro ejemplo de este detalle es utilizar “datepickers”, para seleccionar una fecha en un calendario, en
lugar de escribirla a mano.
2.- Minimizar el número de campos
Cuanto menor sea el número de campos del formulario como en la figura 3.1, también más satisfecho estará el usuario. En general, si hay campos prescindibles, se quitan y punto.
Figura 3.1
50
< > Programación
3.- Utilizar campos input del HTML5
En HTML5 existen diversos tipos nuevos de campos INPUT que pueden ayudarnos a mejorar la interfaz de
entrada de datos en los formularios. Existen campos para selección de colores, fechas, meses, números,
rangos, URL, email, etc. Estos campos muchas veces se implementan con ligeras diferencias en el navegador a los campos INPUT de texto de toda la vida, por ejemplo cambiando cosas como el “layout” del
teclado virtual, para que muestre unas teclas u otras, dependiendo del tipo de campo y del dato que se
supone tiene que introducirse en él.
4.- Alinear etiquetas arriba
Al lado de cada campo de formulario se suele colocar un texto explicativo que sirve para saber qué información se debe colocar en el campo, al que en inglés se le llama “label” y que se traduciría por etiqueta.
Ese texto debe aparecer al lado del campo, pero debido al tamaño reducido de las pantallas de móviles,
se recomendaría colocarlo en la parte de arriba del campo, en lugar de al lado, como se suele hacer en
formularios habitualmente.
5.- Eliminar contenido accesorio
A veces los formularios para webs de escritorio tienen elementos accesorios para ayudar a rellenar el formulario, como “tips” que se activan al situarse sobre determinados campos o enlaces que pueden abrir
capas flotantes o “pop-ups” para explicar ciertas informaciones. Generalmente, todos esos contenidos
accesorios son prescindibles en formularios para móviles y los podemos eliminar sin ningún reparo.
6.- Evitar formularios multicolumna
Por motivos similares al de colocar las etiquetas arriba (poco espacio en las pantallas de los móviles), también es buena idea organizar los formularios en una única columna. Pero es que además, en este caso, los
formularios de varias columnas a menudo son menos claros en el sentido de saber el orden en el que se
supone que la información debe escribirse.
7.- Recordar datos introducidos anteriormente
En la medida de lo posible, siempre será de utilidad que nuestro sitio web sea lo suficientemente inteligente como para no solicitar datos que ya conocemos de antemano. Por ejemplo, si se le pidió al usuario el
nombre en algún momento, es bueno introducirlo ya en el campo nombre del formulario, en vez de hacer
que lo vuelva a escribir. Otro ejemplo: si es la segunda vez que se rellena ese formulario, determinados
campos que se supone que no van a variar, aparecerán con el mismo texto introducido anteriormente. Para
conseguir esto tendrás que utilizar algún lenguaje de programación, como Javascript en el lado del cliente
o PHP en el lado del servidor, porque los formularios HTML de manera predeterminada no implementan
esta funcionalidad.
51
< > Programación
8.- Obtener automáticamente los datos que se pueda
Existen diversas tecnologías asociadas al HTML5 que nos pueden ofrecer información del usuario de manera automática y que, en la medida de lo posible, debemos utilizar para minimizar la entrada de datos
por parte del usuario. El más claro ejemplo es la geolocalización, que nos permitiría averiguar dónde está
físicamente ese usuario. De modo que, en vez de obligarle a escribir datos como su país, ciudad, etc. podemos ofrecer que el propio dispositivo defina su localización.
9.- Uso inteligente de los campos INPUT con autocompletar
Cuando debemos utilizar un campo INPUT para entrada de datos, algo que a veces es incluso más indicado
que otras alternativas, siempre que sea posible se debe usar la función de autocompletar. Por ejemplo,
pensemos en un campo país, que tiene más de 150 posibilidades. Podríamos hacerlo en un elemento SELECT, para que el usuario no tenga que teclear el nombre del país, pero puede ser incluso más cómodo un
campo INPUT, en el que escribiendo una o dos letras ya proponga países que las contengan.
10.- Opción para ver la clave escrita en los campos “password”
Los campos donde escribir claves a menudo son un problema por los errores tipográficos, tan habituales
en los teclados virtuales. No es mala idea crear un botón o algún elemento que nos permita ver escrita
en texto plano la clave que el usuario ha escrito en un campo password. Eso debe ser una opción para el
usuario, es decir, que si el usuario no la selecciona, el campo password, debe ocultar la clave escrita para
mayor seguridad.
3.2.2 Redirección y detección de dispositivos móviles
Esta opción permite que el diseño de la página web se visualice correctamente en dispositivos móviles,
re-direccionando automáticamente a los navegadores de los dispositivos móviles para que entren directamente a la versión diseñada específicamente para estos, y que los navegadores de las PC´s de escritorio
entren al sitio normal. Permite que el diseño de la página web se visualice correctamente en dispositivos
móviles
52
< > Programación
3.3 Desarrollo de aplicaciones Web para dispositivos móviles
3.3.1 Consideraciones de diseño
Cuando se trata de diseñar un sitio web para móviles es necesario diseñar la aplicación para que pueda
hacerse uso en dispositivos de diferentes compañías. Uno de los problemas más comunes experimentados
por los diseñadores que trabajan en dispositivos móviles es el conocer cuáles son las proporciones reales
de la pantalla de un dispositivo móvil (Figura 3.2).
El iPhone es de 320 píxeles de ancho por 480 píxeles de alto.
Muchos dispositivos de Nokia N-Series son 240 píxeles de ancho por 320 píxeles de alto.
Los dispositivos más nuevos a menudo apoyan un modo apaisado donde la anchura y la altura se invierte
de forma espontánea.
Los dispositivos de Nokia más populares disponen de pantallas que van de 176 por 208 píxeles hasta 352
por 416 píxeles.
Las resoluciones de pantalla Blackberry variar desde 160 x 160 píxeles hasta a 324 x 352 píxeles.
Figura 3.2
53
< > Programación
3.3.2 Diseño de la interface
Existen muchos modelos de dispositivos, es posible agrupar muchos dispositivos con un ancho de pantalla
similar (Figura3.3) y acabar con cinco grupos con diferentes anchos de pantalla:
Figura 3.3.
NOTA: Las medidas de una pantalla siempre se miden en diagonal y la unidad de medida
es la pulgada
• tiny: 84px, 96px, 101px, 128px, 130px, 132px
• pequeña: 160px, 176px
• medio: 208px, 220px, 240px
• grande: 320px, 360px, 480px o superior (Figura 3.4)
• escritorio: 800px o superior
54
< > Programación
Figura 3.4
Estas agrupaciones son arbitrarias, y los requisitos de un proyecto pueden dictar un conjunto muy diferente. Por ejemplo 320 pixeles para el Iphone y poco más de 240 pixeles para navegadores móviles más
recientes y 128 pixeles para dispositivos más antiguos. La definición de las agrupaciones de dispositivos
realmente se reduce a los objetivos y las necesidades del proyecto.
Cada dispositivo tiene capacidades diferentes, no todos soportan CSS avanzado, manipulación del DOM
y JavaScript. Antes de hacer las agrupaciones comentadas anteriormente, debemos asegurarnos que los
dispositivos móviles son compatibles con las tecnologías que ofrecerá el proyecto Web.
55
www.grupoeduit.com
01 800 808 62 40