martes, 17 de diciembre de 2013

Otra forma de crear contenido HTML - CGI de Perl



Interesante: Vídeo Tutorial del CGI de Perl

Interesante: Vídeo Tutorial del lenguaje Perl

Ahora que ya sabemos como crear un documento HTML con CGI, pero no está de más, utilizar las herramientas(métodos) que nos ofrece CGI. 

En el capítulo anterior creamos un documento HTML a través del comando print e indicando en cada string cada etiqueta html que compone el documento HTML, pero esta no es la única forma de crear documentos HTML con CGI, a continuación vamos a construir un documento HTML a partir de una serie de métodos que proporciona CGI que nos permitirá ir construyendo cada elemento del DOM HTML de un modo bastante práctico.

Lógicamente si no sabes html, no te vas a enterar de nada y por supuesto si no conoces el lenguaje perl aun menos. Para estudiar el lenguaje Perl os puedo recomentar un tutorial donde podréis conocer el lenguaje de un modo práctico ...  Tutorial Perl

O bien ver el vídeotutorial ... Vídeotutorial de perl

Y aquí podéis ver un vídeotutorial de HTML ... Vídeotutorial HTML

Dicho todo esto, en el siguiente ejemplo podréis ver como crear un documento HTML, con el head  y sus elementos ... meta, link, script, etc., e igualmente el body con distintos elementos como ... h1, p, label, br, strong, ul li, table, img

Abre el editor de código y guárdalo en la carpeta cgi-bin con el nombre de index-2.cgi y ejecútalo en el navegador, la ruta en mi caso es http://localhost/tutorial-cgi/cgi-bin/index-2.cgi ...


#!"C:\xampp\perl\bin\perl.exe" 

use CGI;

$cgi = new CGI;

print $cgi->header("text/html");

print $cgi->start_html(
-head=>$cgi->Link({-rel=>'shortcut icon', -href=>'../imagenes/icon.ico'}),
-title => "Hola mundo",
-author => 'JqueryManual@hotmail.com',
-encoding => "UTF-8",

-meta => {"description" => "Esta es la descripción", 
          "keywords" => "Palabras, clave", 
		  "language" => "Spanish",
		  "robots" => "All"},
		  
-style => [{"src" => "../style/style-1.css"}, {"src" => "../style/style-2.css"}],
-script =>	[{"src" => "../script/script-1.js"}, {"src" => "../script/script-2.js"}],
);

print $cgi->h1({"class" => "titulo-h1", "id" =>"titulo-h1"}, "Este es un título H1") . "\n";

print $cgi->p({"class" => "parrafo", "id" => "parrafo"}, "Este es un párrafo") . "\n";

print $cgi->label({"for" => "etiqueta"}, "Esta es una etiqueta") . "\n";

print $cgi->br() x 2 . "\n"; #dos saltos de línea

print $cgi->strong("Y a continuación una lista ...") . "\n";

print $cgi->br() . "\n";

print $cgi->ul($cgi->li({"class" => "lista", "id" => "lista"}, ["uno", "dos", "tres", "cuatro"])) . "\n";

print $cgi->table(
{"class" => "tabla", "id" => "tabla", "cellpadding" => "10", "border" => "1"},


$cgi->Tr
([
$cgi->th(["Nombre", "Email", "Edad"]) . "\n",
$cgi->td(["Pepito", 'pepito@mail.com', "30"]) . "\n",
$cgi->td(["Cantinflas", 'cantinflas@mail.com', "50"]) . "\n",
$cgi->td(["Bartolo", 'bartolo@mail.com', "25"]) . "\n"
])
) . "\n";

print $cgi->img({"src" => "http://pnvtech.com/images/perl-applicataions.jpg"}) . "\n";

print $cgi->br() x 4 . "\n"; #cuatro saltos de línea

print $cgi->end_html();





Bueno, como podéis ver se ha creado el documento html, si queréis podéis echarle un vistazo al código fuente de la página, para ver como queda estructurado.

El uso de un modo u otro ya depende del programador, si prefieres escribir los tags html directamente como en el primer capítulo ... http://jquery-manual.blogspot.com.es/2013/12/creando-mi-primer-script-cgi-de-perl.html, pues, es tan válido como el de este capítulo, aunque sí es recomendable, saber hacerlo de ambas formas.