Tutorial Ruby on Rails (Parte 3)

Programación en Ruby on Rails en Microsoft Windows XP, Vista, 7 y 8



En esta parte voy a asumir que ya sabes lo siguiente (asumiendo que leíste las dos partes anteriores):

1. Instalar Ruby on Rails
2. Manejar operaciones importantes desde la consola CMD de Windows (yo usé Microsoft Windows 8 para este tutorial) como migraciones, consultas ActiveRecords, Scaffolding.
3. Conocer consultas ActiveRecords importantes (al menos las que ya se han mencionado en los dos tutoriales anteriores).
4. Crear un proyecto nuevo con ActiveRecords
5. Conocer con precisión las partes del Modelo-Vista-Controlador, al que nos referiremos como MVC.

¿Qué haremos en esta etapa?

Vamos a crear un proyecto usando Scaffolding, pero usando más tipos de datos. Anteriormente habíamos creado un proyecto usando:

rails g scaffold Articulo titulo:string texto:text

Que solo usa los datos string y text. Ahora vamos a usar el resto de componentes de la GUI (Graphic User Interface) que faltan.

El formulario tiene que permitir registrar la siguiente información de un usuario que quiere asistir a una determinada cita, así que debe seleccionar la hora:

·        Nombre
·        Contraseña
·        Correo Electrónico
·        Indicar si es o no estudiante
·        Fecha de nacimiento
·        Hora de la Cita
·        Información adicional

Para ello, descubriremos nuevos tipos de datos:

String
Nombre, password, correo electrónico
Text
Información adicional
Boolean
Es o no estudiante
date
Fecha de nacimiento
Time
Edad

Ejecutemos los siguientes comandos en el cmd:

rails new tutorial002
cd tutorial002
gem install node
rails g scaffold Cita nombre:string password:string correo:string estudiante:boolean nacimiento:date hora:time info:text
rake db:migrate
rails s

Una vez que todo el proceso haya finalizado, entra en la dirección:


En esta ocasión usaré el navegador opera. Usted puede utilizar Mozilla Firefox o Google Chrome, e incluso Safari o cualquiera de su preferencia que cumpla con los estándares.

Como puede ver, se ha creado una nueva página, con todos los campos necesarios.

Damos click a New Citum

Como puede ver, todo el formulario se ha adaptado automáticamente a nuestras necesidades, podemos ver que para el boolean, la vista muestra un Checkbox, mientras que para la fecha de nacimiento es mostrado un conjunto de tres comboboxes, y dos para el caso de la hora.

Así tenemos una uniformidad entre la información de la base de datos, las variables de la clase Cita, y la interfaz gráfica.

Para poder hacer todo esto, normalmente se debe hacer a mano, por un lado la base de datos, por otro lado la clase, y por último la interfaz gráfica. Esta es una de las principales razones por la que Ruby on Rails es un programa altamente recomendado para productividad.

La información es consistente. La construcción de formularios es completamente dinámica, como cuando se programa en PHP, en el que las páginas .html son generadas a partir de PHP.

En este caso las páginas son RENDERIZADAS como HTML a partir de las VISTAS, y toda la información es manejada por el CONTROLADOR, y almacenada/consultada a través del MODELO.


Ahora, lo que vamos a hacer es entrar a la vista Parcial del formulario, para ver cómo están especificados los controladores.


Entramos a la siguiente ruta

·        tutorial002
o   app
§  views
·        cita
o   _form.html.erb

Y nos encontraremos entre el código las líneas mostradas en esta imagen. Lo más importante son las líneas 20, 28, 21, 36 y 40, que tienen los siguientes controladores gráficos:

·        f.text_field
·        f.check_box
·        f.date_select
·        f.time_select
·        f.text_area

Son los que dibujan un checkbox o una lista desplegable. Los combobox acá se llaman select (en realidad no es que “se llaman” sino que los select son el equivalente a los combobox en el GUI de las aplicaciones desktop. También lo puedes interpretar como que son los que se utilizan en este caso).

El nuevo módulo MVC que generamos a través de Scaffolding ha creado estos componentes, sin embargo, nosotros los podemos modificar para que se adapten a nuestros gustos. También para que se adapten a nuestras NECESIDADES, que es la mayor prioridad.

A continuación modificaremos el código con dos propósitos:
1. Mostrar cómo estos controles pueden recibir parámetros para regular su aspecto  comportamiento.
2. Mostrar otros controles gráficos diferentes a los 5 mostrados (exceptuando al botón que es también “uno de ellos”).

Modifiquemos la Text Area, para que tenga diferente tamaño. El Text Area basa su tamaño en un número de columnas (cols en inglés) y filas (rows).

Modifique la línea 40 de _form.html.erb para que quede de la siguiente forma:


Guarde el archivo, vaya al navegador y actualice la página http://localhost:3000/cita/new

El formulario ha cambiado de tamaño. Si usted está en la versión más nueva de Ruby on Rails, también puede haber modificado la línea 40 de la siguiente forma


Que de hecho es más fácil de recordar, y compatible con las nuevas versiones. No use esto si necesita algún tipo de retro compatibilidad, ya que está disponible para las nuevas versiones de Ruby on Rails.

Como puede ver, estos controladores pueden recibir parámetros. Ahora, hagamos que el checkbox para estudiante, esté marcado por defecto.

Modifique la línea 27


Y observe el cambio refrescando la página en el navegador:


Ahora aparece marcado por defecto (o por default como se dice normalmente).

