Programación web en la parte de cliente

Asignatura: Programación Web

Consultor y profesor: Vicent Moncho Mas / Carlos Casado Martínez

Durante la asignatura, se han ido haciendo una serie de actividades las cuales han ido abriéndome los ojos a la hora de comprender la teoría pero quizá ha sido la práctica final la que me ha hecho comprender la verdadera potencia del lenguaje Javascript y el tratamiento de los elementos del DOM y BOM.

Etapas y retos

En la primera pac, el reto ha sido entender el lenguaje de javascript y familiarizarse con él mediante unos ejercicios básicos de programación.

Con la pac2, se empezó a hacer código un poco más complejo incorporando conceptos como sería la herencia con su correspondiente creación de clases y objetos. Se trabajó con ciertas funciones específicas del mismo lenguaje fusionado con algo de código html. También, se empezó a hacer uso del tratamiento de eventos trabajando con botones.
Dentro de éste segundo módulo pude observar que aunque javascript es un lenguaje orientado a objetos similar al java, éste tenía ciertas diferencias a la hora de tratar los datos, lo cual me hacía perder el norte en algún momento al codificar algún algoritmo específico.

En la pac3, se empezaba a poner la cosa interesante estudiando los conceptos del BOM y DOM, donde pude aprender la verdadera potencia del lenguaje javascript. Es aquí donde me di cuenta de lo que podría llegar a hacer fusionando, dicho lenguaje, con html. Es cuando descubrí el concepto de páginas web dinámicas.
También, en dicha pac, ha sido donde empecé a codificar con código jQuery trabajando sobre el menú contextual que se pedía.

Fue en la práctica final donde se tuvo que poner toda la carne en el asador utilizando todos los conceptos tratados en el temario para poder llevarla a cabo con éxito.

Ésta práctica nos la entregaron a mediados de curso para que quien lo deseara, pudiese empezar a trabajar en ella. Yo, personalmente, decidí leérmela por encima pero no hacerle mucho caso. Casi todo lo que nos pedían eran conceptos totalmente nuevos para mi y me era imposible pensar que yo podría llegar a codificar lo que me pedían.

Cuando llegó el momento, me sentí preparada. La práctica consistía en crear un espacio web con HTML, CSS y javascript.

Éste tenía que tener un menú que diera acceso a un web que simularía la creación de una carta, y también debía de acceder a otra web que contendría un Slide de imágenes, todo esto enlazado con un menú común en dichas páginas.

Empecé con el tratamiento de la carta. Mediante un formulario que debía rellenar el usuario, se debían pasar los datos correspondientes a la carta para que ésta los pudiera mostrar.

Primero de todo, creé la estructura que iba a tener mi formulario introduciendo el código HTML del mismo y, asimismo, lo complementé con su documento CSS correspondiente. Una vez le di formato a la web, empecé a codificar las validaciones de cada campo. Todos los campos eran obligatorios y depende de lo que se seleccionara en el campo “Mostrar remitente”, se debían visualizar los campos relacionados con el remitente o no.
Esto último repercutiría más tarde, cuando se enviara la información a la carta, por lo tanto, es una de las cosas que se debía tener en cuenta en varias fases de tratamiento de datos.

Después de que toda la información estuviera correctamente introducida por el usuario, al apretar el botón de “Enviar”, se debía visualizar una pantalla con los datos que éste había introducido anteriormente. Para codificar ésta parte, tuve algún que otro contratiempo ya que tenía dudas sobre cómo tenía que pasar la información desde una página a otra. El consultor, Vicent, me facilitó alguna pista de por donde debía tirar, ya que siempre tiendes a verlo más difícil de lo que realmente puede llegar a ser.

Y para finalizar la primera parte de la práctica, ya sólo me quedaba codificar la carta a mostrar con los datos del usuario introducidos con un formato específico que nos facilitaba el enunciado. La dificultad en dicho código se hallaba en el paso de información de una página web a otra de forma externa. El consultor nos dio libertad para usar cualquiera de los tres métodos que nos explican en el temario. En éste caso, yo escogí el tratamiento de cookies. Éste fue un concepto totalmente nuevo para mí, ya que aunque lo utilizaba en el día a día trabajando con los navegadores, nunca pensé realmente trabajaban por dentro.

(Solamente comentar, que en éste apartado de la práctica, llegué a tocar algo de código de JQuery para realizar el borrado de los errores que hubieran mostrados por pantalla y validar el formato correcto de los emails introducidos por el usuario).

La segunda parte de la práctica, consistía en hacer un Slide de imágenes. Éste debía de tener dos botones para navegar por las diferentes imágenes ya insertadas por defecto. Y en la parte inferior debía de tener tantos enlaces como imágenes hubiera en el Slide, y cada uno de ellos debía mostrar su imagen correspondiente en el centro, substituyendo la que hubiera en ése momento.

Aunque tuve algún que otro contratiempo a la hora de tratar qué imagen se debe visualizar en cada momento, pienso que dicha parte, fue más rápida de codificar que la primera.

Conclusiones

En general, considero que la práctica que codifiqué ha sido muy correcta pero se podría haber mejorado el diseño de la misma. La verdad es que si la empiezas a hacer desde el momento que te entregan el enunciado, te da más tiempo a practicar y a diseñar un entorno más amigable y accesible, lo cuál te puede ayudar a consolidar tus conocimientos obtenidos en otras asignaturas relacionadas con programación web (como por ejemplo “lenguajes y estándares web”), y te preparará para encarar la pac3 que en principio, está pensada para trabajar con los elementos html de forma independiente.

Con dicha práctica, y en general, con el estudio de ésta asignatura, se me ha abierto la mente a la hora de trabajar con los elementos html y sus atributos. También he podido aprender cómo se controlan los eventos de los navegadores y de sus documentos específicos. Se me han abierto muchas puertas con la introducción del la librería JQuery de javascript.

Pienso que ésta asignatura te da la base suficiente como para empezar a volar dentro de lo que es éste mundo inmenso como es el del diseño y programación web.

Cita recomendada: HERNANDEZ, Sonia. Programación web en la parte de cliente. Mosaic [en línea], mayo 2014, no. 118. ISSN: 1696-3296. DOI: https://doi.org/10.7238/m.n118.1421.