viernes, 22 de julio de 2016

Herramientas a cascoporro

Aquí un señor se ha currado una lista bien clasificada con herramientas útiles para devOps...

http://www.devopsbookmarks.com/

Un par de herramientas para el blogger programador

Cuando escribes en un blog sobre informática, y sobre todo cuando escribes sobre programación, lo más normal es que de vez en cuando queramos meter bloques de código. Obviamente no os estoy descubriendo la rueda si os digo que existen herramientas para facilitar esta tarea...

¿siiiii?¡Hala, no fastidies!¿De verdad?...

A ver, esto no es más que una entrada un poco tontuela de retroalimentación; más que nada para saber lo que estoy usando y dónde puedo encontrarlo... SyntaxHighlighter por ejemplo, es una herramienta de código abierto, escrita en JavaScript que nos permite mostrar en nuestras entradas sobre programación esas bonitas ventanitas llenas de código con la sintaxis puesta en plan bonito, con sus colores y tal...

En nuestro caso concreto, dado que Blogger tiene sus limitaciones y restricciones, para poder tenerlo al uso en este blog tuvimos que editar la plantilla e introducir todas las referencias necesarias al servidor que proporciona esta herramienta. Al margen de las explicaciones que puedas encontar en la web de alexgorbatchev.com, este es el código que metimos en nuestra plantilla:

<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/> 
      <link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/> 
      <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js' type='text/javascript'/> 
      <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp.js' type='text/javascript'/> 
      <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCSharp.js' type='text/javascript'/> 
      <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCss.js' type='text/javascript'/> 
      <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js' type='text/javascript'/> 
      <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js' type='text/javascript'/> 
      <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPhp.js' type='text/javascript'/> 
      <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPython.js' type='text/javascript'/> 
      <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushRuby.js' type='text/javascript'/> 
      <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js' type='text/javascript'/> 
      <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushVb.js' type='text/javascript'/> 
      <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js' type='text/javascript'/> 
      <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPerl.js' type='text/javascript'/> 
      <script language='javascript'> 
        SyntaxHighlighter.config.bloggerMode = true;
        SyntaxHighlighter.config.clipboardSwf = &#39;http://alexgorbatchev.com/pub/sh/current/scripts/clipboard.swf&#39;;
        SyntaxHighlighter.all();
      </script>

Como se ver es básicamente una colección de referencias a las diferentes sintaxis aceptadas (las llaman brush), a las hojas de estilo y al JavaScript que dibuja la ventana... ¡Gracias Alex Gorbatchev!

Cuando estamos editando una entrada y queremos poner un bloque de código, vamos a la vista HTML y pegamos nuestro código entre las etiquetas <pre> y </pre>. Una de las propiedades que tiene el atributo CLASS de esta etiqueta es brush. El valor de brush será alguna de las diferentes sintaxis con las que colorearemos nuestro bloque de código:

<pre class="brush:java">
public class Hello {
  public static void main(String[] args) {
    System.out.println("Así pinto el código Java");
  }
}
</pre>

AQUÍ están todas las sintaxis admitidas actualmente por SyntaxHighlighter.

Otra herramienta online que suelo utilizar es este parser, para convertir cualquier bloque de código a HTML. Esto es porque Blogger, por cuestiones de seguridad, no deja introducir determinados fragmentos de código cuando estás escribiendo un post (estos de Google se ponen muy quisquillosos con eso de las inyecciones de código...). Si lo parseamos a HTML y lo metemos entre las etiquetas del SyntaxHighlighter ya tenemos nuestra bonita y didáctica ventanita con nuestro ejemplo de código fuente.