Ahora, si usted se fija en los select de las fechas, hay una limitación en las fechas, de 5 años antes del 2013 y 5 años adelante del 2013, abarcando solo un rango de 11 años


No siempre queremos eso. Queremos tener total control del rango de años que se nos muestren. Modificaremos la línea 32 de la siguiente forma:


Y queda de la siguiente forma:


Con un rango desde 1987 (no hace mucho…) y el 2050, mitad del siglo 21.

Pues bien, toda esta armonía no es simple magia. Hay un archivo que clasifica y relaciona todo. Para encontrar el archivo, ingresa en:

tutorial002
·        db
o   schema.rb



En este archivo se muestran los tipos de datos creados a partir del Scaffolding.


Ahora, entremos un poco a las estructuras de datos relativamente más básicas, los arreglos.

Supongamos que cada estudiante tiene un correo general de una empresa específica, y solo hay 4 empresas disponibles (lo cual es completamente ilógico e impracticable, pero que nos permitirá colocar un select y mostrar como funciona).

Así, el usuario solo puede elegir entre 4 posibles correos electrónicos. Vamos entonces a crear una lista de la siguiente forma:


Es decir, una lista de pares ordenados que asocian una empresa con un correo específico. Las empresas serán las que se muestren, y los correos, los que se guardarán en la base de datos. Dejemos claro que no tiene ningún sentido y sería un gasto de memoria innecesario, que solo es para mostrar los select. El select quedaría de la siguiente forma:


Cambiamos f.text_field por f.select, y además agregamos un parámetro, que es el nombre de la lista recién creada, llamada correos. Actualizamos y el resultado es el siguiente:


En este caso lo que se va a guardar serán los correos, pero a nivel de la vista se muestra este listado de empresas, asociadas con un correo en específico.

Para establecer un elemento como seleccionado por default, se especifica en los atributos (observe que lo que se especifica en selected es el valor, es decir el correo, lo que se guardará en la base de datos, y no la empresa, que se muestra en la vista):


Lo cual muestra ese valor por defecto:


Ahora hagamos lo mismo, pero con otro tipo de controlador, un fieldset con controles de tipo Radiobutton.

Este sería el caso más complejo en relación a los demás, porque tendremos que hacer un for y aplicar valores con índices.

Primero se coloca un fieldset:


Dentro del fieldset se coloca un for:


La palabra correoIterado es inventada, se puede poner cualquiera, solo hará referencia al elemento iterado. Cada elemento iterado tiene la forma {Empresa => email}.

Ahora, agregamos la lógica de creación de interfaz a través de iteraciones:


El código completo queda:



Y la vista final es como se muestra en la imagen. Note que al ser un fieldset, los radiobutton son exclusivos, es decir, solo puede estar seleccionado UNO A LA VEZ. No es lo mismo que un checkbox, el cual permite una selección múltiple.

Aun así, hay formas de lograr que los checkbox puedan ser seleccionados solo uno a la vez, para que tengan un comportamiento similar al de los radiobutton, a cambio de obtener un aspecto que muchos considera más atractivo (es decir, que resulte más atractivo usar un checkbox que un radiobutton).

Algo que también se puede hacer es ordenar alfabéticamente los elementos, o en realidad, aplicar cualquier algoritmo de ordenamiento.

Para ordenarlo, basta aplicar la siguiente línea:


Lo cual muestra ordenado el fieldset:


Este método de ordenamiento también se puede aplicar al selected, y a cualquier lista en general.

Parte 4: Helpers: Algoritmos y expresiones regulares

Para este caso no entraré en detalles ni para los algoritmos, que es un tema de nunca acabar, y tampoco de las expresiones regulares. Este apartado lo que intenta es responder a la siguiente inquietud: “Bueno y ¿Si quiero hacer mis propios algoritmos, donde los pongo?”

Para ello hay una carpeta llamada helpers, dentro de tutorial002/app.

En esa carpeta habrá un helper que corresponda con el MVC, en este caso se llamará cita_helper.rb

Veamos algunos algoritmos básicos, por ejemplo el algoritmo cuadrado. Escribalo en cita_helper.rb


Ahora, llamemos este algoritmo desde _form.html.erb



Y esto imprimirá el cuadrado de 4, es decir 42 = 16


Observe que el algoritmo cuadrado(n) no necesita especificar el tipo, y ni siquiera necesita el uso de la palabra reservada return. Frente a otros lenguajes es mucho más simple.

De hecho es uno de los lenguajes de programación con una sintaxis tan simple junto con el lenguaje Python.

Uno de los fuertes del lenguaje Rails, son las expresiones regulares. Mostraremos un ejemplo de un algoritmo que hace uso de una expresión regular.

El algoritmo recibe una cadena

“1234” à Retorna verdadero
aBCdà Retorna falso
“12cD” à Retorna falso

Que recibe una cadena y verifica si cada elemento de la cadena es un número de base decimal. Este algoritmo retorna verdadero si se cumple dicha condición, o falso si no se cumple.

Existe una gran variedad de expresiones regulares que pueden ser usadas. Para llamar esta función la invocamos en el mismo lugar donde invocamos la anterior:


Esta retornará true porque 1, 2 y 3 son números. Muchas aplicaciones utilizan expresiones regulares para detectar patrones en las cadenas de texto y otros elementos que se agrupan.

Si usted desea que sus métodos funcionen en todos los controladores, prográmelos en el helper principal, de nombre application_helper.rb.

1 comentario:

minortiz dijo...

Excelente publicacion

Publicar un comentario

gmendezm
Portada
Lista Principal