Joel Gómez

¿Qué es un Framework?
Es un conjunto de herramientas que están integradas o hacen comunicación entre sí para la resolución de un trabajo en
particular.

¿Qué es MVC?
Es una metodología o estilo para construir aplicaciones que divide la implementación en “Modelo”, “Vista” y “Controlador”. El modelo es la representación de la información con el cual el sistema opera. La vista representa el modelo en un formato de salida para interactuar con el usuario (GUI). El controlador es la parte del sistema que responde a eventos del usuario e interactúa con el modelo con la información de entrada.

¿Qué es Catalyst Web Framework?
Es un Framework de código libre para aplicaciones web programado en Perl y hace uso de MVC. Catalyst no es un lenguaje de programación, es un Framework que integra un sin fin de módulos de Perl.

Instalando Catalyst Web Framework
Existen al menos dos maneras de instalarlo:
1.- Haciendo uso de los repositorios de su distribución:

# aptitude install libcatalyst-perl libcatalyst-engine-apache-perl
libcatalyst-model-cdbi-perl libcatalyst-modules-extra-perl
libcatalyst-modules-perl libcatalyst-view-tt-perl

Con el comando anterior estamos instalando tanto el Framework como algunos módulos extras para la conexión a bases de datos y generadores de vistas como Helpers

2.- Haciendo uso de CPAN

cpan -i Catalyst::Runtime Catalyst::Devel Task::Catalyst
Catalyst::Model::DBIC::Schema Catalyst::View::TT
DBD::SQLite DBIx::Class

Si es la primera vez que ejecutas CPAN entonces, éste le hará una serie de preguntas que no son del otro mundo y a las mayoría de las preguntas basta con darle <enter>

Comencemos entonces usar Catalyst

Lo primero que debemos hacer es ejecutar el siguiente comando para crear nuestro proyecto (por seguridad, no ejecute ningún comando de Catalyst como root ni tampoco edite los archivos como root):

# catalyst.pl evento

Tendremos como resultado lo siguiente:

created "evento"
created "evento/script"
created "evento/lib"
created "evento/root"
created "evento/root/static"
created "evento/root/static/images"
created "evento/t"
created "evento/lib/evento"
created "evento/lib/evento/Model"
created "evento/lib/evento/View"
created "evento/lib/evento/Controller"
created "evento/evento.conf"
created "evento/lib/evento.pm"
created "evento/lib/evento/Controller/Root.pm"
created "evento/README"
created "evento/Changes"
created "evento/t/01app.t"
created "evento/t/02pod.t"
created "evento/t/03podcoverage.t"
created "evento/root/static/images/catalyst_logo.png"
created "evento/root/static/images/btn_120x50_built.png"
created "evento/root/static/images/btn_120x50_built_shadow.png"
created "evento/root/static/images/btn_120x50_powered.png"
created "evento/root/static/images/btn_120x50_powered_shadow.png"
created "evento/root/static/images/btn_88x31_built.png"
created "evento/root/static/images/btn_88x31_built_shadow.png"
created "evento/root/static/images/btn_88x31_powered.png"
created "evento/root/static/images/btn_88x31_powered_shadow.png"
created "evento/root/favicon.ico"
created "evento/Makefile.PL"
created "evento/script/evento_cgi.pl"
created "evento/script/evento_fastcgi.pl"
created "evento/script/evento_server.pl"
created "evento/script/evento_test.pl"
created "evento/script/evento_create.pl"

Nos cambiamos a la carpeta que nos acaba de crear que es el mismo nombre del proyecto que se creó en el catalyst

# cd evento

# tree

