Syntax Highlighter, presentación de código fuente en tu página web o blog

Si deseas mostrar en tu página web o blog el código fuente de un script o de cualquier aplicación, te encontrarás con el problema de que muchos caracteres, e incluso trozos de código, no aparecerán correctamente al ser interpretados como etiquetas HTML o de un lenguaje de programación (PHP, ASP, JavaScript, etc.).

Cuando escribimos un código fuente en una página, nuestra intención es mostrar todos los elementos que lo forman para que pueda ser comprendido correctamente. Por ello, una solución podría ser traducir a HTML aquellos caracteres que puedan ser malinterpredados por ser equivalentes o formar parte de elementos clave de un determinado lenguaje de programación orientado a páginas web. Por ejemplo, en vez de escribir la etiqueta <body>, podríamos traducir los corchetes a HTML, de tal forma que el resultado sería &lt; body &gt; y el código aparecería sin ser interpretado.

Sin embargo, tenemos a nuestra disposición una herramienta gratuita que además de permitirnos escribir código fuente sin necesidad de traducir ningún caracter, nos lo mostrará de una forma profesional, indicando el número de cada línea y cambiando los colores de los elementos según su función dentro del lenguaje de programación en el que esté escrito.

»

Syntax Highlighter es un proyecto OpenSource de Google Code que nos permite publicar un código fuente de forma sencilla, con un aspecto similar al de cualquier aplicación de desarrollo y cambiando los colores de aquellos elementos clave (funciones, tipos de variables, etc.), para ello, disponemos de librerias Javascript para los distintos tipos de lenguajes de programación (php, asp, javascript, java, c, c++, c-sharp, etc.). Y lo mejor de todo es que cada librería tan sólo ocupa 4kb, por lo que apenas se notará en la carga de la página.

Para poder instalarlo en nuestra página web debemos bajar un paquete con varios ficheros javascript, css y swf. Lo ideal es estructurarlo en tres carpetas, y en cada una de ellas guardar los ficheros correspondientes.

Una vez lo hemos subido a nuestra web, tenemos que añadir en la cabecera de la página el siguiente código:

  


Si el código que vamos a escribir no es de C-Sharp, entonces tendremos que importar la librería correspondiente: shBrushJScript.js, shBrushPhp.js, etc.

Para que nuestro código aparezca correctamente, tendremos que meterlo entre la etiqueta <pre></pre>. Esta etiqueta HTML permite que cualquier texto escrito dentro de ella aparezca con los espacios en blanco que tenga y no se compacten en uno solo. De esta forma, podemos escribir texto tabulado a base de espacios. Además, tendremos que asignar un name="code" y un class a dicha etiqueta. El class dependerá del lenguaje que vayamos a mostrar, ya que establece la relación con la librería javascript correspondiente. Por ello, es importante que no olvidemos importarla. Por ejemplo, si el código es PHP, el class será class="php". Para el resto de lenguajes tenemos las indicaciones en la web del proyecto.

<pre name="code " class="c-sharp">
      ... aquí el código ...
</pre>

El trozo de código podremos copiarlo al portapapeles, abrirlo en una ventana nueva o incluso imprimirlo a través de varios botones situados en la parte superior.

Más info | http://code.google.com/p/syntaxhighlighter/

Sin Comentarios

Yahoo! User Interface Library (YUI), Framework con un extenso catálogo de códigos Javascript y CSS

Yahoo! User Interface Library (YUI), extenso catálogo de códigos Javascript y CSS
La Yahoo! User Interface Library (YUI) es una extenso catálogo con cerca de 300 códigos JavaScript y CSS que podremos usarlos libremente en nuestros proyectos web, ya sean personales o comerciales. Tenemos a nuestra disposición ejemplos, código fuente y documentación relacionada para poder utilizar y personalizar todos los scripts. Podremos consultar la YUI a través del portal de Yahoo para desarrolladores web o bien bajarnos un paquete con todo el material para poder estudiarlo de forma offline.

