Programación
en Ruby on Rails en
Microsoft Windows XP, Vista, 7 y 8
Para programar en Ruby on
Rails primero hay que organizarse con una carpeta
en la que vamos a trabajar.
Usted la puede hacer donde gusto, yo usaré una
ruta genérica.
D:\Programming\RoR\
Este será el directorio de todo lo relacionado con
Ruby on Rails.
Para ello voy a indicar dos cosas:
1.
Aciones:
Haga lo que se indica
2.
Observaciones: Son importantes para
entender las acciones realizadas
Usted puede simplemente seguir las acciones sin
leer las observaciones, pero siempre surgirán dudas que puedan (quizá) ser
aclaradas con las observaciones
Acción
|
Observación
|
Instale
en D:\Programming\RoR\RailsInstaller
|
En esa página vienen instaladores para
otros sistemas operativos.
|
Hay varios tipos de acciones, por ejemplo la
anterior fue instalar. Las acciones pueden ser:
1.
Instale
2.
Ejecute
3.
Cree
4.
Navegue
5.
Edite
6.
Elimine
7.
Renombre
La ejecución se hace a través de la consola. Para
abrir la consola de Windows basta con abrir el archivo cmd.exe
Una vez instalado, crearemos un nuevo proyecto
Acción
|
Observación
|
Ejecute
rails
new proyecto001
en D:\Programming\RoR\
|
rails:
para identificar el comando
new: creación de nuevos archivos
proyecto001: nombre genérico de nuestra
aplicación
|
Esto comenzará a mostrar el proceso, y al final le
quedará una carpeta:
D:\Programming\RoR\proyecto001
También es posible que deba instalar la siguiente
gema (abajo está la explicación de lo que es una gema) para evitar errores:
Acción
|
Observación
|
Ejecute
gem
install node
en D:\Programming\RoR\proyecto001
|
Para evitar un cierto error de rutas, a
muchos les ha salido ese error, se recomienda instalar esta gema.
|
Ahora vamos a aclarar algo, una diferencia entre
Ruby y Rails, y el concepto de gemas (brevemente).
Ruby: Es un lenguaje de programación. Se le pueden
añadir plugins, llamados gemas, que pueden
facilitar la tarea (como las clases reutilizables en lenguajes orientados a
objetos, es decir Java, C++, .NET, etc.)
Rails: Es una gema muy buena, un Framework, que permite trabajar en Ruby con un modelo llamado MVC, modelo vista controlador.
Para trabajar en Ruby on
Rails tenemos que trabajar en el MVC.
Para crear un controlador (controller)
y una vista (view) realice la siguiente acción:
Acción
|
Observación
|
Ejecute
rails
g controller miControlador
miVista
en D:\Programming\RoR\proyecto001
|
La g significa generate.
Usted puede escribir también este mismo comando con la letra generate.
|
Más adelante crearemos un modelo, por ahora
centrémonos en el controlador y la vista.
Ahora, usted puede entrar en las carpetas de proyecto001, el directorio inicial será algo así:
Vamos a centrarnos en las carpetas que están
señaladas.
app:
Es donde se programan los modelos, las vistas y los controladores, además de
otras cosas.
config:
Configuraciones para el comportamiento de la aplicación
public:
Carpeta que tiene los archivos HTML generados.
Vamos a la carpeta app:
Ahí están los componentes del Modelo Vista Controlador.
Tenemos adicionalmente:
·
Assets:
Archivos multimedia.
·
Helpers:
Otros que mencionaremos más adelante.
·
Mailers:
Para enviar correos, también serán mencionados más adelante.
Tenemos los siguientes archivos de interés
·
controllers
o
application_controller.rb
o
mi_controlador_controller.rb
·
views
o
layouts
§ application.html.erb
o
mi_controlador
§ miVista.html.erb
|
Podemos ver que:
1.
Los controladores son extensión rb
2.
Las vistas son extensión erb
Además, antes de la extensión erb,
las vistas tienen la extensión final, por ejemplo si la vista será un archivo
html, esto se indicará nombrando el archivo de la
forma como se muestra en las carpetas.
Ahora, entremos en el navegador web, al sitio
generado actualmente:
Acción
|
Observación
|
Ejecute
rails
server
en D:\Programming\RoR\RailsInstaller
|
También puede ejecutar rails s
|
Retornará una respuesta como la siguiente:
Acción
|
Observación
|
Navegue
Localhost:3000
|
Abra su navegador web e ingrese en la
dirección localhost:3000
3000 es el puerto utilizado
|
Este es el índice que viene por defecto. Este
índice está realmente en esta carpeta:
Si usted ingresa a la carpeta, encontrará los
siguientes archivos y este es el índice que usted vio:
Ahora lo que vamos a hacer es crear nuestro propio
índice. Para ello, hay que editar la vista. Entremos al archivo
·
controllers
o
application_controller.rb
o
mi_controlador_controller.rb
·
views
o
layouts
§ application.html.erb
o
mi_controlador
§ miVista.html.erb
|
Al abrirlo nos encontramos con el siguiente código html
<h1>MiControlador#miVista</h1>
<p>Find
me in app/views/mi_controlador/miVista.html.erb</p>
|
Abramos el archivo mi_controlador_controller.rb
·
controllers
o
application_controller.rb
o mi_controlador_controller.rb
·
views
o
layouts
§ application.html.erb
o
mi_controlador
§ miVista.html.erb
|
Tiene el siguiente código
class
MiControladorController < ApplicationController
def miVista
end
end
|
Como puede ver, uno tiene código HTML (el de la
vista) y el otro tiene código Ruby (el del controlador). Además el
controlador es en realidad una clase que extiende de ApplicationController
y ApplicationController está en esa misma carpeta.
Entonces si usted quiere que todos sus
controladores tengan un determinado comportamiento (métodos) o
características específicas (atributos) esto se generaliza colocando las
modificaciones en ApplicationController.
Pero si solo quiere que afecte a este controlador,
modificará el archivo que hemos abierto.
Ahora bien ¿Dónde está la hoja de estilos y el
código de cabecera el archivo html? Para ello
fijémonos ahora en la ruta assets y en los layouts
·
assets
o
images
o
javascripts
§ application.js
§ mi_controlador.js.coffee
o
stylesheets
§ application.css
§ mi_controlador.css.scss
·
controllers
o
application_controller.rb
o
mi_controlador_controller.rb
·
views
o
layouts
§ application.html.erb
o
mi_controlador
§ miVista.html.erb
|
Si usted abre estos archivos, se dará cuenta de que ahí se encuentra el código de hojas de estilo y los encabezados.
Los encabezados están en application.html.erb:
<!DOCTYPE html>
<html>
<head>
<title>HelloWorld</title>
<%= stylesheet_link_tag "application", :media => "all"
%>
<%= javascript_include_tag "application" %>
<%= csrf_meta_tags %>
</head>
<body>
<header>
<h1>Mi
Header</h1>
</header>
<%= yield
%>
</body>
</html>
|
El código
<%= yield %>
representa todo el contenido de la vista miVista.html.erb
Luego, los siguientes códigos:
<%= stylesheet_link_tag
"application",
:media => "all" %>
<%= javascript_include_tag "application"
%>
Representan la hoja de estilos y los archivos javascript.
Note que los archivos para los javascript
y las hojas de estilo tienen extensiones coffee y scss. Estos son en realidad lenguajes que permiten
abstraerse un poco y crear contenido de forma genérica.
Recordemos que el propósito de Ruby on Rails es facilitar la tarea
del desarrollo tanto en la arquitectura de la aplicación como en los
algoritmos y las estructuras de datos.
También hay que notar que los archivos application, son los que se ejecutan cuando no se ha
creado o especificado una vista con su respectivo controlador.
·
assets
o
images
o
javascripts
§ application.js
§ mi_controlador.js.coffee
o stylesheets
§ application.css
§ mi_controlador.css.scss
·
controllers
o application_controller.rb
o mi_controlador_controller.rb
·
views
o layouts
§ application.html.erb
o mi_controlador
§ miVista.html.erb
|
Cada carpeta tiene su respectivo archivo application, la única que no tiene ese archivo correspondiente, es en mi_controlador. Eso es porque el view se encuentra directamente en public:
Es el archivo index.html
Es la vista principal.
Entonces ahora lo que debemos hacer es redireccionar nuestra aplicación a nuestra propia vista,
para ello entraremos en las carpetas siguientes:
En config busca el
archivo routes.rb busca donde dice
#root :to => 'welcome#index'
|
Quitale
el símbolo de # para descomentarlo y pone el nombre
del controlador y la vista que creamos, quedaría de la siguiente forma:
root
:to => 'mi_controlador#miVista'
|
Voy a hacer una observación para este caso, que me
parece muy relevante. Normalmente los controladores van en plural, y los
modelos en singular. Es decir, si el modelo se llama silla, el controlador se
llama sillas. Si el modelo se llama ciudad, el controlador se llama ciudades.
Lo que pasa es que para este ejemplo se ha usado así para explicarlo mejor.
Usted ha de tomar esto en cuenta cuando realice su propio proyecto.
Ahora, en la otra carpeta, public,
renombre el archivo index.html
index
(borrar).html
O si usted lo desea, bórrelo directamente (yo no
lo quice borrar por si lo necesitaba más adelante,
pero normalmente se puede borrar).
Ahora ya puede probar su página, recuerde que el
servidor debe estar corriendo, eso lo hicimos con este comando:
Acción
|
Observación
|
Ejecute
rails
server
en D:\Programming\RoR\RailsInstaller
|
También puede ejecutar rails s
|
Si usted por alguna razón cerró el servidor,
vuelva a abrirlo y ejecute nuevamente el comando, luego entre a localhost:3000 y verá su página.
Hasta el momento hemos revisado los siguientes
archivos:
·
app
o
assets
§ images
§ javascripts
·
application.js
·
mi_controlador.js.coffee
§ stylesheets
·
application.css
·
mi_controlador.css.scss
o controllers
§ application_controller.rb
§ mi_controlador_controller.rb
o views
§ layouts
·
application.html.erb
§ mi_controlador
·
miVista.html.erb
·
config
o routes.rb
·
public
o index.html
|
Ya podríamos comenzar a programar, pero antes,
crearemos un layout específico para miControlador en views/layouts/mi_controlador_layout.html.erb
El código puede ser algo como lo siguiente:
<!DOCTYPE html>
<html>
<head>
<title>Mi Layout
Title</title>
<%= stylesheet_link_tag "application", :media => "all"
%>
<%= javascript_include_tag "application" %>
<%= csrf_meta_tags %>
</head>
<body>
<header>
<h1>Mi
Layout Header</h1>
</header>
<%= yield
%>
</body>
</html>
|
Ahora, hay que específicarle
al controlador que debe usar este layout, abrimos
el archivo mi_controlador_controller.erb y editamos
su código, agregando la especificación del layout:
class
MiControladorController < ApplicationController
layout 'mi_controlador_layout'
def miVista
end
end
|
Ahora podemos ir a localhost:3000
y ver como se comporta el layout.
El código html de este
archivo html mostrado como un index,
es el siguiente:
<!DOCTYPE html>
<html>
<head>
<title>Mi Layout Title</title> <link href="/assets/application.css?body=1" media="all" rel="stylesheet" type="text/css" /> <link href="/assets/mi_controlador.css?body=1" media="all" rel="stylesheet" type="text/css" /> <script src="/assets/jquery.js?body=1" type="text/javascript"></script> <script src="/assets/jquery_ujs.js?body=1" type="text/javascript"></script> <script src="/assets/mi_controlador.js?body=1" type="text/javascript"></script> <script src="/assets/application.js?body=1" type="text/javascript"></script> <meta content="authenticity_token" name="csrf-param" /> <meta content="J2f7vxqRa4G1jae2DdPaLD7a46nBhxNmjaDgN8KoKoc=" name="csrf-token" /> </head>
<body>
<header> <h1>Mi Layout Header</h1> </header> <h1>MiControlador#miVista</h1> <p>Find me in app/views/mi_controlador/miVista.html.erb</p> </body>
</html>
|
Ahora, vamos a crear un bucle que imprima la
palabra “Hola” 10 veces.
Editamos el archivo miVista.html.erb
<h1>MiControlador#miVista</h1>
<p>Find
me in app/views/mi_controlador/miVista.html.erb</p>
<% 10.times do%>
<p>
Hola</p>
<% end %>
|
Actualizamos la página localhost:3000
(recuerde que el servidor debe estar corriendo sino ejecute “rails server” en el cmd de
Windows) y se imprimirá 10 veces.
Ahora, vamos a convertir la palabra Hola, en una
variable. Para ello, la variable la declaramos en el archivo mi_controlador_controller.rb
class
MiControladorController < ApplicationController
layout 'mi_controlador_layout'
def miVista
@holaVariable =
"hola";
end
end
|
Y ahora editamos en miVista.html.erb
de la siguiente forma:
<h1>MiControlador#miVista</h1>
<p>Find
me in app/views/mi_controlador/miVista.html.erb</p>
<% 10.times do%>
<p><%=
@holaVariable %></p>
<% end %>
|
Y actualizamos localhost:3000
para ver como se imprime hola.
De todo esto podemos sacar unas cuántas
conclusiones:
1.
Tenemos otras opciones de bucles en Ruby,
aparte del while y el for
2.
Estamos usando Camel
Case para declarar las variables, es decir en lugar de hola_variable,
escribimos HolaVariable, pero con la primera letra
en minúscula, holaVariable. Solo la primera palabra
va en minúscula el resto en mayúscula.
3.
Es débilmente tipado.
No tuve la necesidad de indicarle al lenguaje que el tipo de la variable holaVariable era String.
4.
Cuando se hace referencia a una variable se
usa <%=, cuando es un bloque de lógica se usa <% sin el signo igual.
El 10 también puede ser una variable, editando los
archivos como sigue:
mi_controlador_controller.rb
class
MiControladorController < ApplicationController
layout 'mi_controlador_layout'
def miVista
@holaVariable =
"hola";
@diezVariable = 10;
end
end
|
miVista.html.erb
<h1>MiControlador#miVista</h1>
<p>Find
me in app/views/mi_controlador/miVista.html.erb</p>
<% @diezVariable.times
do%>
<p><%=
@holaVariable %></p>
<% end %>
|
Lo cual confirma que es débilmente tipado. Además el camel case
solo es una práctica de buena programación, no es obligatorio utilizarlo.
Vamos a insertar un poco de código de formularios,
pero sin guardar ningún dato, solo recuperándolo.
Creamos una nueva variable en mi_controlador_controller.rb:
class
MiControladorController < ApplicationController
layout 'mi_controlador_layout'
def miVista
@holaVariable =
"hola";
@diezVariable =
10;
@miNombreEnControlador
= params[:miNombreEnVista]
end
end
|
Ahora vamos al archivo miVista.html.erb
y realizamos las modificaciones pertinentes
<h1>MiControlador#miVista</h1>
<p>Find
me in app/views/mi_controlador/miVista.html.erb</p>
<h1>Bienvenido <%= @miNombreEnControlador %></h1>
<%= form_tag :action
=> 'miVista' do %>
<p>Nombre:
</p>
<p><%=
text_field_tag 'miNombreEnVista',
@miNombreEnControlador %></p>
<p><%=
submit_tag 'Registrarse' %></p>
<% end %>
<% @diezVariable.times
do%>
<p><%=
@holaVariable %></p>
<% end %>
|
Hemos agregado unos comandos de formulario. Para
que esto sea funcional, necesitamos entrar a config/routes.rb y luego descomentar
una línea:
match ':controller(/:action(/:id))(.:format)'
|
Esto permitirá que al ejecutar nuestro formulario,
el navegador nos devuelva la respuesta en la ruta: http://localhost:3000/mi_controlador/miVista
Ahora nos aparecerá un pseudo
formulario, un cuadro de texto en realidad
Si usted escribe su nombre y le da registrarse, el
formulario imprimirá
Lo que acabamos de hacer es la forma básica de
recuperar un dato a partir de un formulario.
Ahora vamos a guardar ese dato creando un modelo.
Vamos a partir de acá, cerrando el servidor (la
ventana de cmd de Windows en la que corre el servidor,
que fue cuando ejecutamos el comando rails server)
y creando nuestro modelo.
Abrimos la ventana cmd y
ejecutamos
Acción
|
Observación
|
Ejecute
rails
g model miModelo
en D:\Programming\RoR\
|
El modelo sirve para almacenar las
estructuras de datos.
|
Ahora en la carpeta db
Se encuentran archivos de bases de datos a migrar,
la ruta a seguir es algo similar a la siguiente:
·
db
o
migrate
§ 20130122151734_create_mi_modelos.rb
o
development.sqlite3
La base de datos usada por lo tanto es una base de
datos sqlite. No borre el archivo development.sqlite3
antes de migrar.
También podemos encontrar un nuevo modelo en la
carpeta de app
·
app
o
models
§ mi_modelo.rb
Vamos a modificar el que está en migrate. Agreguemos un atributo miNombreEnModelo
que pueda ser referenciado, más adelante desde nuestro controller.
class
CreateMiModelos < ActiveRecord::Migration
def change
create_table :mi_modelos
do |t|
t.string : miNombreEnModelo
t.timestamps
end
end
end
|
Y vamos a indicar que el atributo :miNombreEnModelo es accesible, para ello vamos al otro
archivo de modelo, mi_modelo.rb y agregamos lo
siguiente:
class
MiModelo < ActiveRecord::Base
attr_accessible :miNombreEnModelo
end
|
Una vez hecho esto abrimos el cmd
y escribimos:
Acción
|
Observación
|
Ejecute
rake
db:migrate
en D:\Programming\RoR\
|
Para migrar
|
Una vez terminado de haberse ejecutado el comando,
note que el archivo development.sqlite3 ha sido creado nuevamente.
Ahora vamos a hablar de algunos comandos para
almacenar y recuperar datos. Para verificar la cantidad de datos de tipo MiModelo hay en la base de datos, ejecute el comando
MiModelo.all
Verá que, inicialmente, no contiene ningún dato.
Usted puede crear una variable de tipo MiModelo de la forma siguiente
loquesea
= MiModelo.new
luego puede acceder a los atributos fácilmente
loquesea.miNombreEnModelo
= “Geovanny Méndez Marín”
Y luego puede salvar un objeto de tipo MiModelo en la base de datos con el comando
Loquesea.save
Podemos probar esto en la consola de la siguiente
manera:
Acción
|
Observación
|
Ejecute en modo rails
console
MiModelo.all
en D:\Programming\RoR\
|
Retorna que está vacío
|
Acción
|
Observación
|
Ejecute en modo rails
console
loquesea
= MiModelo.new
en D:\Programming\RoR\
|
Crea una nueva instancia de tipo MiModelo
|
Acción
|
Observación
|
Ejecute en modo rails
console
loquesea.miNombreEnModelo
= “tu nombre”
en D:\Programming\RoR\
|
Asigna al atributo un valor y lo guarda
temporalmente en la instancia
|
Acción
|
Observación
|
Ejecute en modo rails
console
loquesea.save
en D:\Programming\RoR\
|
Guarda la instancia en la base de datos
|
Ya hemos visto como interactuar con la base de
datos en la consola, es relativamente accesible.
Ahora vamos a tomar el formulario que habíamos
creado, y lo vamos a convertir en un “guarda nombres”. Vamos a usar el bucle
que antes imprimía 10 veces hola, para imprimir todos los nombres de todos
los objetos almacenados en la tabla MiModelo de la
base de datos sqlite3.
Primero que nada, vamos a salir del modo consola:
Acción
|
Observación
|
Ejecute en modo rails
console
exit
en D:\Programming\RoR\
|
Se sale del modo consola
|
Limpiamos la pantalla de la consola:
Acción
|
Observación
|
Ejecute
cls
en D:\Programming\RoR\
|
Limpia la pantalla
|
Corremos el servidor
Acción
|
Observación
|
Ejecute
rails
server
en D:\Programming\RoR\
|
También puede escribir rails s
|
Ahora modificaremos los archivos de la siguiente
forma:
mi_controlador_controller.rb
class
MiControladorController < ApplicationController
layout 'mi_controlador_layout'
def miVista
@miNombreEnControlador
= params[:miNombreEnVista]
@nombresDesdeControlador
= MiModelo.all
@instanciaMiModelo
= MiModelo.create({miNombreEnModelo:
@miNombreEnControlador})
end
end
|
Observe que hemos eliminado las variables creadas
anteriormente para el bucle, porque ya no nos servirían, dejando solo la
variable miNombreEnControlador.
@nombresDesdeControlador
Realiza una consulta de todos los elementos en la
tabla MiModelo
@instanciaMiModelo = MiModelo.create({miNombreEnModelo:
@miNombreEnControlador})
Crea una instancia con el valor recibido desde el
formulario miNombreEnControlador, en el atributo miNombreEnModelo.
Ahora modificamos el formulario:
miVista.html.erb
<h1>Bienvenido <%= @miNombreEnControlador %></h1>
<%= form_tag :action
=> 'miVista' do %>
<p>Nombre:
</p>
<p><%=
text_field_tag 'miNombreEnVista',
@miNombreEnControlador %></p>
<p><%=
submit_tag 'Registrarse' %></p>
<% end %>
<% @nombresDesdeControlador.each
do |elemento| %>
<p><%=
elemento.miNombreEnModelo %></p>
<% end %>
|
Ahora si usted va al formulario e intenta guardar
información esta se imprimirá con el bucle.
Note que en el bucle, la palabra |elemento| puede
ser sustituida por alguna de su preferencia.
No hay comentarios:
Publicar un comentario