.
|-- Changes
|-- Makefile.PL
|-- README
|-- evento.conf
|-- lib
|   |-- evento
|   |   |-- Controller
|   |   |   `-- Root.pm
|   |   |-- Model
|   |   `-- View
|   `-- evento.pm
|-- root
|   |-- favicon.ico
|   `-- static
|       `-- images
|           |-- btn_120x50_built.png
|           |-- btn_120x50_built_shadow.png
|           |-- btn_120x50_powered.png
|           |-- btn_120x50_powered_shadow.png
|           |-- btn_88x31_built.png
|           |-- btn_88x31_built_shadow.png
|           |-- btn_88x31_powered.png
|           |-- btn_88x31_powered_shadow.png
|           `-- catalyst_logo.png
|-- script
|   |-- evento_cgi.pl
|   |-- evento_create.pl
|   |-- evento_fastcgi.pl
|   |-- evento_server.pl
|   `-- evento_test.pl
`-- t
|-- 01app.t
|-- 02pod.t
`-- 03podcoverage.t

Con el comando “tree” nos muestra un árbol de directorios y archivos que están dentro de la carpeta evento (si no tienes el comando “tree” basta con instalarlo con: aptitude install tree)

En este momento ya podremos ver nuestro servidor de Catalyst ejecutando, hacemos el siguiente comando:

# script/evento_server -r

En nuestro navegador colocamos la siguiente direccion: http://localhost:3000 y nos mostrará la página de bienvenida de Catalyst

La opción -r es para que cuando modifiquemos un archivo del Framework que requiera reiniciar el servidor no lo tengamos que hacer nosotros mismo sino que Catalyst lo reiniciará automáticamente.

Pasemos ahora a crear un Controlador:

# script/evento_create.pl Controller registro

exists "/home/joelgomez/evento/script/../lib/evento/Controller"
exists "/home/joelgomez/evento/script/../t"
created "/home/joelgomez/evento/script/../lib/evento/Controller/registro.pm"
created "/home/joelgomez/evento/script/../t/controller_registro.t"

Con nuestro servidor iniciado podremos colocar la siguiente dirección: http://localhost:3000/registro y nos mostrará una página web con:
Matched evento::Controller::registro in registro.

Esto, a parte de decirnos que vamos por buen camino, nos está diciendo lo que está programado en la controladora registro en el método index:

24 sub index : Path : Args(0) {
25     my ( $self, $c ) = @_;
26
27    $c->response->body(‘Matched evento::Controller::registro in registro.‘);
28 }

Nuestra controladora creada está ubicada en lib/evento/Controller y desde allí vamos a crear todos los método necesarios para nuestra aplicación.

Creación de vistas.
Para crear una vista es algo parecido a como hemos creado la controladora, vamos a usar TTSite como Helper, puesto que éste es mas flexible y usarlo es divertido, aunque tiene algunas limitaciones que más adelante iré detallando

# script/evento_create.pl View participante TTSite

exists "/home/joelgomez/evento/script/../lib/evento/View"
exists "/home/joelgomez/evento/script/../t"
created "/home/joelgomez/evento/script/../lib/evento/View/participante.pm"
created "/home/joelgomez/evento/script/../root/lib"
created "/home/joelgomez/evento/script/../root/src"
created "/home/joelgomez/evento/script/../root/lib/config"
created "/home/joelgomez/evento/script/../root/lib/config/main"
created "/home/joelgomez/evento/script/../root/lib/config/col"
created "/home/joelgomez/evento/script/../root/lib/config/url"
created "/home/joelgomez/evento/script/../root/lib/site"
created "/home/joelgomez/evento/script/../root/lib/site/wrapper"
created "/home/joelgomez/evento/script/../root/lib/site/layout"
created "/home/joelgomez/evento/script/../root/lib/site/html"
created "/home/joelgomez/evento/script/../root/lib/site/header"
created "/home/joelgomez/evento/script/../root/lib/site/footer"
created "/home/joelgomez/evento/script/../root/src/welcome.tt2"
created "/home/joelgomez/evento/script/../root/src/message.tt2"
created "/home/joelgomez/evento/script/../root/src/error.tt2"
created "/home/joelgomez/evento/script/../root/src/ttsite.css"

Debemos aclarar varias cositas hasta ahora: nuestros templates o vistas se almacenarán en root/src allí podremos crear las carpetas que nos sean necesarias para organizar mejor las vistas en caso de que la aplicación sea bastante grande. Vamos a crear un template llamado participante.tt2 y lo vamos a guardar en root/src/participante, por supuesto que la carpeta participante la tenemos que crear

# mkdir root/src/participante
# cd root/src/participante
# vim participante.tt2

Dentro de archivo participante.tt2 escribimos lo siguiente:

1 <p>Hola: [% nombre %] </p>

[% nombre %] Template Toolkit, esto nos ayudará bastante en el pase de variables desde la controlador hacia la vista, pueden echarle un vistazo desde su sitio oficial: http://template-toolkit.org/docs/index.html

Ahora, en nuestra controladora registro.pm ubicada en lib/evento/Controller escribimos el siguiente código debajo de la subrutina index:

30 sub saludo : Local {
31     my ( $self, $c) = @_;
32
33     $c->stash->{template} = “participante/participante.tt2“;
34     $c->stash->{nombre}   = “Joel Gómez“;
35 }

En nuestro navegador colocamos la siguiente dirección: http://localhost:3000/registro/saludo Nótese que la url se descompone como servidor/controlador/método.

En nuestra subrutina saludo lo que estamos haciendo es diciéndole a Catalyst cual es la vista que va a usar para ese método y paso una variable llamada nombre para la vista.

Hasta aquí el primer tutorial de Catalyst Web Framework, en la siguente entrega voy a modificar el Helper TTSite y empezaremos a programar las vistas.

Descargue el ejemplo Aquí