Los scripts están divididos en categorías según su utilidad: animación, autocompletar, cuentagotas, treeview, DOM, CSS; etc. En total, podemos encontrar hasta 40 categorías distintas con varios scripts cada una que nos permitirán acercarnos a la utilidad de una forma básica o más avanzada.

Si acabas de conocer JavaScript, y deseas aprenderlo más a fondo, este recurso es de gran utilidad, ya que gracias a los ejemplos podremos ver qué utilidades prácticas pueden desarrollarse bajo esta tecnología.

Más info | http://developer.yahoo.com/yui/

Sin Comentarios

Como cambiar de Workspace en WebSphere si ya tenemos uno configurado por defecto

Como cambiar de Workspace en WebSphere si seleccionaste uno por defecto

Esta tarde mientras intentaba cambiar el Workspace (espacio de trabajo)  del WebSphere resultaba que no podía hacerlo ya que anteriormente había activado la opción de elegir por defecto la ruta del workspace, de forma que ya no aparecía la ventana para seleccionarlo al arrancar la aplicación.

Finalmente, después de la búsqueda de una solución sin resultado, me he puesto a revisar todas las opciones de la aplicación, hasta que al final se me ha ocurrido entrar en el directorio y ver si había algún fichero de configuración, y efectivamente, ahí estaba la solución. El fichero en cuestión es wsappdev.ini, que se encuentra en C:\Archivos de Programa\IBM\WebSphere Studio

[Settings]
DefaultWorkspace=<My Documents>\IBM\wsappdev51\workspace
ProductName=IBM WebSphere Studio Application Developer
Version=5.1.1
Full=Yes
KeyName=wsappdev
VMArgs=-X
LUMProductID=1
LUMProductVersion=5.1.1
Website=www.ibm.com/websphere/developer/zones/studio/appdev/

[Environment Variables]

Simplemente eliminamos la segunda línea y al arrancar el WebSphere nos solicitará indicar la ruta del workspace.

DefaultWorkspace=<My Documents>\IBM\wsappdev51\workspace

3 Comentarios

Descarga completo manual de JAVA

En el siguiente enlace podréis descargar una completa guía de 320 páginas del lenguaje JAVA (hasta la versión 1.4). La guía sirve como perfecta introducción al mundo JAVA incluyendo Swing (Java visual para crear UIs), Threads, programación en red, Applets, JDBC, JavaBeans, Servlets y JSP.

Puedes descargar la guía de programación en JAVA desde el siguiente enlace:

Descarga manual completo de JAVA que incluye Swing, Threads, Applets, JDBC, JSP y Servlets.

3 Comentarios

Manuales, tutoriales y ejercicios de Oracle y PLSQL

tutoriales y manuales de PLSQL y SQL para Oracle Probablemente en el proyecto en el que tenga que trabajar los próximos meses será bajo PLSQL, y ¿qué es esto?, es un lenguage de programación que permite realizar consultas complejas a bases de datos.

En el Grado Superior de Desarrollo de Aplicaciones Informáticas imparten una asignatura durante el 2º curso dedicada en exclusiva a Oracle y PLSQL, por lo que en principio controlo algo el tema, pero siempre bien dar un repasito y refrescar los temas. Por esto mismo estoy haciendo una recopilación del material que tengo del curso y tutoriales o manuales que he ido encontrando por la red.

Descarga otras guías, manuales y tutoriales de PL/SQL y Oracle totalmente gratis:

1 Comentario

Librosweb.es, descarga gratis libros de diseño y programación


Libros de diseño y programacion gratis en librosweb.es
Este portal ofrece de forma gratuita varios libros y guías de programación y diseño web. Recientemente han actualizado su biblioteca (que es algo reducida) con una nueva guía de CSS 2.1.

Los e-books que podéis descargar son los siguientes:

Programación web

  • Symfony, la guía definitiva
  • Introducción a AJAX
  • Introducción a JavaScript

Diseño web

  • Introducción a CSS
  • Referencia completa de CSS 2.1
  • Introducción a XHTML

Si queréis descargarlos totalmente gratis entrad en su página web http://librosweb.es

2 Comentarios