<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Ubicuos.com &#187; Programación</title>
	<atom:link href="http://www.ubicuos.com/temas/programacion/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.ubicuos.com</link>
	<description>Tecnología,Programación, Proyectos, Ciencia y Empresas</description>
	<lastBuildDate>Tue, 06 Sep 2011 01:01:10 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=</generator>
		<item>
		<title>Algoritmos Genéticos</title>
		<link>http://www.ubicuos.com/2011/09/05/algoritmos-geneticos/</link>
		<comments>http://www.ubicuos.com/2011/09/05/algoritmos-geneticos/#comments</comments>
		<pubDate>Tue, 06 Sep 2011 01:00:46 +0000</pubDate>
		<dc:creator>fernandomt_08</dc:creator>
				<category><![CDATA[Ciencia]]></category>
		<category><![CDATA[Cómputo Evolutivo]]></category>
		<category><![CDATA[General]]></category>
		<category><![CDATA[Programación]]></category>
		<category><![CDATA[Algoritmos]]></category>
		<category><![CDATA[Algoritmos geneticos]]></category>
		<category><![CDATA[computo evolutivo]]></category>
		<category><![CDATA[inteligencia articial]]></category>
		<category><![CDATA[optimizacion]]></category>
		<category><![CDATA[optimizacion numerica]]></category>

		<guid isPermaLink="false">http://www.ubicuos.com/?p=2805</guid>
		<description><![CDATA[Cuentále a tus amigos en Facebook Como estudiante de Ingeniería en Sistema Computacionales he encontrado una gran pasión por el tema de Algoritmos Evolutivos, hace poco tiempo leí una serie de libros relacionados con el tema y tomé nota de esas lecturas. Aquí les presento esas notas con referencias completas de los libros consultados, en [...]]]></description>
			<content:encoded><![CDATA[<div align="left" style="padding: 0px 5px 5px 0px; clear: left; float: left;"><a name="fb_share" type="button_count" share_url="http://www.ubicuos.com/2011/09/05/algoritmos-geneticos/">Cuentále a tus amigos en Facebook</a></div><div class="tweetmeme_button" style="float: left; margin-left: 10px;width:90px">
			<a href="http://api.tweetmeme.com/share?url=http%3A%2F%2Fwww.ubicuos.com%2F2011%2F09%2F05%2Falgoritmos-geneticos%2F"><br />
				<img src="http://api.tweetmeme.com/imagebutton.gif?url=http%3A%2F%2Fwww.ubicuos.com%2F2011%2F09%2F05%2Falgoritmos-geneticos%2F&amp;style=compact&amp;b=2" height="61" width="50" /><br />
			</a>
		</div>
<table>
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
<p style="text-align: center;"><a href="http://www.ubicuos.com/2011/09/05/algoritmos-geneticos/karger_group_banner/" rel="attachment wp-att-2856"><img class="aligncenter size-full wp-image-2856" title="Karger_Group_Banner" src="http://www.ubicuos.com/wp-content/uploads/2011/09/Karger_Group_Banner.jpg" alt="" width="499" height="65" /></a></p>
<p style="text-align: center;">Como estudiante de Ingeniería en Sistema Computacionales he encontrado una gran pasión por el tema de Algoritmos Evolutivos, hace poco tiempo leí una serie de libros relacionados con el tema y tomé nota de esas lecturas. Aquí les presento esas notas con referencias completas de los libros consultados, en esta ocasión el post es enfocado al paradigma más conocido dentro de los algoritmos evolutivos: <strong>Algoritmo Genéticos.</strong><a href="http://www.ubicuos.com/2011/09/05/algoritmos-geneticos/evolvev2df2003621/" rel="attachment wp-att-2806"><img class="size-full wp-image-2806 aligncenter" title="evolveV2DF2003621" src="http://www.ubicuos.com/wp-content/uploads/2011/09/evolveV2DF2003621.gif" alt="" width="529" height="249" /></a></p>
<p><strong>Introducción</strong></p>
<p>Durante los últimos treinta años ha crecido el interés en sistemas basados en los principios de la evolución y herencia naturales, para resolver cierto tipo de problemas, dichos sistemas mantienen una población de soluciones potenciales, tienen algún proceso de selección basado en la aptitud de los individuos y algunos operadores &#8220;genéticos&#8221;. Las Estrategias Evolutivas son un tipo de esos sistemas i.e., algoritmos que imitan los principios de evolución natural para problemas de optimización por parámetros. La programación evolutiva de Fogel es una técnica por búsqueda a través de un espacio de pequeñas máquinas de estados finitos. Otro tipo de sistemas basados en la evolución natural son los Algoritmos Genéticos de Hollman. En 1990 Koza propusó otro tipo de sistemas, la Programación Genética, para buscar el programa computacional más apto para resolver un problema en particular. [1, pp. 1].</p>
<p><strong>Orígenes</strong></p>
<p>Los algoritmos genéticos son una técnica de búsqueda y optimización basada en los principios de la genética y la selección natural.Un algoritmo genético mantiene una población de varios individuos que evolucionan a un estado, bajo reglas especificadas, para maximizar la “aptitud&#8221; (i.e., maximizar el costo de una función). [2]Los algoritmos genéticos únicamente maximizan, pero la minimización puede realizarse fácilmente utilizando el recíproco de la función maximizante (debe cuidarse, por supuesto, que el recíproco de la función no genere una división por cero) ,i.e. si el problema es minimizar una función <em>f</em> esto es equivalente a maximizar una función <em>g</em> donde <em>g = -f</em>:</p>
<p><img class="alignnone" src="http://www.codecogs.com/gif.latex?%5Ctextit%7Bmin%20f%28x%29%20=%20max%20g%28x%29%20=%20%20max%5C%7B%20-f%28x%29%5C%7D%7D" alt="" width="276" height="19" /></p>
<p>Una definición bastante completa de un algoritmo genético es la propuesta por J. Koza [3, pp. 819]:</p>
<blockquote><p>Es un algoritmo matemático altamente paralelo que transforma un conjunto de objetos matemáticos individuales con respecto al tiempo usando operaciones modeladas de acuerdo al principio Darwiniano de reproducción y supervivencia del más apto, y tras haberse presentado de forma natural una serie de operaciones genéticas de entre las que destaca la recombinación sexual. Cada uno de estos objetos matemáticos suele ser una cadena de caractéres (letras o números) de longitud fija que se ajusta al modelo de las cadenas de cromosomas, y se les asocia con una cierta funci\&#8217;on matem\&#8217;atica que refleja su aptitud.</p>
<p>&nbsp;</p></blockquote>
<p>Estos algoritmos son muy probablemente los tipo de algoritmos evolutivos más ampliamente conocidos al día de hoy, recibiendo notable atención en todo el mundo. Probablemente el primer predecesor de éstos algoritmos surgió del trabajo de Fraser, un biólogo quien quería simular el proceso de evolución, con especial énfasis en la interacción de la epistasis(Un fenómeno, en el cual, las características de un gen son modificados por uno ó más genes) con selección. Trabajos similares a los de Fraser fueron resumidos por Goldberg [4, pp. 89-103].</p>
<p>Sin embargo, los algoritmos genéticos en su forma usual fueron desarrollados por Holland, científico computólogo y psicólogo de la Universidad de Michigan. En 1975 él resumió su trabajo en “adaptive and reproductive plans” un libro que sirve como el punto inicial de las primeras aplicaciones e implementaciones de algoritmos genéticos [4]. Mientras los biólogos intentaban simular evolución usando algoritmos genéticos, Holland estudiaba como éste tipo de algoritmos podrían ser combinados con problemas que ocurren en campos de aplicación práctica [5, pp. 106-107].</p>
<p>Los AG&#8217;s toman prestado cierto vocabulario de la genética. Se habla de individuos (o genotipos) en una población, algunas veces esos individuos son llamados cadenas o cromosomas, esto podría ser un poco confuso, para aclararlo veamos la siguiente explicación:</p>
<p>Cada célula de todo organismo de una especie dada acarrea un cierto número de cromosomas ( el hombre, por ejemplo, tiene 46 de ellos), sin embargo, aquí se hablará de individuos con un solo cromosoma, i.e. cromosomas haploides. Los cromosomas a su vez están formados de genes (también conocidos como características, caracteres ó decodificadores) organizados en sucesión lineal; cada gen controla la herencia de una o más características. Los genes de ciertas características esta colocados en ciertos lugares del cromosoma, a esta posición se le conoce como loci(posición dentro de la cadena).</p>
<p>Cada característica de los individuos (como el color de su cabello) puede manifestarse de diferentes maneras, se dice entonces que el gen puede estar en varios estados, llamados alelos.</p>
<p>Cada genotipo(un único cromosoma) representaría una posible solución a un problema, un proceso de evolución se ejecuta sobre una población de cromosomas correspondientes a una búsqueda a través de un espacio de soluciones potenciales. Por lo que una búsqueda requiere balancear dos objetivos (aparentemente conflictivos): explotar las mejores soluciones y explorar el espacio de búsqueda [6 pp. 61-73].</p>
<p><strong>El Algoritmo Genético Canónico</strong></p>
<p>El AG comienza, como cualquier otra técnica de optimización, definiendo las variables de optimización, la función mediante la cual se evaluarán las variables y el costo. Éste termina también como otros algoritmos de optimización, haciendo pruebas de convergencia. En la fase intermedia, sin embargo, el algoritmo es un poco diferente. En la figura 1 se muestra una ruta a través de los componentes de un algoritmo genético “canónico” o estándar [2, pp. 52].</p>
<div id="attachment_2827" class="wp-caption aligncenter" style="width: 441px"><a href="http://www.ubicuos.com/2011/09/05/algoritmos-geneticos/ag_alg/" rel="attachment wp-att-2827"><img class="size-full wp-image-2827" title="AG_Alg" src="http://www.ubicuos.com/wp-content/uploads/2011/09/AG_Alg.png" alt="Estructura general de un algoritmo genético" width="431" height="548" /></a><p class="wp-caption-text">Estructura general de un algoritmo genético</p></div>
<p>El siguiente paso es generar una población inicial compuesta por cadenas ó cromosomas de longitud <em>L</em>, generalmente ésta se inicia aleatoriamente, diversas formas de inicializar una población pueden encontrarse en [3]. Cada miembro de dicha población es representado de acuerdo al problema, pero podemos encontrar tres tipos de representaciones comunes [7]:</p>
<ul>
<li><strong>Representación Binaria</strong>: Cada gen es un valor de 0 ó 1.</li>
<li><strong>Representación Entera</strong>: Cada gen es un valor entero.</li>
<li><strong>Representación Real</strong>: Cada gen es un valor real.</li>
</ul>
<p><strong>Operadores Genéticos</strong></p>
<p>Después de crear la población inicial, cada cromosoma es evaluado y se le asigna un valor de aptitud. Es importante distinguir entre lo que se conoce como una función de evaluación y una función aptitud; la función de evaluación, o función objetivo, proporciona una medida del desempeño con respecto a un conjunto de parámetros. La función aptitud transforma esa medición en asignación de oportunidades de reproducción para el individuo. La evaluación de una cadena es independiente de la evaluación de cualquier otra cadena. La aptitud, sin embargo, es siempre definida con respecto a otros miembros de la población actual.</p>
<p><strong>Selección</strong></p>
<p>La selección es la etapa del algoritmo genético en la cual individuos o cromosomas se eligen de una población para su posterior reproducción (recombinación y/o cruce).</p>
<p>Fundamentalmente, pueden considerarse 3 esquemas de selección, aunque existe múltiples esquemas distintos a estos, así como innumerables combinaciones de aspectos de estos tres mecanismos fundamentales. A continuación se describe cada uno de ellos:</p>
<p><em><strong>Ruleta o Seleccion proporcional</strong></em>: Con este método la probabilidad que tiene un cromosoma de reproducirse es proporcional a su valor de función de evaluación, es decir, a su adaptación. Una vez calculadas estas probabilidades, la selección de los individuos para reproducirse es aleatoria según estos valores. El algoritmo propuesto por Goldberg(1989) es el siguiente:</p>
<ul>
<li><strong>Construcción de la ruleta: </strong>Calcular el valor de aptitud <em>eval(u)</em> <img src="http://www.codecogs.com/gif.latex?eval%28$u_%7Bi%7D$%29%7D" alt="http://www.codecogs.com/gif.latex?eval($u_{i}$)}" /> para cada cromosoma de la población actual <img src="http://www.codecogs.com/gif.latex?u_%7Bi%7D" alt="http://www.codecogs.com/gif.latex?u_{i}" /> (i=1, … , tamp), donde <em>tamp</em> corresponde al tamaño de la población.</li>
<li><strong>Calcular el valor total de la aptitud de la población</strong></li>
</ul>
<p style="text-align: center;">                                                                               <img class="aligncenter" src="http://www.codecogs.com/gif.latex?%5Ctextit%7BF%20=%20%7D$%5Csum_%7Bi=1%7D%5E%7Btamp%7Deval%28$u_%7Bi%7D$%29" alt="http://www.codecogs.com/gif.latex?\textit{F%20=%20}$\sum_{i=1}^{tamp}eval($u_{i}$)" width="150" height="22" /></p>
<ul>
<li><strong>Calcular la probabilidad de selección <img src="http://www.codecogs.com/gif.latex?$p_%7Bi%7D$" alt="http://www.codecogs.com/gif.latex?$p_{i}$" /> de cada cromosoma </strong><img src="http://www.codecogs.com/gif.latex?u_%7Bi%7D" alt="http://www.codecogs.com/gif.latex?u_{i}" /></li>
</ul>
<p style="text-align: center;">  <img class="aligncenter" src="http://www.codecogs.com/gif.latex?p_%7Bi%7D%20=%20%5Cfrac%7Bu_%7Bi%7D%7D%7BF%7D" alt="http://www.codecogs.com/gif.latex?p_{i}%20=%20\frac{u_{i}}{F}" width="57" height="33" /></p>
<ul>
<li>La ruleta gira <em>tamp</em> veces, cada vez seleccionamos un cromosoma para una nueva población de la siguiente forma:</li>
<ul>
<li>Generar un número aleatorio flotante <em>r</em> del rango [0 ... 1].</li>
<li>Si <img src="http://www.codecogs.com/gif.latex?r%20%3Cq_%7Bi%7D" alt="http://www.codecogs.com/gif.latex?r%20%3Cq_{i}" />  entonces seleccionar el primer cromosoma<img src="http://www.codecogs.com/gif.latex?u_%7Bi%7D" alt="http://www.codecogs.com/gif.latex?u_{i}" /> , en otro caso seleccionar el i-ésimo cromosoma <img src="http://www.codecogs.com/gif.latex?u_%7Bi%7D" alt="http://www.codecogs.com/gif.latex?u_{i}" /> <em>(2 ≤ i ≤ tamp)</em> tal que<img src="http://www.codecogs.com/gif.latex?q_%7Bi-1%7D%3C%20r%20%20%3C=%20q_%7Bi-1%7D" alt="http://www.codecogs.com/gif.latex?q_{i-1}%3C%20r%20%20%3C=%20q_{i-1}" /></li>
</ul>
</ul>
<p>&nbsp;</p>
<p>Obviamente con este algoritmo, algunos cromosomas serán elegidos en distintas ocasiones.</p>
<p><strong>Selección por ranking</strong>: Desarrollado por Whitley en 1989, el método consiste en calcular las probabilidades de reproducción atendiendo a la ordenación de la población por el valor de aptitud en vez de simplemente el valor de la función, la aptitud esta definida por:<img src="http://www.codecogs.com/gif.latex?%5Cfrac%7Bf_%7Bi%7D%7D%7B%5Cbar%20f%7D" alt="http://www.codecogs.com/gif.latex?\frac{f_{i}}{\bar%20f}" />, donde <img src="http://www.codecogs.com/gif.latex?f_%7Bi%7D%7D" alt="http://www.codecogs.com/gif.latex?f_{i}}" />  es la evaluación asociada con el cromosoma <em>i</em> , y   <img src="http://www.codecogs.com/gif.latex?%5Cbar%20f" alt="http://www.codecogs.com/gif.latex?\bar%20f" /> es la evaluación promedio de todos los cromosomas en la población [8]. Una vez realizada esta evaluación, se simula un proceso de selección natural, los individuos son acomodados de acuerdo a la función de aptitud, en esta etapa los mejores individuos son elegidos de la población actual y el resto son eliminados. Esta selección natural ocurre cada generación o iteración del algoritmo. La decisión del número de cromosomas elegidos es algo arbitrario, sin embargo, dejando que solo unos pocos cromosomas sobrevivan para la siguiente generación limita los genes disponibles para producir descendientes, almacenando demasiados cromosomas permite que los cromosomas con baja aptitud reproduzcan sus características en la siguiente generación.</p>
<p>&nbsp;</p>
<p><strong>Selección por torneo</strong>: Un esquema ideal de selección debería ser simple de codificar, y eficiente para arquitecturas paralelas y no paralelas, más aún, un esquema de selección debería ser capaz de ajustar su influencia de selección acorde a su dominio. El uso de selección por torneo ha ido en incremento debido a que satisface los criterios anteriores[9]. La idea es simple, se elige un número de individuos de una población(normalmente 2, torneo binario), se selecciona el mejor individuo de este grupo para un nuevo procesamiento genético, la selección se realiza tantas veces como se desee (por lo general hasta que a partir de ellos, sea posible realizar el proceso de apareamiento). El método puede aplicarse con reemplazo o sin reemplazo, en el primer caso los individuos seleccionados del actual torneo son candidatos para participar en otro torneos, por otro lado en un torneo sin reemplazo los individuos son seleccionados una sola vez.</p>
<p>Una comparación de complejidad entre estos tres esquemas de selección puede verse en [10].</p>
<p>&nbsp;</p>
<p><strong>Operador Mutación</strong></p>
<p><a href="http://www.ubicuos.com/2011/09/05/algoritmos-geneticos/mutate/" rel="attachment wp-att-2851"><img class="aligncenter size-full wp-image-2851" title="MUTATE" src="http://www.ubicuos.com/wp-content/uploads/2011/09/MUTATE.gif" alt="" width="398" height="203" /></a></p>
<p>El operador de mutación fue introducido por Holland como un operador que ocasionalmente cambia bits individuales de cromosomas invirtiéndolos, la probabilidad de mutación <img src="http://www.codecogs.com/gif.latex?$p_%7Bm%7D%20%5Cepsilon%20[0,1]$" alt="http://www.codecogs.com/gif.latex?$p_{m}%20\epsilon%20[0,1]$" />  por bit es muy pequeña en un AG. Algunos valores comúnes son: <img src="http://www.codecogs.com/gif.latex?$p_%7Bm%7D%20=%200.001,%20p_%7Bm%7D%20=%200.01$" alt="http://www.codecogs.com/gif.latex?$p_{m}%20=%200.001,%20p_{m}%20=%200.01$" /> y <img src="http://www.codecogs.com/gif.latex?%20$p_%7Bm%7D%20%5Cepsilon[0.005,%200.01]$" alt="http://www.codecogs.com/gif.latex?%20$p_{m}%20\epsilon[0.005,%200.01]$" />. En últimos estudios, algunos investigadores formularon algunas reglas heurísticas indicando que el rendimiento es cada vez mayor tanto para poblaciones grandes (tamp &gt; 200) combinadas con una probabilidad de mutación grande <img src="http://www.codecogs.com/gif.latex?%20%28p_%7Bm%7D%20%3E%200.05%29" alt="http://www.codecogs.com/gif.latex?%20(p_{m}%20%3E%200.05)" /> como también para poblaciones de pequeño tamaño <img src="http://www.codecogs.com/gif.latex?%20%28tamp%20%3C%2020%29" alt="http://www.codecogs.com/gif.latex?%20(tamp%20%3C%2020)" /> combinadas con una probabilidad de mutación pequeña <img src="http://www.codecogs.com/gif.latex?%28$p_%7Bm%7D%20%3C%200.002$%29" alt="http://www.codecogs.com/gif.latex?($p_{m}%20%3C%200.002$)" />.</p>
<p>Valores pequeños de mutaciones, como Holland indica, garantiza que un individuo producido por mutación no difiera demasiado genéticamente de su antecesor. Esta declaración es cierta para el espacio de genotipos, pero como Bäck señala, solo es compatible con una codificación estándar(binaria) no para una representación con números reales [11].</p>
<p>El gen a mutar es seleccionado aleatoriamente del número total de genes (<em>tamp * L</em>) de la población actual.</p>
<p>&nbsp;</p>
<p><strong>Recombinación o Cruce</strong></p>
<p>&nbsp;</p>
<p>La recombinación es considerado como el operador más importante de los algoritmos genéticos. La idea es que segmentos útiles de diferentes padres podrían ser combinadas con el fin de dar a un nuevo individuo los beneficios de combinaciones de bits de ambos padres. De esta forma, más y más segmentos de aptitud alta se esperan que emergan, finalmente llegando a una total solución [5, pp. 97-106].</p>
<p>La recombinación es claramente un operador sexual(necesita dos cromosomas o individuos para llevarse a cabo) que con una probabilidad <img src="http://www.codecogs.com/gif.latex?$p_%7Bc%7D$" alt="http://www.codecogs.com/gif.latex?$p_{c}$" />selecciona dos individuos padres de la población, los recombina para formar dos nuevos individuos y descarta uno de los resultantes.</p>
<p>Valores comunes de <img src="http://www.codecogs.com/gif.latex?$p_%7Bc%7D$" alt="http://www.codecogs.com/gif.latex?$p_{c}$" /> son los propuestos por De Jong(1975) con <img src="http://www.codecogs.com/gif.latex?$p_%7Bc%7D$%20=%200.6" alt="http://www.codecogs.com/gif.latex?$p_{c}$%20=%200.6" />  y J.J Grefenstette(1985) con una <img src="http://www.codecogs.com/gif.latex?$p_%7Bc%7D$%20=%200.95" alt="http://www.codecogs.com/gif.latex?$p_{c}$%20=%200.95" />.</p>
<p>El operador de cruce permite realizar una exploración de toda la información almacenada hasta el momento en la población y combinarla para crear mejores individuos.</p>
<p>El tradicional método de cruce propuesto por Holland se conoce como <em>one-point crossover</em>:</p>
<p>Se elige una posición de cruce <img src="http://www.codecogs.com/gif.latex?%5Cchi%20%5Cepsilon" alt="http://www.codecogs.com/gif.latex?\chi%20\epsilon" /> <em>1, … , L-1</em> dentro de la cadena de bits al azar y se intercambian los bits a la derecha de esa posición entre ambos individuos. Sin embargo, éste método parece ser claramente inferior a los otros métodos con respecto al desempeño de los resultados.</p>
<p><a href="http://www.ubicuos.com/2011/09/05/algoritmos-geneticos/cross0/" rel="attachment wp-att-2852"><img class="aligncenter size-full wp-image-2852" title="CROSS0" src="http://www.ubicuos.com/wp-content/uploads/2011/09/CROSS0.gif" alt="" width="317" height="299" /></a></p>
<p><strong>Cruce de n puntos</strong>: Es una generalización del método anterior. Se seleccionan varias posiciones <em>(n)</em> en las cadenas de los progenitores y se intercambian los genes a ambos lados de estas posiciones.</p>
<p><strong>Cruce Uniforme</strong>: Es radicalmente diferente a la técnica de un punto, cada gen de los descendientes es creado copiando el correspondiente gen de uno o del otro padre, elegido de acuerdo a una máscara de cruce generada aleatoriamente. Cuando existe un 1 en la máscara de cruce, el gen es copiado del primer padre, y cuando la posición de la mascara contiene un 0, el gen es copiado del segundo padre. El proceso es repetido intercambiando a los padres para generar el segundo descendiente. Para cada par de padres se genera una máscara nueva, los descendientes por lo tanto, contienen una mezcla de genes de cada padre. El número de puntos de cruce efectivos no es fijo, pero la media podría ser <img src="http://www.codecogs.com/gif.latex?%5Cfrac%7BL%7D%7B2%7D" alt="http://www.codecogs.com/gif.latex?\frac{L}{2}" /> (donde <em>L</em>) es la longitud de los cromosomas).</p>
<p><a href="http://www.ubicuos.com/2011/09/05/algoritmos-geneticos/uniform/" rel="attachment wp-att-2853"><img class="aligncenter size-full wp-image-2853" title="UNIFORM" src="http://www.ubicuos.com/wp-content/uploads/2011/09/UNIFORM.gif" alt="" width="326" height="249" /></a></p>
<p><strong>Cruce heurístico</strong>: Éste operador propuesto por Wright \cite {Wright}, es único debido a las siguientes razones:</p>
<ol>
<li>Utiliza valores de la función objetivo para determinar la dirección de la búsqueda</li>
<li>Produce únicamente un descendiente</li>
<li>Podría no producir ningún descendiente</li>
</ol>
<p>El operador genera un descendiente <img src="http://www.codecogs.com/gif.latex?$x_%7B3" alt="http://www.codecogs.com/gif.latex?$x_{3" /> de dos padres <img src="http://www.codecogs.com/gif.latex?$x_1" alt="http://www.codecogs.com/gif.latex?$x_1" /> y <img src="http://www.codecogs.com/gif.latex?$x_2" alt="http://www.codecogs.com/gif.latex?$x_2" /> de acuerdo siguiente regla:</p>
<p><img src="http://www.codecogs.com/gif.latex?x_%7B3%7D%20=%20r%20*%20%28x_%7B2%7D%20-x_%7B1%7D%29%20+x_%7B2%7D" alt="http://www.codecogs.com/gif.latex?x_{3}%20=%20r%20*%20(x_{2}%20-x_{1})%20+x_{2}" /></p>
<p>Donde  <em>r</em> es un número aleatorio entre 0 y 1, y el padre   <img src="http://www.codecogs.com/gif.latex?$x_2" alt="http://www.codecogs.com/gif.latex?$x_2" /> no es peor que <img src="http://www.codecogs.com/gif.latex?$x_1" alt="http://www.codecogs.com/gif.latex?$x_1" />, es decir, <img src="http://www.codecogs.com/gif.latex?f%28x_%7B2%7D%29%20%5Cleq%20f%28x_%7B1%7D%29" alt="http://www.codecogs.com/gif.latex?f(x_{2})%20\leq%20f(x_{1})" />  para problemas de minimización.</p>
<p>Es posible que el operador genere un descendiente no viable. En tal caso otro valor aleatorio es generado y otro descendiente creado, si después de <em>w</em> intentos una nueva solución viable no es encontrada, el operador no hace más intentos y no produce ningún descendiente.</p>
<p>Después de que el proceso de selección, mutación y recombinación está completo, la siguiente población puede ser evaluada; este proceso formará una generación o ciclo en la ejecución de un algoritmo genético.</p>
<p>En cuanto el criterio de parada, generalmente viene determinado por criterios a priori sencillos, como un número máximo de generaciones o un tiempo máximo de resolución, o más eficientemente por estrategias relacionadas con indicadores del estado de evolución de la población, como por la pérdida de diversidad dentro de la población o por no haber mejora en un cierto número de iteraciones, siendo por lo general una condición mixta lo más utilizado, es decir, limitar el tiempo de ejecución a un número de iteraciones y tener en cuenta algún indicador del estado de la población para considerar la convergencia antes de alcanzar tal limitación.</p>
<p>&nbsp;</p>
<p><strong>Hasta Aqui llega esta breve introducción, esperando a que los aliente a meterse más en este campo, para esto les recomiendo un <a href="http://delta.cs.cinvestav.mx/~ccoello/papers.html" target="_blank">gran sitio</a> del Dr. <a href="http://delta.cs.cinvestav.mx/~ccoello/vitaenew.pdf">Carlos Coello</a> actual investigador del CINVESTAV en el IPN y que resolvió algunas de mis dudas.</strong></p>
<p>De antemano me disculpo si por ahí se me fué alguna expresión mal, es dificil trabajar sin LaTeX directamente. Saludos!!</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p><strong>Bibliografía</strong>:</p>
<p>[1] Zbigniew Michalewicz. Genetic algorithms + data structures = evolution programs (3rd ed.).  Springer-Verlag, London, UK, 1996.<br />
[2] Randy L. Haupt and Sue Ellen Haupt. Practical Genetic Algorithms. Wiley-Interscience, 2004.<br />
[3] John R. Koza. Genetic Programming: On the Programming of Computers by Means of Natural Selection (Complex Adaptive Systems). The MIT Press, 1 edition, December 1992.<br />
[4] David E. Goldberg. Genetic Algorithms in Search, Optimization, and Machine Learning. Addison-Wesley Professional, 1 edition, January 1989.<br />
[5] John H. Holland. Adaptation in natural and artificial systems. MIT Press, Cambridge, MA, USA, 1992.<br />
[6] L.B. Booker. Improving Search in Genetic Algorithms. Morgan Kaufmann Publishers, 1987.<br />
[7] Rafael Caballero Fern ́ndez. Algoritmos gen ́ticos para la resoluci ́n de problemas de programación por metas entera. aplicación a la economía de la educación.<br />
[8] Darrell Whitley. A genetic algorithm tutorial. Statistics and Computing, 4(2), June 1994.<br />
[9] Brad L. Miller, Brad L. Miller, David E. Goldberg, and David E. Goldberg. Genetic algorithms, tournament selection, and the effects of noise. Complex Systems, 9, 1995.                                                                                                                                                                                                                [10]Thomas Bäck. Evolutionary Algorithms in Theory and Practice: Evolution Strategies, Evolutionary Programming, Genetic Algorithms. Oxford University Press, 1996.                                                                                                                                                                                                                               [11]Alden H. Wright. Genetic algorithms for real parameter optimization. In Foundations of genetic algorithms. Morgan Kaufmann, San Mateo, CA, 1991.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.ubicuos.com/2011/09/05/algoritmos-geneticos/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>CSS en Ruby on Rails 3</title>
		<link>http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/</link>
		<comments>http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/#comments</comments>
		<pubDate>Fri, 20 May 2011 15:33:23 +0000</pubDate>
		<dc:creator>Conrrado Melquiades</dc:creator>
				<category><![CDATA[Programación]]></category>
		<category><![CDATA[Software Libre]]></category>
		<category><![CDATA[blueprint]]></category>
		<category><![CDATA[css]]></category>
		<category><![CDATA[rails]]></category>

		<guid isPermaLink="false">http://www.ubicuos.com/?p=2719</guid>
		<description><![CDATA[Cuentále a tus amigos en Facebook Para poner estilo a tus proyectos desarrollados en ruby on rails de forma rápida y algo fácil solo necesitas tener ganas y tiempo para hacerlo. &#160; Comencemos creando la estructura de nuestro proyecto con el comando de &#8220;rails new nombre_del_proyecto&#8221; &#160; Entramos a nuestro proyecto con &#8220;cd DragonsCSS &#8220; [...]]]></description>
			<content:encoded><![CDATA[<div align="left" style="padding: 0px 5px 5px 0px; clear: left; float: left;"><a name="fb_share" type="button_count" share_url="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/">Cuentále a tus amigos en Facebook</a></div><div class="tweetmeme_button" style="float: left; margin-left: 10px;width:90px">
			<a href="http://api.tweetmeme.com/share?url=http%3A%2F%2Fwww.ubicuos.com%2F2011%2F05%2F20%2Fcss-en-ruby-on-rails-3%2F"><br />
				<img src="http://api.tweetmeme.com/imagebutton.gif?url=http%3A%2F%2Fwww.ubicuos.com%2F2011%2F05%2F20%2Fcss-en-ruby-on-rails-3%2F&amp;style=compact&amp;b=2" height="61" width="50" /><br />
			</a>
		</div>
<p><a rel="attachment wp-att-2769" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo31/"><br />
</a>Para poner estilo a tus proyectos desarrollados en ruby on rails de forma rápida y algo fácil solo necesitas tener ganas y tiempo para hacerlo.</p>
<p>&nbsp;</p>
<p>Comencemos creando la estructura de nuestro proyecto con el comando de <em> &#8220;rails new nombre_del_proyecto</em>&#8221;</p>
<p style="text-align: center">&nbsp;</p>
<p><span id="more-2719"></span><br />
<div id="attachment_2721" class="wp-caption aligncenter" style="width: 605px">&nbsp;</p>
<div class="mceTemp mceIEcenter">
<dl>
<dt><a rel="attachment wp-att-2721" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo1/"><img class="size-full wp-image-2721" src="http://www.ubicuos.com/wp-content/uploads/2011/05/CSSdemo1.png" alt="" width="595" height="410" /></a><p class="wp-caption-text">&quot;Usando rails new&quot;</p></div></p>
</dt>
</dl>
</div>
<p>Entramos a nuestro proyecto con <em>&#8220;cd DragonsCSS &#8220;</em> dentro podemos navegar y ver los archivos que genera automáticamente rails desde el editor que mas les acomode o el que tengan instalado.</p>
<div id="attachment_2722" class="wp-caption aligncenter" style="width: 701px"><a rel="attachment wp-att-2722" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo2/"><img class="size-full wp-image-2722" src="http://www.ubicuos.com/wp-content/uploads/2011/05/CSSdemo2.png" alt="" width="691" height="122" /></a><p class="wp-caption-text">&quot; Navengando por nuestro proyecto &quot;</p></div>
<div id="attachment_2723" class="wp-caption aligncenter" style="width: 693px"><a rel="attachment wp-att-2723" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo3/"><img class="size-full wp-image-2723" src="http://www.ubicuos.com/wp-content/uploads/2011/05/CSSdemo3.png" alt="" width="683" height="410" /></a><p class="wp-caption-text">&quot; Vista del archivo q sera el protagonista del tutorial &quot;</p></div>
<p>Ahora solo basta con crear los controles o paginas de las cuales se compondrá nuestro proyecto con el comando <em>&#8220;rails generate controller nombre del control&#8221;</em>.</p>
<div id="attachment_2724" class="wp-caption aligncenter" style="width: 704px"><a rel="attachment wp-att-2724" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo4/"><img class="size-full wp-image-2724" src="http://www.ubicuos.com/wp-content/uploads/2011/05/CSSdemo4.png" alt="" width="694" height="114" /></a><p class="wp-caption-text">&quot; Generando el Home de nuestro proyecto&quot;</p></div>
<p>Ahora ejecutamos el servidor que trae por default rails con el comando <em>&#8221; rails s &#8220;</em> y tecleamos en la dirección Url <em>&#8221; http://localhost:3000/ &#8220;</em> o el puerto en el q este corriendo el servidor .</p>
<div id="attachment_2753" class="wp-caption aligncenter" style="width: 682px"><a rel="attachment wp-att-2753" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo26/"><img class="size-full wp-image-2753" src="http://www.ubicuos.com/wp-content/uploads/2011/05/CSSdemo26.png" alt="" width="672" height="149" /></a><p class="wp-caption-text">&quot; Lanzando el servidor de rails &quot;</p></div>
<div id="attachment_2754" class="wp-caption aligncenter" style="width: 669px"><a rel="attachment wp-att-2754" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo27/"><img class="size-full wp-image-2754" src="http://www.ubicuos.com/wp-content/uploads/2011/05/CSSdemo27.png" alt="" width="659" height="308" /></a><p class="wp-caption-text">&quot; El servidor de rails activo &quot; </p></div>
<p>Cuando entremos en el browser y pongamos la dirección del localhost nos mostrara la siguiente pagina.<a rel="attachment wp-att-2755" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo28/"><img class="aligncenter size-full wp-image-2755" src="http://www.ubicuos.com/wp-content/uploads/2011/05/CSSdemo28.png" alt="" width="727" height="598" /></a>Para que nos muestre directamente nuestro<em> home</em> cuando entremos en esa dirección solo tenemos que borrar el archivo &#8221; index.html &#8221; que se encuentra en la carpeta de<em> public</em> de nuestro proyecto una ves hecho esto solo basta con entrar al archivo de <em>routes.rb</em> que se encuentra en la carpeta<em> config</em> de nuestro proyecto agregando las lineas ( root :to =&gt; &#8216;home#index&#8217; )  ( match &#8216;home&#8217; =&gt; &#8220;home#index&#8221; ) sin los paréntesis.</p>
<div id="attachment_2761" class="wp-caption aligncenter" style="width: 669px"><a rel="attachment wp-att-2761" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo29/"><img class="size-full wp-image-2761" src="http://www.ubicuos.com/wp-content/uploads/2011/05/CSSdemo29.png" alt="" width="659" height="342" /></a><p class="wp-caption-text">&quot; Archivo routes.rb modificado &quot;</p></div>
<p>Entramos una ves mas al browser y actualizamos con F5 y listo veremos nuestro home muy básico.</p>
<div id="attachment_2762" class="wp-caption aligncenter" style="width: 736px"><a rel="attachment wp-att-2762" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo30/"><img class="size-full wp-image-2762" src="http://www.ubicuos.com/wp-content/uploads/2011/05/CSSdemo30.png" alt="" width="726" height="206" /></a><p class="wp-caption-text">&quot; Asi se ve nuestro home &quot;</p></div>
<p>Ahora viene lo mas interesante poner presentable nuestro proyecto para esto necesitamos descargar el <a href="https://github.com/joshuaclayton/blueprint-css/tarball/master" target="_blank">Blueprint</a> (para mayor información checa la <a href="https://github.com/joshuaclayton/blueprint-css/wiki/quick-start-tutorial" target="_blank">documentación</a> ) tambien hara falta un logo para ponerlo en la parte superior de nuestro home puedes usar el que te guste respetando los derechos de autor yo escogi el logo de <a href="http://mirrors.creativecommons.org/presskit/logos/cc.logo.large.png" target="_blank">creative commons</a>. Una ves descargados los archivos descomprimimos el blueprint en nuestro escritorio y copiamos la carpeta blueprint a public/stylesheets y el logo a public/images.<a rel="attachment wp-att-2725" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo5/"><img class="aligncenter size-full wp-image-2725" src="http://www.ubicuos.com/wp-content/uploads/2011/05/CSSdemo5.png" alt="" width="644" height="534" /></a><a rel="attachment wp-att-2726" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo6/"><img class="aligncenter size-full wp-image-2726" src="http://www.ubicuos.com/wp-content/uploads/2011/05/CSSdemo6.png" alt="" width="739" height="427" /></a></p>
<p>Listo ahora modificaremos el archivo <em>appliation.html.erb</em> cambiando la lineas de <em>stylesheet_link_tag.</em></p>
<div id="attachment_2728" class="wp-caption aligncenter" style="width: 749px"><a rel="attachment wp-att-2728" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo8/"><img class="size-full wp-image-2728" src="http://www.ubicuos.com/wp-content/uploads/2011/05/CSSdemo8.png" alt="" width="739" height="427" /></a><p class="wp-caption-text">&quot; Solo se agrgan las lineas marcadas que son la que indican el uso de los archivos screen y print asi como su ubicacion &quot; </p></div>
<p>Ahora agreguemos elementos al cuerpo de nuestra aplicación.</p>
<div id="attachment_2729" class="wp-caption aligncenter" style="width: 749px"><a rel="attachment wp-att-2729" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo9/"><img class="size-full wp-image-2729" src="http://www.ubicuos.com/wp-content/uploads/2011/05/CSSdemo9.png" alt="" width="739" height="614" /></a><p class="wp-caption-text">&quot; Agregamos una imagen al header y algunos links &quot;</p></div>
<p>Nota: En la linea de la imagen &#8221; &lt;%= image_tag(&#8220;<span style="color: #ff0000">logo.png</span>&#8220;, :alt =&gt; &#8220;Sample App&#8221;, :class =&gt; &#8220;round&#8221;) %&gt; &#8221; solo cambiamos el nombre de logo.png por logo_creative_commons.jpg.<a rel="attachment wp-att-2736" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo16/"></a><a rel="attachment wp-att-2737" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo17/"><img class="aligncenter size-full wp-image-2737" src="http://www.ubicuos.com/wp-content/uploads/2011/05/CSSdemo17.png" alt="" width="731" height="461" /></a><br />
<a rel="attachment wp-att-2769" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo31/"><img class="aligncenter size-full wp-image-2769" src="http://www.ubicuos.com/wp-content/uploads/2011/05/CSSdemo31.png" alt="" width="727" height="598" /></a></p>
<p>Ahora creamos un archivo con el nombre custom.css con el siguiente contenido:</p>
<p style="padding-left: 90px"><em>.container {</em></p>
<p style="padding-left: 90px"><em>width: 710px;</em></p>
<p style="padding-left: 90px"><em>}</em></p>
<p style="padding-left: 90px">&nbsp;</p>
<p style="padding-left: 90px"><em>body {</em></p>
<p style="padding-left: 90px"><em>background: #000;</em></p>
<p style="padding-left: 90px"><em>}</em></p>
<p style="padding-left: 90px">&nbsp;</p>
<p style="padding-left: 90px"><em>header {</em></p>
<p style="padding-left: 90px"><em>padding-top: 20px;</em></p>
<p style="padding-left: 90px"><em>}</em></p>
<p style="padding-left: 90px">&nbsp;</p>
<p style="padding-left: 90px"><em>header img {</em></p>
<p style="padding-left: 90px"><em>padding: 1em;</em></p>
<p style="padding-left: 90px"><em>background: #fff;</em></p>
<p style="padding-left: 90px"><em>}</em></p>
<p style="padding-left: 90px">&nbsp;</p>
<p style="padding-left: 90px"><em>section {</em></p>
<p style="padding-left: 90px"><em>margin-top: 1em;</em></p>
<p style="padding-left: 90px"><em>font-size: 120%;</em></p>
<p style="padding-left: 90px"><em>padding: 20px;</em></p>
<p style="padding-left: 90px"><em>background: #fff;</em></p>
<p style="padding-left: 90px"><em>}</em></p>
<p style="padding-left: 90px">&nbsp;</p>
<p style="padding-left: 90px"><em>section h1 {</em></p>
<p style="padding-left: 90px"><em>font-size: 200%;</em></p>
<p style="padding-left: 90px"><em>}</em></p>
<p style="padding-left: 90px">&nbsp;</p>
<p style="padding-left: 90px"><em>/* Links */</em></p>
<p style="padding-left: 90px">&nbsp;</p>
<p style="padding-left: 90px"><em>a {</em></p>
<p style="padding-left: 90px"><em>color: #09c;</em></p>
<p style="padding-left: 90px"><em>text-decoration: none;</em></p>
<p style="padding-left: 90px"><em>}</em></p>
<p style="padding-left: 90px">&nbsp;</p>
<p style="padding-left: 90px"><em>a:hover {</em></p>
<p style="padding-left: 90px"><em>color: #069;</em></p>
<p style="padding-left: 90px"><em>text-decoration: underline;</em></p>
<p style="padding-left: 90px"><em>}</em></p>
<p style="padding-left: 90px">&nbsp;</p>
<p style="padding-left: 90px"><em>a:visited {</em></p>
<p style="padding-left: 90px"><em>color: #069;</em></p>
<p style="padding-left: 90px"><em>}</em></p>
<p style="padding-left: 90px">&nbsp;</p>
<p style="padding-left: 90px"><em>/* Navigation */</em></p>
<p style="padding-left: 90px">&nbsp;</p>
<p style="padding-left: 90px"><em>nav {</em></p>
<p style="padding-left: 90px"><em>float: right;</em></p>
<p style="padding-left: 90px"><em>}</em></p>
<p style="padding-left: 90px">&nbsp;</p>
<p style="padding-left: 90px"><em>nav {</em></p>
<p style="padding-left: 90px"><em>background-color: black;</em></p>
<p style="padding-left: 90px"><em>padding: 0 0.7em;</em></p>
<p style="padding-left: 90px"><em>white-space: nowrap;</em></p>
<p style="padding-left: 90px"><em>}</em></p>
<p style="padding-left: 90px">&nbsp;</p>
<p style="padding-left: 90px"><em>nav ul {</em></p>
<p style="padding-left: 90px"><em>margin: 0;</em></p>
<p style="padding-left: 90px"><em>padding: 0;</em></p>
<p style="padding-left: 90px"><em>}</em></p>
<p style="padding-left: 90px">&nbsp;</p>
<p style="padding-left: 90px"><em>nav ul li {</em></p>
<p style="padding-left: 90px"><em>list-style-type: none;</em></p>
<p style="padding-left: 90px"><em>display: inline-block;</em></p>
<p style="padding-left: 90px"><em>padding: 0.8em 0;</em></p>
<p style="padding-left: 90px"><em>}</em></p>
<p style="padding-left: 90px">&nbsp;</p>
<p style="padding-left: 90px"><em>nav ul li a {</em></p>
<p style="padding-left: 90px"><em>padding: 0 5px;</em></p>
<p style="padding-left: 90px"><em>font-weight: bold;</em></p>
<p style="padding-left: 90px"><em>}</em></p>
<p style="padding-left: 90px">&nbsp;</p>
<p style="padding-left: 90px"><em>nav ul li a:visited {</em></p>
<p style="padding-left: 90px"><em>color: #09c;</em></p>
<p style="padding-left: 90px"><em>}</em></p>
<p style="padding-left: 90px">&nbsp;</p>
<p style="padding-left: 90px"><em>nav ul li a:hover {</em></p>
<p style="padding-left: 90px"><em>text-decoration: underline;</em></p>
<p style="padding-left: 90px"><em>}</em></p>
<p style="padding-left: 90px">&nbsp;</p>
<p style="padding-left: 90px"><em>/* Sign up button */</em></p>
<p style="padding-left: 90px">&nbsp;</p>
<p style="padding-left: 90px"><em>a.signup_button {</em></p>
<p style="padding-left: 90px"><em>margin-left: auto;</em></p>
<p style="padding-left: 90px"><em>margin-right: auto;</em></p>
<p style="padding-left: 90px"><em>display: block;</em></p>
<p style="padding-left: 90px"><em>text-align: center;</em></p>
<p style="padding-left: 90px"><em>width: 100px;</em></p>
<p style="padding-left: 90px"><em>color: #fff;</em></p>
<p style="padding-left: 90px"><em>background: #006400;</em></p>
<p style="padding-left: 90px"><em>font-size: 150%;</em></p>
<p style="padding-left: 90px"><em>font-weight: bold;</em></p>
<p style="padding-left: 90px"><em>padding: 20px;</em></p>
<p style="padding-left: 90px"><em>}</em></p>
<p style="padding-left: 90px"><em>/* Round corners */</em></p>
<p style="padding-left: 90px">&nbsp;</p>
<p style="padding-left: 90px"><em>.round {</em></p>
<p style="padding-left: 90px"><em>-moz-border-radius:    10px;</em></p>
<p style="padding-left: 90px"><em>-webkit-border-radius: 10px;</em></p>
<p style="padding-left: 90px"><em>border-radius:         10px;</em></p>
<p style="padding-left: 90px"><em>}<a rel="attachment wp-att-2731" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo11/"><img class="aligncenter size-full wp-image-2731" src="http://www.ubicuos.com/wp-content/uploads/2011/05/CSSdemo11.png" alt="" width="539" height="701" /></a></em></p>
<p>Muy bien ahora basta con separar las partes de tu aplicación en cabeza contenido y pie para esto creamos algunos archivos mas dentro de la carpeta de <em>&#8220;layouts&#8221;.</em></p>
<p>Creamos el archivo con el nombre de _stylesheets.html.erb</p>
<p><em> </em></p>
<div id="attachment_2741" class="wp-caption aligncenter" style="width: 638px"><em><a rel="attachment wp-att-2741" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo21/"><em> </em></a><em><a rel="attachment wp-att-2741" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo21/"><img class="size-full wp-image-2741" src="http://www.ubicuos.com/wp-content/uploads/2011/05/CSSdemo21.png" alt="" width="628" height="342" /></a></em></em><p class="wp-caption-text">_stylesheets.html.erb </p></div>
<p><em>Ahora creamos el archivo _</em>header.html.erb</p>
<div id="attachment_2742" class="wp-caption aligncenter" style="width: 717px"><a rel="attachment wp-att-2742" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo22/"><img class="size-full wp-image-2742" src="http://www.ubicuos.com/wp-content/uploads/2011/05/CSSdemo22.png" alt="" width="707" height="342" /></a><p class="wp-caption-text">_header.html.erb</p></div>
<p>Y por ultimo creamos el archivo _footer.html.erb</p>
<div id="attachment_2743" class="wp-caption aligncenter" style="width: 613px"><a rel="attachment wp-att-2743" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo23/"><img class="size-full wp-image-2743" src="http://www.ubicuos.com/wp-content/uploads/2011/05/CSSdemo23.png" alt="" width="603" height="342" /></a><p class="wp-caption-text">_footer.html.erb</p></div>
<p>Después de todo esto basta con modificar el archivo application.html.erb</p>
<div id="attachment_2774" class="wp-caption aligncenter" style="width: 673px"><a rel="attachment wp-att-2774" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo32/"><img class="size-full wp-image-2774" src="http://www.ubicuos.com/wp-content/uploads/2011/05/CSSdemo32.png" alt="" width="663" height="447" /></a><p class="wp-caption-text">Partial render.</p></div>
<p>Listo ahora podemos ver el resultado lanzando el servidor de RoR con rails s desde la consola.</p>
<p><a rel="attachment wp-att-2744" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo24/"><img class="aligncenter size-full wp-image-2744" src="http://www.ubicuos.com/wp-content/uploads/2011/05/CSSdemo24.png" alt="" width="1065" height="628" /></a></p>
<p>Ahora puedes jugar con los colores dentro de tu custom.css que creamos con las dimensiones de las partes de tu aplicación así como toda la apariencia suerte y ha practicar.<a rel="attachment wp-att-2745" href="http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/cssdemo25/"><img class="aligncenter size-full wp-image-2745" src="http://www.ubicuos.com/wp-content/uploads/2011/05/CSSdemo25.png" alt="" width="1073" height="754" /></a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.ubicuos.com/2011/05/20/css-en-ruby-on-rails-3/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Programación Funcional: Una brevísima Introducción</title>
		<link>http://www.ubicuos.com/2011/04/29/programacion-funcional-una-brevisima-introduccion/</link>
		<comments>http://www.ubicuos.com/2011/04/29/programacion-funcional-una-brevisima-introduccion/#comments</comments>
		<pubDate>Fri, 29 Apr 2011 19:13:14 +0000</pubDate>
		<dc:creator>fernandomt_08</dc:creator>
				<category><![CDATA[Programación]]></category>
		<category><![CDATA[programacion funcional]]></category>

		<guid isPermaLink="false">http://www.ubicuos.com/?p=2665</guid>
		<description><![CDATA[Cuentále a tus amigos en Facebook &#160; &#160; Cuando pensamos en programar nos suelen venir a la cabeza ideas como variables, ifs, objetos, funciones, procedimientos, todos esos conceptos presentes en la mayoría de los típicos lenguajes imperativos y que componen la vasta mayoría del software existente hoy en día. Es bueno, sin embargo, no perder [...]]]></description>
			<content:encoded><![CDATA[<div align="left" style="padding: 0px 5px 5px 0px; clear: left; float: left;"><a name="fb_share" type="button_count" share_url="http://www.ubicuos.com/2011/04/29/programacion-funcional-una-brevisima-introduccion/">Cuentále a tus amigos en Facebook</a></div><div class="tweetmeme_button" style="float: left; margin-left: 10px;width:90px">
			<a href="http://api.tweetmeme.com/share?url=http%3A%2F%2Fwww.ubicuos.com%2F2011%2F04%2F29%2Fprogramacion-funcional-una-brevisima-introduccion%2F"><br />
				<img src="http://api.tweetmeme.com/imagebutton.gif?url=http%3A%2F%2Fwww.ubicuos.com%2F2011%2F04%2F29%2Fprogramacion-funcional-una-brevisima-introduccion%2F&amp;style=compact&amp;b=2" height="61" width="50" /><br />
			</a>
		</div>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p><a rel="attachment wp-att-2677" href="http://www.ubicuos.com/2011/04/29/programacion-funcional-una-brevisima-introduccion/caricatura2/"><img class="aligncenter size-full wp-image-2677" title="caricatura2" src="http://www.ubicuos.com/wp-content/uploads/2011/04/caricatura2.jpg" alt="" width="740" height="328" /></a></p>
<p>Cuando pensamos en programar nos suelen venir  a la cabeza ideas como variables, <em>ifs</em>, objetos, funciones,  procedimientos, todos esos conceptos presentes en la mayoría de los  típicos lenguajes imperativos y que componen la vasta mayoría del  software existente hoy en día.</p>
<p>Es bueno, sin embargo, no perder de vista que <strong>todo esto son abstracciones</strong> más o menos arbitrarias y que puede haber otros enfoques de cómo  escribir archivos de texto llenos de código formal que puedan  convertirse luego en 1´s y 0´s para que nuestra máquina ejecute las operaciones. <a title="Paradigmas de programacion" href="http://en.wikipedia.org/wiki/List_of_multi-paradigm_programming_languages#Paradigm_summaries"><strong>Existen muy variados paradigmas de programación</strong></a>, entre los que se encuentra el que nos ocupa en este post: la conocida como <strong>programación funcional</strong>, que incorpora algunas ideas muy interesantes para todo programador.</p>
<p><a rel="attachment wp-att-2670" href="http://www.ubicuos.com/2011/04/29/programacion-funcional-una-brevisima-introduccion/fibohaskell/"><img class="aligncenter size-medium wp-image-2670" title="fibohaskell" src="http://www.ubicuos.com/wp-content/uploads/2011/04/fibohaskell-300x80.png" alt="" width="354" height="80" /></a></p>
<p>Pero&#8230;.</p>
<h2>Qué es la Programación Funcional?</h2>
<h4>Evaluación de Funciones Matemáticas</h4>
<p>Esto es el núcleo detrás de los lenguajes funcionales. En la Programación Orientada a Objetos(POO), tendemos a pensar en funciones como métodos que cambien el estado de nuestros objetos. Ahora, en una función matemática nosotros no realmente tenemos la noción del objeto o incluso ni de su estado. Consideremos una función que calcula la altura de un proyectil con respecto al tiempo:</p>
<blockquote><p>f(<em>t</em>) = -4.9<em>t</em><sup>2</sup> + 19.6<em>t</em> + 3</p></blockquote>
<p>Con esta función, evaluamos en un valor para <em>t </em>y obtenemos un valor que representa la altura. <span id="more-2665"></span>Aquí no hay un estado que estemos modificando o alterando, hay mucho más alla de este concepto, pero regresaremos a ella más adelante.</p>
<p>&nbsp;</p>
<h4>Evitar Estados y Datos Mutables</h4>
<p><a href="http://en.wikipedia.org/wiki/Immutable_object">La inmutabilidad de los objetos</a> es  central en la programación funcional, en los lenguajes funcionales ,como F#,   no se trabaja con v<em>ariables</em>. En lugar de ello se trabaja con v<em>alores</em>. Las  Variables (como implica su nombre) pueden cambiar, pero los valores permanecen constantes.</p>
<p>&nbsp;</p>
<p>La programación funcional, se basa fuertemente en un concepto de <strong>función</strong> algo diferente al que estamos acostumbrados, más cercano al matemático que su contraparte en los lenguajes imperativos</p>
<p>&nbsp;</p>
<p>Trabajemos con un ejemplo para aclarar más el concepto. La función factorial,  imperativamente, se definiría como &#8220;para calcular el factorial, toma un  valor de entrada, réstale uno, asigna este valor a x, calcula el  factorial de x, asígnalo a y, y devuelve x por y&#8221; . Órdenes, órdenes. En  cambio, funcionalmente se definiría como &#8220;el factorial de n <em>es</em> n  por el factorial de n-1&#8243;, mas sencillo,no?.  Es una mera diferencia de abstracción, pero  los lenguajes funcionales te fuerzan a pensar en ese alto nivel y <strong>no tiene sentido hablar de órdenes</strong>.</p>
<p>Básicamente, un programa funcional es aquel que sólo está compuesto  de funciones que se limitan a hacer corresponder cada elemento que se le  pase como argumento con un valor.</p>
<p><a rel="attachment wp-att-2694" href="http://www.ubicuos.com/2011/04/29/programacion-funcional-una-brevisima-introduccion/quick/"><img class="alignleft size-full wp-image-2694" title="quick" src="http://www.ubicuos.com/wp-content/uploads/2011/04/quick.jpeg" alt="" width="485" height="199" /></a></p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>Implementación del algoritmo Quicksort en Haskell</p>
<h2>Algunas características típicas</h2>
<p>Como consecuencia de todo esto, en los programas funcionales se encuentran algunas características:</p>
<ul>
<li><strong>Transparencia referencial.</strong> Al no haber variables, <strong>no hay efectos laterales</strong>, es decir, al <em>ejecutar</em> la función (aunque ya hemos visto que el concepto de <em>ejecutar</em> no existe como tal) no cambiará nada fuera del entorno de ésta. Tampoco  dependerá para nada de lo que haya en ese entorno. Se dice que una  función tiene transparencia referencial si, para un valor de entrada,  produce <em>siempre</em> la misma salida. En programación funcional <strong>esto es siempre así</strong> por definición.</li>
</ul>
<ul>
<li><strong>Evaluación perezosa</strong> (<em>Lazy evaluation</em>).  Para una mente acostumbrada a lo imperativo cuesta entender este concepto, así  que atención. Al no tener que seguir una serie de órdenes, una tras  otra, algunos lenguajes funcionales <strong>sólo evalúan lo que les es requerido en cada momento</strong>. Esto permite cosas como el código Haskell <code>take 5 [1..]</code>,  que significa &#8220;toma los cinco primeros números de una lista infinita  de números empezando por el 1&#8243;. En un lenguaje imperativo, esto llevaría  a un bucle infinito mientras se genera la lista. En Haskell, sólo se  genera lo que se necesita; en este caso, los cinco primeros números.  Esto puede redundar en una <strong>ejecución más eficiente</strong> y un código más claro y cercano al matemático.</li>
</ul>
<ul>
<li><strong>Altísima abstracción.</strong> Los lenguajes funcionales implementan <strong><em>muchísimos</em> mecanismos de abstracción</strong> que te hacen la vida muy, muy feliz. Un brutal sistema de tipos de  datos, polimorfismo en muchos niveles, y un montón de nuevos conceptos  como funciones de orden superior, functores, mónadas… Las inevitables  operaciones que no son puramente funcionales, como la entrada/salida o  los números aleatorios, quedan envueltos en abstracciones que resuelven  la papeleta con elegancia.</li>
</ul>
<ul>
<li><strong>Elegancia, legibilidad, flexibilidad.</strong> Por lo  general, cuanto más abstracto es un lenguaje, más se potencian estas  características, por lo que los programas funcionales suelen ser <strong>más claros, más concisos y más bellos</strong> que sus contrapartidas en lenguajes imperativos (incluso en Python o Ruby).  Además, la  ausencia de entorno y de estado permite que, si estás leyendo una  función, sólo tengas que retener en tu cabeza <em>esa</em> función, sin preocuparte de más. Esto genera&#8230;.</li>
</ul>
<ul>
<li><strong>Facilidad para las pruebas y la depuración.</strong> Gracias a la transparencia referencial, hacer <em>unit testing</em> en lenguajes imperativos es trivial. Además, el alto nivel hace que los  errores lo tengan difícil para esconderse por el código, por lo que  suelen salir <strong>programas muy fiables</strong>.</li>
<li><strong>Concurrencia. </strong>Un programa funcional ésta listo para la concurrencia sin demasiadas modificaciones. Tú no tendrás que preocuparte por los famosos  &#8220;deadlock&#8221; ya que tu no necesitas usarlos!. Ningún dato es modificado dos veces por el mismo hilo, mucho menos por dos hilos diferentes. Los beneficios no paran aqui. Si tenemos una aplicación que inherentemente es manejable con un solo subproceso el compilador puede optimizar los programas funcionales para que sean ejecutados en múltiples CPU´s. Observemos el siguiente código de ejemplo</li>
</ul>
<pre>String s1 = somewhatLongOperation1();
String s2 = somewhatLongOperation2();
String s3 = concatenate(s1, s2);</pre>
<p>En un lenguaje funcional el compilador puede analizar el código, clasificar las funciones que crean las cadena <em>s1</em> y <em>s2</em> como operaciones que consumen mucho tiempo y ejecutarlas concurrentemente. Esto en la programación imperativa es imposible de llevar a cabo porque cada función puede modificar  el estado fuera de su alcance y la siguiente función podría depender de ésta.</p>
<p>&nbsp;</p>
<h2>¿Y por qué no se usa a gran escala?</h2>
<p>No todo es tan bonito, claro. En la práctica, existen algunos inconvenientes a tener en cuenta.</p>
<ul>
<li><strong>Mayor dificultad inicial.</strong> Aunque sean muy fáciles  de entender y mantener, suele ser más difícil escribir un programa  funcionalmente, sobre todo para mentes acostumbradas a lo imperativo. La  gran variedad de conceptos complejos a tener en cuenta hace difícil  dominar el lenguaje y producir buen código. La <strong>ausencia de variables de estado</strong>,  aunque nos facilite la vida a posteriori, hace que tengas que comerte  más la cabeza al sentarte a picar líneas y planificar muy bien lo que  vas a hacer, y esto en entornos de producción puede no ser lo más  conveniente. De hecho, esto despierta <a href="http://twitter.com/ihatehaskell">hasta algunos odios</a>.</li>
</ul>
<ul>
<li><strong>Falta de recursos.</strong> Al estar tan poco extendidos, faltan la gran cantidad de recursos (librerías, <em>frameworks</em>,  etc.) existentes para otros lenguajes; aunque últimamente, se están volviendo a poner relativamente de moda, cada vez salen más soluciones.</li>
</ul>
<h2>Quiero aprender más&#8230;</h2>
<p>Como ya se pudieron dar cuenta, este post solo fue una brevísima introducción a la programación funcional, no se hablo de lenguajes, compiladores, interpretes, relacionados con el mundo de la PF, sin embargo, navegando por la red podemos encontrar una gran cantidad de material que nos guiarán a través del mundo de la programación funcional, y a que les dejo un pequeño compendio de referencias que pueden visitar(mismas que utilicé para armar este post).</p>
<p>&nbsp;</p>
<ul>
<li><a href="http://tryhaskell.org/">Try Haskell</a>, una amena introducción interactiva online que te dejará con ganas de más.</li>
<li><a href="http://www.learnyouahaskell.com/">Learn you a Haskell</a>, uno de los mejores tutoriales de todos los tiempos, extremadamente divertido.</li>
<li>En <a href="http://haskell.org/">Haskell.org</a> tienes infinidad de documentación, incluido el fantástico buscador <a href="http://www.haskell.org/hoogle/">Hoogle</a>, y una comunidad muy dispuesta a ayudar.</li>
<li><a href="http://antares.sip.ucm.es/~fernando/pf2/">Página de un profesor de la Universidad Complutense de Madrid</a></li>
<li>Charla impartida  por <a href="http://www.thocp.net/biographies/backus_john.htm">John Backus</a> al ser galardonado en 1977 con el  <a href="http://www.acm.org/awards/taward.html">premio Turing</a>. Su conferencia <a href="http://www.stanford.edu/class/cs242/readings/backus.pdf"> Can Programming be Liberated from the Von Neumann Style? A Functional  Style and Its Algebra of Programs</a></li>
<li><a href="http://www.cs.nott.ac.uk/~gmh/book.html">Parte del contenido del Libro:</a><a name="ordering" href="http://www.cs.nott.ac.uk/~gmh/book.html">Programming in Haskell</a></li>
<li><a href="http://devlicio.us/blogs/christopher_bennage/archive/2010/09/06/what-is-functional-programming.aspx">What is Functional Programming?,</a> un sitio en el que podrás aprender un poco más de la programación funcional<br />
<cite></cite></li>
<li>Breve Introducción a <a href="www.uhu.es/18214/temas/pd-tema5.pdf">Haskell</a></li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://www.ubicuos.com/2011/04/29/programacion-funcional-una-brevisima-introduccion/feed/</wfw:commentRss>
		<slash:comments>6</slash:comments>
		</item>
		<item>
		<title>CKEditor para Rails</title>
		<link>http://www.ubicuos.com/2011/04/18/ckeditor-para-rails/</link>
		<comments>http://www.ubicuos.com/2011/04/18/ckeditor-para-rails/#comments</comments>
		<pubDate>Tue, 19 Apr 2011 00:49:33 +0000</pubDate>
		<dc:creator>Conrrado Melquiades</dc:creator>
				<category><![CDATA[Cómputo Evolutivo]]></category>
		<category><![CDATA[General]]></category>
		<category><![CDATA[Programación]]></category>
		<category><![CDATA[Software Libre]]></category>
		<category><![CDATA[rails]]></category>
		<category><![CDATA[ruby]]></category>
		<category><![CDATA[software libre]]></category>
		<category><![CDATA[tutoriales]]></category>

		<guid isPermaLink="false">http://www.ubicuos.com/?p=2595</guid>
		<description><![CDATA[Cuentále a tus amigos en Facebook &#160; CKEditor es un editor de texto para ser utilizado dentro de las páginas web. Es un editor WYSIWYG es el acrónimo de What You See Is What You Get (en inglés, &#8220;lo que ves es lo que obtienes&#8221;) . Reúne las características de edición web común que se [...]]]></description>
			<content:encoded><![CDATA[<div align="left" style="padding: 0px 5px 5px 0px; clear: left; float: left;"><a name="fb_share" type="button_count" share_url="http://www.ubicuos.com/2011/04/18/ckeditor-para-rails/">Cuentále a tus amigos en Facebook</a></div><div class="tweetmeme_button" style="float: left; margin-left: 10px;width:90px">
			<a href="http://api.tweetmeme.com/share?url=http%3A%2F%2Fwww.ubicuos.com%2F2011%2F04%2F18%2Fckeditor-para-rails%2F"><br />
				<img src="http://api.tweetmeme.com/imagebutton.gif?url=http%3A%2F%2Fwww.ubicuos.com%2F2011%2F04%2F18%2Fckeditor-para-rails%2F&amp;style=compact&amp;b=2" height="61" width="50" /><br />
			</a>
		</div>
<p>&nbsp;</p>
<p><a rel="attachment wp-att-2611" href="http://www.ubicuos.com/2011/04/18/ckeditor-para-rails/pantallazo-4/"><img class="aligncenter size-full wp-image-2611" src="http://www.ubicuos.com/wp-content/uploads/2011/04/Pantallazo2.png" alt="" width="170" height="58" /></a></p>
<p><a rel="attachment wp-att-2611" href="http://www.ubicuos.com/2011/04/18/ckeditor-para-rails/pantallazo-4/"></a>CKEditor es un editor de texto para ser utilizado dentro de las páginas web. Es un editor <strong>WYSIWYG</strong> es el acrónimo de <em><strong>W</strong></em><em>hat </em><em><strong>Y</strong></em><em>ou </em><em><strong>S</strong></em><em>ee </em><em><strong>I</strong></em><em>s </em><em><strong>W</strong></em><em>hat </em><em><strong>Y</strong></em><em>ou </em><em><strong>G</strong></em><em>et</em> (en inglés, &#8220;lo que ves es lo que obtienes&#8221;) . Reúne las características de edición web común que se encuentran en aplicaciones de edición de escritorio como Microsoft Word y OpenOffice.</p>
<p>Y ahora lo usaremos dentro de Ruby on Rails así como su configuración y aparecía básica.</p>
<h2 style="text-align: center"><strong>Empecemos</strong> !!!!</h2>
<ol>
<li>Para usar CKEditor necesitamos instalarlo para lo cual descargaremos la gema desde <a title="rubygems" href="http://rubygems.org/gems/ckeditor" target="_blank"><span style="text-decoration: underline;color: #0000ff">http://rubygems.org/gems/ckeditor</span></a><a rel="attachment wp-att-2618" href="http://www.ubicuos.com/2011/04/18/ckeditor-para-rails/rubygems/"><img class="aligncenter size-medium wp-image-2618" src="http://www.ubicuos.com/wp-content/uploads/2011/04/rubygems-300x135.png" alt="" width="300" height="135" /></a></li>
<li><span style="color: #000000">Ahora instalemos la gema desde la terminal escribimos <em>gem install ckeditor-3.5.2.gem<a rel="attachment wp-att-2636" href="http://www.ubicuos.com/2011/04/18/ckeditor-para-rails/installckeditor/"><img class="aligncenter size-full wp-image-2636" src="http://www.ubicuos.com/wp-content/uploads/2011/04/installCKEditor.png" alt="" width="667" height="110" /></a></em></span></li>
<li><span style="color: #000000">Creemos un proyecto nuevo de rails.<a rel="attachment wp-att-2637" href="http://www.ubicuos.com/2011/04/18/ckeditor-para-rails/nuevopro/"><img class="aligncenter size-full wp-image-2637" src="http://www.ubicuos.com/wp-content/uploads/2011/04/nuevoPro.png" alt="" width="645" height="85" /></a></span></li>
<li><span style="color: #000000">Ahora basta con modificar el Gemfile agregando la linea</span><em>gem &#8216;ckeditor&#8217; o gem &#8216;ckeditor&#8217;, :git =&gt; &#8216;git://github.com/galetahub/rails-ckeditor.git&#8217;, :branch =&gt; &#8216;rails3&#8242;<a rel="attachment wp-att-2606" href="http://www.ubicuos.com/2011/04/18/ckeditor-para-rails/ooooo/"><img class="aligncenter size-full wp-image-2606" src="http://www.ubicuos.com/wp-content/uploads/2011/04/ooooo.png" alt="" width="657" height="433" /></a><a rel="attachment wp-att-2606" href="http://www.ubicuos.com/2011/04/18/ckeditor-para-rails/ooooo/"><br />
</a></em></li>
<li>Para que nuestra aplicación reconosca esta linea usemos el bundle.<a rel="attachment wp-att-2609" href="http://www.ubicuos.com/2011/04/18/ckeditor-para-rails/bundle/"><img class="aligncenter size-full wp-image-2609" src="http://www.ubicuos.com/wp-content/uploads/2011/04/bundle.png" alt="" width="667" height="116" /></a></li>
<li>El siguiente paso es descargar los archivos de base CKEditor y generar el archivo de configuración “config/initializers/ckeditor.rb”<a rel="attachment wp-att-2600" href="http://www.ubicuos.com/2011/04/18/ckeditor-para-rails/generate/"><img class="aligncenter size-full wp-image-2600" src="http://www.ubicuos.com/wp-content/uploads/2011/04/generate.png" alt="" width="657" height="433" /></a></li>
<li>Generar los modelos CKEditor para subir ficheros.<a rel="attachment wp-att-2603" href="http://www.ubicuos.com/2011/04/18/ckeditor-para-rails/migra/"><img class="aligncenter size-full wp-image-2603" src="http://www.ubicuos.com/wp-content/uploads/2011/04/migra.png" alt="" width="669" height="93" /></a></li>
<li>Ahora hacemos la migración.<a rel="attachment wp-att-2603" href="http://www.ubicuos.com/2011/04/18/ckeditor-para-rails/migra/"></a><a rel="attachment wp-att-2597" href="http://www.ubicuos.com/2011/04/18/ckeditor-para-rails/basededatos/"><img class="aligncenter size-full wp-image-2597" src="http://www.ubicuos.com/wp-content/uploads/2011/04/basededatos.png" alt="" width="657" height="433" /></a></li>
<li>Listo ahora podemos usar el CKEditor en nuestra aplicación para ello basta con incluirlo en la vista: Primero en el archivo de &#8220;/app/views/layouts/application.html.erb&#8221; se agraga la linea &#8220;&lt;%= javascript_include_tag :ckeditor %&gt;&#8221; despues basta con poner la siguiente linea en la vista que se usara el CKEditor : &#8220;&lt;%= ckeditor_textarea(&#8220;object&#8221;, &#8220;field&#8221;, :width =&gt; &#8217;100%&#8217;, :height =&gt; &#8217;200px&#8217;) %&gt;&#8221; . Si se utilizara en un formulario la linea es la siguiente : &#8221; &lt;%= form.cktext_area :notes, :toolbar=&gt;&#8217;Full&#8217;, :width=&gt;&#8217;400px&#8217;, :height=&gt;&#8217;200px&#8217; %&gt; &lt;%= form.cktext_area :content, :swf_params=&gt;{:assetable_type=&gt;&#8217;User&#8217;, :assetable_id=&gt;current_user.id} %&gt;&#8221;<a rel="attachment wp-att-2646" href="http://www.ubicuos.com/2011/04/18/ckeditor-para-rails/agreg/"><img class="aligncenter size-full wp-image-2646" src="http://www.ubicuos.com/wp-content/uploads/2011/04/agreg.png" alt="" width="397" height="205" /></a></li>
<li>Nos deve de quedar algo masomenos asi:<a rel="attachment wp-att-2647" href="http://www.ubicuos.com/2011/04/18/ckeditor-para-rails/demo/"></a><a rel="attachment wp-att-2648" href="http://www.ubicuos.com/2011/04/18/ckeditor-para-rails/demo1/"><img class="aligncenter size-full wp-image-2648" src="http://www.ubicuos.com/wp-content/uploads/2011/04/demo1.png" alt="" width="610" height="516" /></a></li>
<li>Para agregar o quitar opciones de la barra de herramientas del CKEditor simplemente se edita el fichero &#8220;public/javascripts/ckeditor/config.js&#8221;<a rel="attachment wp-att-2651" href="http://www.ubicuos.com/2011/04/18/ckeditor-para-rails/configckeditor/"><img class="aligncenter size-full wp-image-2651" src="http://www.ubicuos.com/wp-content/uploads/2011/04/configCKEditor.png" alt="" width="770" height="488" /></a>Good Luck!!</li>
</ol>
]]></content:encoded>
			<wfw:commentRss>http://www.ubicuos.com/2011/04/18/ckeditor-para-rails/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Así es por dentro una Olimpiada de programación informática</title>
		<link>http://www.ubicuos.com/2011/02/24/asi-es-por-dentro-una-olimpiada-de-programacion-informatica/</link>
		<comments>http://www.ubicuos.com/2011/02/24/asi-es-por-dentro-una-olimpiada-de-programacion-informatica/#comments</comments>
		<pubDate>Fri, 25 Feb 2011 01:33:41 +0000</pubDate>
		<dc:creator>fernandomt_08</dc:creator>
				<category><![CDATA[Programación]]></category>
		<category><![CDATA[concursos]]></category>

		<guid isPermaLink="false">http://www.ubicuos.com/?p=2564</guid>
		<description><![CDATA[Cuentále a tus amigos en Facebook - Jason Fagone publicó en Wired un interesante y detallado artículo titulado Teen Mathletes Do Battle at Algorithm Olympics sobre la Olimpiada de programación que se celebra desde hace más de veinte años en distintos lugares del mundo, al estilo de las olimpiadas matemáticas, de física y similares: hormonas [...]]]></description>
			<content:encoded><![CDATA[<div align="left" style="padding: 0px 5px 5px 0px; clear: left; float: left;"><a name="fb_share" type="button_count" share_url="http://www.ubicuos.com/2011/02/24/asi-es-por-dentro-una-olimpiada-de-programacion-informatica/">Cuentále a tus amigos en Facebook</a></div><div class="tweetmeme_button" style="float: left; margin-left: 10px;width:90px">
			<a href="http://api.tweetmeme.com/share?url=http%3A%2F%2Fwww.ubicuos.com%2F2011%2F02%2F24%2Fasi-es-por-dentro-una-olimpiada-de-programacion-informatica%2F"><br />
				<img src="http://api.tweetmeme.com/imagebutton.gif?url=http%3A%2F%2Fwww.ubicuos.com%2F2011%2F02%2F24%2Fasi-es-por-dentro-una-olimpiada-de-programacion-informatica%2F&amp;style=compact&amp;b=2" height="61" width="50" /><br />
			</a>
		</div>
<p><img src="file:///tmp/moz-screenshot.png" alt="" /><img src="file:///tmp/moz-screenshot-1.png" alt="" /><img src="file:///tmp/moz-screenshot-2.png" alt="" /><img src="file:///tmp/moz-screenshot-3.png" alt="" /></p>
<p><img class="alignleft" title="http://www.microsiervos.com/images/computer-olympics.jpg" src="http://www.microsiervos.com/images/computer-olympics.jpg" alt="" width="620" height="309" /></p>
<p>-</p>
<p>Jason Fagone publicó en <em>Wired</em> un interesante y detallado  artículo titulado <a href="http://www.wired.com/magazine/2010/11/mf_algorithmolympics/all/1"><strong>Teen  Mathletes Do Battle at Algorithm Olympics</strong></a> sobre la <a href="http://ioinformatics.org/">Olimpiada de programación</a> que se  celebra <a href="http://en.wikipedia.org/wiki/International_Olympiad_in_Informatics">desde  hace más de veinte años</a> en distintos lugares del mundo, al estilo  de las olimpiadas matemáticas, de física y similares: hormonas <em>nerd</em> a tope, vamos. En 2010 tuvo lugar en  Canadá y la <a href="http://www.ioi2011.or.th/">23ª edición se  celebrará en Tailandia</a>. Este año pasado compitieron 315  participantes de 83 países, en categorías tanto individuales como de  equipo.</p>
<p>Una curiosidad de este concurso es que se compite para resolver ocho  problemas de programación, pero como son tantos los que encuentran la  solución y resuelven los problemas a la perfección (269 de los 315 el  año pasado), la competición incluye el «factor tiempo»: quien más rápido  entregue los resultados, gana el concurso. Así que ese aspecto no es  baladí en este caso.<span id="more-2564"></span></p>
<p>Entre los <a href="http://www.ioi2010.org/CompetitionTask.shtml">problemas  del año pasado</a> estaban incluidos:</p>
<ul>
<li><a href="http://www.ioi2010.org/Tasks/Day1/Cluedo.shtml"><strong>Cluedo</strong></a>:  Diseñar el código más eficiente para resolver una partida de <a href="http://es.wikipedia.org/wiki/Clue">Cluedo</a> con 6 personajes, 10  lugares y 6 armas. El ganador: 22 líneas en Pascal.</li>
<li><a href="http://www.ioi2010.org/Tasks/Day1/Language.shtml"><strong>Lenguajes</strong></a><strong>: </strong>Dadas 10.000 cadenas de texto seleccionadas al azar de la  Wikipedia, crear un programa que identifique en qué idioma están  escritas. El ganador: 227 líneas de código, con una eficiencia del 85  por ciento de aciertos.</li>
<li><a href="http://www.ioi2010.org/Tasks/Day2/Maze.shtml"><strong>Laberinto</strong></a>:  Diseñar un programa que dibuje laberintos de diversos tamaños y grados  de complejidad.</li>
<li><a href="http://www.ioi2010.org/Tasks/Day2/Traffic.shtml"><strong>Tráfico:</strong></a> Encontrar el camino más corto en una red de transporte con miles de  ciudades conectadas a través de algunos nodos centrales. Es un problema  de gran complejidad de esos que sólo suelen resolverse mediante una  aproximación a la solución óptima, a menos que el tamaño de la red sea  razonable y tengas un superordenador a mano.</li>
</ul>
<p>Los lenguajes de programación oficiales de la competición son tres:  Pascal, C y C++. Los participantes suelen practicar en sitios como <a href="http://www.topcoder.com/tc">TopCoder</a>, así como en las «zonas  de práctica» de <a href="http://web.me.com/dpiele/usaco/Contests.html">los  equipos regionales</a>. A efectos prácticos, en la competición por 200  euros los chicos pasan una semana en la ciudad donde se celebra la  competición oficial, concentrada en dos días de tensión. A los ganadores  les pagan el viaje. (Anecdóticamente, respecto al tema chicos-chicas,  el lugar resulta ser el un proverbial <a href="http://wtf.microsiervos.com/matrix/avances-bosques-nabos.html">BDN</a>,  con solo un 10-15% de participantes femeninas).</p>
<p>Uno de los detalles que me pareció más curioso –y apropiado– es que  hay todo un complejo sistema informático encargado de controlar los  tiempos, recibir los programas y ejecutarlos para dar en tiempo real los  resultados a los participantes y mostrarlos en un gran panel al público  asistente. Dicen que el ambiente para los más <em>geeks</em> y los  acompañantes llega a volverse «emocionantemente eléctrico» a medida que  pasa el tiempo, una sensación seguramente difícil de describir para los  no-iniciados en el mundo de la programación.</p>
<p>Entre las «estrellas» del año pasado estaba Neal Wu del equipo de los  Estados Unidos, al que le montaron hasta <a href="http://www.facebook.com/group.php?gid=79459382292">una página en  Facebook a modo de club de fans</a> y <a href="http://blog.codechef.com/2010/08/09/programmer-of-the-month-for-august-%E2%80%9810-gennady-korotkevich/">Gennady  Korotkevich</a> de Bielorrusia, que comenzó a competir con 11 años y  que con 15 parece tener <em>Jolt</em> en las venas, chips de Deep Blue  por neuronas y concentra su vida en programar, dejando <strong>de lado chorradas  para nenazas como tener un blog, una cuenta de Twitter o una página en  Facebook</strong>. Dado que en la <em>rrrussia sssoviética</em> tú no programas  el código sino que el código programa tu cerebro, el muchacho arrasó en la  competición como era de esperar y se hizo con el primer premio. Pero  seguramente mejor premio será que lo fiche alguno de los <a href="http://www.ioi2010.org/sponsors.shtml">espónsores</a> que envían  «ojeadores» a la olimpiada, como IBM, Amazon, Google, BlackBerry o  Lenovo, y le ofrezcan un buen sueldo a cambio de su increíble capacidad  para picar código e inventar algoritmos ingeniosos.</p>
<p>Para mas informacion: <a href="http://www.ioi2010.org/"><strong>http://www.ioi2010.org/</strong></a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.ubicuos.com/2011/02/24/asi-es-por-dentro-una-olimpiada-de-programacion-informatica/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Crear, Compilar y Ejecutar programas JAVA en iPhone y iPod Touch</title>
		<link>http://www.ubicuos.com/2011/01/18/crear-compilar-y-ejecutar-programas-java-en-iphone-y-ipod-touch/</link>
		<comments>http://www.ubicuos.com/2011/01/18/crear-compilar-y-ejecutar-programas-java-en-iphone-y-ipod-touch/#comments</comments>
		<pubDate>Tue, 18 Jan 2011 23:01:42 +0000</pubDate>
		<dc:creator>Jorge</dc:creator>
				<category><![CDATA[Hardware]]></category>
		<category><![CDATA[Programación]]></category>
		<category><![CDATA[Software Libre]]></category>
		<category><![CDATA[apple]]></category>
		<category><![CDATA[iphone]]></category>
		<category><![CDATA[ipod]]></category>
		<category><![CDATA[java]]></category>

		<guid isPermaLink="false">http://www.ubicuos.com/?p=2540</guid>
		<description><![CDATA[Cuentále a tus amigos en Facebook Para aquellos que les gusta programar en Java en cualquier momento, aquí les dejo un tutorial sobre como programar en java en tu iPhone ó iPod Touch. Elementos con los que se realizaron este tutorial. iPod Touch 4. JailBreak Cydia Bién, vamos a instalar los componentes para poder Crear, [...]]]></description>
			<content:encoded><![CDATA[<div align="left" style="padding: 0px 5px 5px 0px; clear: left; float: left;"><a name="fb_share" type="button_count" share_url="http://www.ubicuos.com/2011/01/18/crear-compilar-y-ejecutar-programas-java-en-iphone-y-ipod-touch/">Cuentále a tus amigos en Facebook</a></div><div class="tweetmeme_button" style="float: left; margin-left: 10px;width:90px">
			<a href="http://api.tweetmeme.com/share?url=http%3A%2F%2Fwww.ubicuos.com%2F2011%2F01%2F18%2Fcrear-compilar-y-ejecutar-programas-java-en-iphone-y-ipod-touch%2F"><br />
				<img src="http://api.tweetmeme.com/imagebutton.gif?url=http%3A%2F%2Fwww.ubicuos.com%2F2011%2F01%2F18%2Fcrear-compilar-y-ejecutar-programas-java-en-iphone-y-ipod-touch%2F&amp;style=compact&amp;b=2" height="61" width="50" /><br />
			</a>
		</div>
<p>Para aquellos que les gusta programar en Java en cualquier momento, aquí les dejo un tutorial sobre como programar en java en tu iPhone ó iPod Touch.</p>
<p>Elementos con los que se realizaron este tutorial.</p>
<ul>
<li>iPod Touch 4.</li>
<li>JailBreak</li>
<li>Cydia</li>
</ul>
<p>Bién, vamos a instalar los componentes para poder Crear, Compilar y Ejecutar nuestros archivos .java.</p>
<p>Entramos a Cydia y nos vamos a la opción &#8220;Manage&#8221;, seleccionamos &#8220;Settings&#8221; y seleccionamos la opción &#8220;Developer (No Filters)&#8221;.</p>
<div id="attachment_2541" class="wp-caption aligncenter" style="width: 330px"><img class="size-full wp-image-2541" title="IMG_0590" src="http://www.ubicuos.com/wp-content/uploads/2011/01/IMG_0590.png" alt="" width="320" height="480" /><p class="wp-caption-text">Seleccionamos &quot;Settings&quot;</p></div>
<div id="attachment_2542" class="wp-caption aligncenter" style="width: 330px"><img class="size-full wp-image-2542" title="IMG_0591" src="http://www.ubicuos.com/wp-content/uploads/2011/01/IMG_0591.png" alt="" width="320" height="480" /><p class="wp-caption-text">Seleccionamos &quot;Developer (No Filters)&quot;</p></div>
<p style="text-align: justify;"><span id="more-2540"></span>Ahora nos vamos a la opción &#8220;Sections&#8221; y buscamos &#8220;Java&#8221;, una vez dentro instalamos <strong>Classpath</strong>, <strong>JamVM</strong> y <strong>Jikes</strong>.</p>
<div id="attachment_2543" class="wp-caption aligncenter" style="width: 330px"><img class="size-full wp-image-2543" title="IMG_0592" src="http://www.ubicuos.com/wp-content/uploads/2011/01/IMG_0592.png" alt="" width="320" height="480" /><p class="wp-caption-text">Seleccionamos &quot;Java&quot;</p></div>
<div id="attachment_2544" class="wp-caption aligncenter" style="width: 330px"><img class="size-full wp-image-2544" title="IMG_0593" src="http://www.ubicuos.com/wp-content/uploads/2011/01/IMG_0593.png" alt="" width="320" height="480" /><p class="wp-caption-text">Instalamos Classpath y JamVM</p></div>
<div id="attachment_2545" class="wp-caption aligncenter" style="width: 330px"><img class="size-full wp-image-2545" title="IMG_0594" src="http://www.ubicuos.com/wp-content/uploads/2011/01/IMG_0594.png" alt="" width="320" height="480" /><p class="wp-caption-text">Instalamos Jikes</p></div>
<p style="text-align: justify;">Ahora vamos a instalar el iEdit que es el que nos va a servir para crear nuestros archivos desde el iPod/iPhone y también instalaremos MobileTerminal que es donde vamos a ejecutar nuestros programas. Abrimos el &#8220;Search&#8221; de Cydia y buscamos cada programa y los instalamos.</p>
<p style="text-align: justify;">
<div id="attachment_2546" class="wp-caption aligncenter" style="width: 330px"><img class="size-full wp-image-2546" title="IMG_0595" src="http://www.ubicuos.com/wp-content/uploads/2011/01/IMG_0595.png" alt="" width="320" height="480" /><p class="wp-caption-text">Programa para crear los archivos .java</p></div>
<div id="attachment_2547" class="wp-caption aligncenter" style="width: 330px"><img class="size-full wp-image-2547" title="IMG_0596" src="http://www.ubicuos.com/wp-content/uploads/2011/01/IMG_0596.png" alt="" width="320" height="480" /><p class="wp-caption-text">Terminal para compilar y ejecutar nuestros programas</p></div>
<p style="text-align: justify;">Una vez instalado Todo, vamos a entrar al iEdit para empesar a programar.</p>
<p style="text-align: justify;">Cuando abrimos el iEdit nos posiciona en la carpeta Documents de nuestro dispositivo, vamos a crear una carpeta llamada &#8220;Java&#8221; donde crearemos nuestros programas. Para ello solo tocamos el simbolo de &#8220;+&#8221; y cuando nos pida el nombre seleccionamos la opción &#8220;Folder&#8221; que indicará que crearemos una carpeta.</p>
<p style="text-align: justify;">
<div id="attachment_2548" class="wp-caption aligncenter" style="width: 330px"><img class="size-full wp-image-2548" title="IMG_0597" src="http://www.ubicuos.com/wp-content/uploads/2011/01/IMG_0597.png" alt="" width="320" height="480" /><p class="wp-caption-text">Seleccionamos la opción &quot;+&quot;</p></div>
<div id="attachment_2549" class="wp-caption aligncenter" style="width: 330px"><img class="size-full wp-image-2549" title="IMG_0598" src="http://www.ubicuos.com/wp-content/uploads/2011/01/IMG_0598.png" alt="" width="320" height="480" /><p class="wp-caption-text">Activamos la opción &quot;Folder&quot;</p></div>
<div id="attachment_2550" class="wp-caption aligncenter" style="width: 330px"><img class="size-full wp-image-2550" title="IMG_0599" src="http://www.ubicuos.com/wp-content/uploads/2011/01/IMG_0599.png" alt="" width="320" height="480" /><p class="wp-caption-text">Carpeta &quot;Java&quot; Creada</p></div>
<p style="text-align: justify;">Ahora seleccionamos &#8220;Java&#8221; para acceder a la carpeta y crear nuestro programa.</p>
<p style="text-align: justify;">En esta ocación vamos a crear un programa para calcular el factorial de un número. Lo haremos en dos archivos, uno se llamará Operations.java que contendrá la función para calcular el factorial y el otro se llamará Factorial.java que será nuestro programa principal.</p>
<p style="text-align: justify;">Para crear un archivo lo hacemos de la misma manera que creamos la carpeta, solo que activamos la opción File.</p>
<p style="text-align: justify;">Creamos el archivo Operations.java</p>
<p style="text-align: justify;">
<div id="attachment_2551" class="wp-caption aligncenter" style="width: 330px"><img class="size-full wp-image-2551" title="IMG_0600" src="http://www.ubicuos.com/wp-content/uploads/2011/01/IMG_0600.png" alt="" width="320" height="480" /><p class="wp-caption-text">Seleccionamos la opción File</p></div>
<div id="attachment_2552" class="wp-caption aligncenter" style="width: 330px"><img class="size-full wp-image-2552" title="IMG_0601" src="http://www.ubicuos.com/wp-content/uploads/2011/01/IMG_0601.png" alt="" width="320" height="480" /><p class="wp-caption-text">Seleccionamos el archivo para abrirlo</p></div>
<div id="attachment_2553" class="wp-caption aligncenter" style="width: 650px"><img class="size-full wp-image-2553" title="IMG_0602" src="http://www.ubicuos.com/wp-content/uploads/2011/01/IMG_0602.png" alt="" width="640" height="960" /><p class="wp-caption-text">Código del archivo Operations.java</p></div>
<p>Creamos el archivo Factorial.java</p>
<div id="attachment_2554" class="wp-caption aligncenter" style="width: 330px"><img class="size-full wp-image-2554" title="IMG_0603" src="http://www.ubicuos.com/wp-content/uploads/2011/01/IMG_0603.png" alt="" width="320" height="480" /><p class="wp-caption-text">Activamos la opción File</p></div>
<div id="attachment_2555" class="wp-caption aligncenter" style="width: 650px"><img class="size-full wp-image-2555" title="IMG_0604" src="http://www.ubicuos.com/wp-content/uploads/2011/01/IMG_0604.png" alt="" width="640" height="960" /><p class="wp-caption-text">Código del archivo Factorial.java</p></div>
<p>Ya que tenemos los archivos creados vamos a compilarlos y ejecutarlos. Para ellos abrimos el programa Terminal y nos vamos a desplazar hasta la carpeta Java que creamos dentro de documents.</p>
<p style="text-align: center;">
<div id="attachment_2556" class="wp-caption aligncenter" style="width: 733px"><img class="size-full wp-image-2556 " title="IMG_0605" src="http://www.ubicuos.com/wp-content/uploads/2011/01/IMG_0605.png" alt="" width="723" height="482" /><p class="wp-caption-text">Nos desplazamos hasta la carpeta Java</p></div>
<p>Ahora compilamos nuestros archivos con el comando jikes archivo.java</p>
<div id="attachment_2557" class="wp-caption aligncenter" style="width: 733px"><img class="size-full wp-image-2557" title="IMG_0606" src="http://www.ubicuos.com/wp-content/uploads/2011/01/IMG_0606.png" alt="" width="723" height="482" /><p class="wp-caption-text">Compilamos los archivos</p></div>
<p>Y finalmente ejecutamos el programa con el comando java archivo</p>
<div id="attachment_2558" class="wp-caption aligncenter" style="width: 733px"><img class="size-full wp-image-2558" title="IMG_0607" src="http://www.ubicuos.com/wp-content/uploads/2011/01/IMG_0607.png" alt="" width="723" height="482" /><p class="wp-caption-text">Compilamos nuestro programa</p></div>
<p style="text-align: justify;">Listo!!</p>
<p style="text-align: justify;">Espero sea de grán ayuda..</p>
<p style="text-align: justify;">Dudas, comentarios y/ó sugerencias no duden en hacerlas llegar..</p>
<p style="text-align: justify;">Saludos!!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.ubicuos.com/2011/01/18/crear-compilar-y-ejecutar-programas-java-en-iphone-y-ipod-touch/feed/</wfw:commentRss>
		<slash:comments>13</slash:comments>
		</item>
		<item>
		<title>Acceder a MySQL desde iPodTouch, iPhone y iPad</title>
		<link>http://www.ubicuos.com/2011/01/12/acceder-a-mysql-desde-ipodtouch-iphone-y-ipa/</link>
		<comments>http://www.ubicuos.com/2011/01/12/acceder-a-mysql-desde-ipodtouch-iphone-y-ipa/#comments</comments>
		<pubDate>Thu, 13 Jan 2011 05:54:34 +0000</pubDate>
		<dc:creator>Jorge</dc:creator>
				<category><![CDATA[Programación]]></category>
		<category><![CDATA[Social / Internet]]></category>
		<category><![CDATA[Software Libre]]></category>
		<category><![CDATA[Tecnología]]></category>
		<category><![CDATA[apple]]></category>
		<category><![CDATA[iphone]]></category>
		<category><![CDATA[ipod]]></category>
		<category><![CDATA[mysql]]></category>

		<guid isPermaLink="false">http://www.ubicuos.com/?p=2530</guid>
		<description><![CDATA[Cuentále a tus amigos en Facebook Existe una aplicación bastante facil de manejar, para cuendo tengamos la necesidad de conectarnos a algunas de nuestras bases de datos MySQL montadas en la red.. DataGlass MySQL Esta aplicación nos ayudará en ese trabajito.. Aquí algunas imágenes.. La aplicación es gratuita y la pueden bajar de la App [...]]]></description>
			<content:encoded><![CDATA[<div align="left" style="padding: 0px 5px 5px 0px; clear: left; float: left;"><a name="fb_share" type="button_count" share_url="http://www.ubicuos.com/2011/01/12/acceder-a-mysql-desde-ipodtouch-iphone-y-ipa/">Cuentále a tus amigos en Facebook</a></div><div class="tweetmeme_button" style="float: left; margin-left: 10px;width:90px">
			<a href="http://api.tweetmeme.com/share?url=http%3A%2F%2Fwww.ubicuos.com%2F2011%2F01%2F12%2Facceder-a-mysql-desde-ipodtouch-iphone-y-ipa%2F"><br />
				<img src="http://api.tweetmeme.com/imagebutton.gif?url=http%3A%2F%2Fwww.ubicuos.com%2F2011%2F01%2F12%2Facceder-a-mysql-desde-ipodtouch-iphone-y-ipa%2F&amp;style=compact&amp;b=2" height="61" width="50" /><br />
			</a>
		</div>
<p>Existe una aplicación bastante facil de manejar, para cuendo tengamos la necesidad de conectarnos a algunas de nuestras bases de datos MySQL montadas en la red..</p>
<p>DataGlass MySQL<br />
<img class="aligncenter size-full wp-image-2534" title="dataglassmysql" src="http://www.ubicuos.com/wp-content/uploads/2011/01/dataglassmysql.jpg" alt="" width="175" height="175" /></p>
<p>Esta aplicación nos ayudará en ese trabajito..</p>
<p>Aquí algunas imágenes..</p>
<div id="attachment_2531" class="wp-caption aligncenter" style="width: 368px"><img class="size-full wp-image-2531" title="IMG_0547" src="http://www.ubicuos.com/wp-content/uploads/2011/01/IMG_0547.png" alt="Datos de Conexión" width="358" height="538" /><p class="wp-caption-text">Datos de Conexión</p></div>
<div id="attachment_2532" class="wp-caption aligncenter" style="width: 368px"><img class="size-full wp-image-2532" title="IMG_0548" src="http://www.ubicuos.com/wp-content/uploads/2011/01/IMG_0548.png" alt="Lista de tablas de la base de datos" width="358" height="538" /><p class="wp-caption-text">Lista de tablas de la base de datos</p></div>
<div id="attachment_2533" class="wp-caption aligncenter" style="width: 548px"><img class="size-full wp-image-2533" title="IMG_0549" src="http://www.ubicuos.com/wp-content/uploads/2011/01/IMG_0549.png" alt="Acceso a los datos de la tabla &quot;videos&quot;" width="538" height="358" /><p class="wp-caption-text">Acceso a los datos de la tabla &quot;videos&quot;</p></div>
<p>La aplicación es gratuita y la pueden bajar de la App Store</p>
<p>Más info: <a href="http://itunes.apple.com/es/app/dataglass-mysql/id397060484?mt=8">http://itunes.apple.com/es/app/dataglass-mysql/id397060484?mt=8</a></p>
<p>Espero sea de grán ayuda..</p>
<p>Dudas, comentarios y/ó sugerencias, no duden en hacerlas llegar..</p>
<p>Saludos!!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.ubicuos.com/2011/01/12/acceder-a-mysql-desde-ipodtouch-iphone-y-ipa/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Paginación en CodeIgniter</title>
		<link>http://www.ubicuos.com/2010/12/28/paginacion-en-codeigniter/</link>
		<comments>http://www.ubicuos.com/2010/12/28/paginacion-en-codeigniter/#comments</comments>
		<pubDate>Tue, 28 Dec 2010 19:29:02 +0000</pubDate>
		<dc:creator>Jorge</dc:creator>
				<category><![CDATA[Programación]]></category>
		<category><![CDATA[Software Libre]]></category>
		<category><![CDATA[codeigniter]]></category>
		<category><![CDATA[php]]></category>

		<guid isPermaLink="false">http://www.ubicuos.com/?p=2499</guid>
		<description><![CDATA[Cuentále a tus amigos en Facebook Vamos a explicar como hacer una paginación de datos en CodeIgniter. Para ello a mi proyecto lo llamaré CI.. Supongamos que tenemos una tabla llamada customers. DROP TABLE IF EXISTS `customers`; CREATE TABLE `customers` &#40; `id` INT&#40;10&#41; UNSIGNED NOT NULL AUTO_INCREMENT, `name` VARCHAR&#40;45&#41; NOT NULL, `lastname` VARCHAR&#40;45&#41; NOT NULL, [...]]]></description>
			<content:encoded><![CDATA[<div align="left" style="padding: 0px 5px 5px 0px; clear: left; float: left;"><a name="fb_share" type="button_count" share_url="http://www.ubicuos.com/2010/12/28/paginacion-en-codeigniter/">Cuentále a tus amigos en Facebook</a></div><div class="tweetmeme_button" style="float: left; margin-left: 10px;width:90px">
			<a href="http://api.tweetmeme.com/share?url=http%3A%2F%2Fwww.ubicuos.com%2F2010%2F12%2F28%2Fpaginacion-en-codeigniter%2F"><br />
				<img src="http://api.tweetmeme.com/imagebutton.gif?url=http%3A%2F%2Fwww.ubicuos.com%2F2010%2F12%2F28%2Fpaginacion-en-codeigniter%2F&amp;style=compact&amp;b=2" height="61" width="50" /><br />
			</a>
		</div>
<p>Vamos a explicar como hacer una paginación de datos en CodeIgniter.</p>
<p>Para ello a mi proyecto lo llamaré CI..</p>
<p>Supongamos que tenemos una tabla llamada customers.</p>

<div class="wp_syntax"><div class="code"><pre class="sql" style="font-family:monospace;"><span style="color: #993333; font-weight: bold;">DROP</span> <span style="color: #993333; font-weight: bold;">TABLE</span> <span style="color: #993333; font-weight: bold;">IF</span> <span style="color: #993333; font-weight: bold;">EXISTS</span> <span style="color: #ff0000;">`customers`</span>;
<span style="color: #993333; font-weight: bold;">CREATE</span> <span style="color: #993333; font-weight: bold;">TABLE</span>  <span style="color: #ff0000;">`customers`</span> <span style="color: #66cc66;">&#40;</span>
  <span style="color: #ff0000;">`id`</span> <span style="color: #993333; font-weight: bold;">INT</span><span style="color: #66cc66;">&#40;</span><span style="color: #cc66cc;">10</span><span style="color: #66cc66;">&#41;</span> <span style="color: #993333; font-weight: bold;">UNSIGNED</span> <span style="color: #993333; font-weight: bold;">NOT</span> <span style="color: #993333; font-weight: bold;">NULL</span> <span style="color: #993333; font-weight: bold;">AUTO_INCREMENT</span><span style="color: #66cc66;">,</span>
  <span style="color: #ff0000;">`name`</span> <span style="color: #993333; font-weight: bold;">VARCHAR</span><span style="color: #66cc66;">&#40;</span><span style="color: #cc66cc;">45</span><span style="color: #66cc66;">&#41;</span> <span style="color: #993333; font-weight: bold;">NOT</span> <span style="color: #993333; font-weight: bold;">NULL</span><span style="color: #66cc66;">,</span>
  <span style="color: #ff0000;">`lastname`</span> <span style="color: #993333; font-weight: bold;">VARCHAR</span><span style="color: #66cc66;">&#40;</span><span style="color: #cc66cc;">45</span><span style="color: #66cc66;">&#41;</span> <span style="color: #993333; font-weight: bold;">NOT</span> <span style="color: #993333; font-weight: bold;">NULL</span><span style="color: #66cc66;">,</span>
  <span style="color: #ff0000;">`phone`</span> <span style="color: #993333; font-weight: bold;">VARCHAR</span><span style="color: #66cc66;">&#40;</span><span style="color: #cc66cc;">45</span><span style="color: #66cc66;">&#41;</span> <span style="color: #993333; font-weight: bold;">NOT</span> <span style="color: #993333; font-weight: bold;">NULL</span><span style="color: #66cc66;">,</span>
  <span style="color: #ff0000;">`address`</span> <span style="color: #993333; font-weight: bold;">VARCHAR</span><span style="color: #66cc66;">&#40;</span><span style="color: #cc66cc;">45</span><span style="color: #66cc66;">&#41;</span> <span style="color: #993333; font-weight: bold;">NOT</span> <span style="color: #993333; font-weight: bold;">NULL</span><span style="color: #66cc66;">,</span>
  <span style="color: #ff0000;">`email`</span> <span style="color: #993333; font-weight: bold;">VARCHAR</span><span style="color: #66cc66;">&#40;</span><span style="color: #cc66cc;">45</span><span style="color: #66cc66;">&#41;</span> <span style="color: #993333; font-weight: bold;">NOT</span> <span style="color: #993333; font-weight: bold;">NULL</span><span style="color: #66cc66;">,</span>
  <span style="color: #993333; font-weight: bold;">PRIMARY</span> <span style="color: #993333; font-weight: bold;">KEY</span> <span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">`id`</span><span style="color: #66cc66;">&#41;</span>
<span style="color: #66cc66;">&#41;</span> ENGINE<span style="color: #66cc66;">=</span>InnoDB <span style="color: #993333; font-weight: bold;">AUTO_INCREMENT</span><span style="color: #66cc66;">=</span><span style="color: #cc66cc;">1</span> <span style="color: #993333; font-weight: bold;">DEFAULT</span> CHARSET<span style="color: #66cc66;">=</span>latin1;</pre></div></div>

<p>Habrimos el archivo database.php y configuramos nuestra conexión de base de datos.</p>
<p>Luego dentro de config.php en el parametro $config['base_url'] ponemos algo así $config['base_url']    = &#8220;http://127.0.0.1/CI/&#8221;;</p>
<p>Despues en el archivo database.php solo indicamos que cargue la base de datos desde el inicio con $autoload['libraries'] = array(&#8216;database&#8217;);</p>
<p><em>Todo esto dentro la carpeta config.</em></p>
<p>Ahora vamos a crear un modelo para trabajar con la base de datos (los modelos van dentro de la carpeta model).</p>
<p><strong>customers_model.php</strong></p>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">&lt;?php</span>
	<span style="color: #000000; font-weight: bold;">class</span> Customers_model <span style="color: #000000; font-weight: bold;">extends</span> Model <span style="color: #009900;">&#123;</span>
		<span style="color: #000000; font-weight: bold;">function</span> getAllPaginated<span style="color: #009900;">&#40;</span><span style="color: #000088;">$per_page</span><span style="color: #339933;">,</span><span style="color: #000088;">$segment</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
			<span style="color: #000088;">$this</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">db</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">order_by</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'id ASC'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
			<span style="color: #000088;">$q</span> <span style="color: #339933;">=</span> <span style="color: #000088;">$this</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">db</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">get</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'customers'</span><span style="color: #339933;">,</span><span style="color: #000088;">$per_page</span><span style="color: #339933;">,</span><span style="color: #000088;">$segment</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
			<span style="color: #000088;">$data</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">&quot;customers&quot;</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">=</span><span style="color: #990000;">array</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
			<span style="color: #b1b100;">if</span> <span style="color: #009900;">&#40;</span><span style="color: #000088;">$q</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">num_rows</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">&gt;</span> <span style="color: #cc66cc;">0</span><span style="color: #009900;">&#41;</span>
			<span style="color: #009900;">&#123;</span>
				<span style="color: #b1b100;">foreach</span> <span style="color: #009900;">&#40;</span><span style="color: #000088;">$q</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">result</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span> <span style="color: #b1b100;">as</span> <span style="color: #000088;">$row</span><span style="color: #009900;">&#41;</span>
				<span style="color: #009900;">&#123;</span>
					<span style="color: #000088;">$data</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">&quot;customers&quot;</span><span style="color: #009900;">&#93;</span><span style="color: #009900;">&#91;</span><span style="color: #000088;">$row</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">id</span><span style="color: #009900;">&#93;</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">&quot;id&quot;</span><span style="color: #009900;">&#93;</span> <span style="color: #339933;">=</span> <span style="color: #000088;">$row</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">id</span><span style="color: #339933;">;</span>
					<span style="color: #000088;">$data</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">&quot;customers&quot;</span><span style="color: #009900;">&#93;</span><span style="color: #009900;">&#91;</span><span style="color: #000088;">$row</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">id</span><span style="color: #009900;">&#93;</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">&quot;name&quot;</span><span style="color: #009900;">&#93;</span> <span style="color: #339933;">=</span> <span style="color: #000088;">$row</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">name</span><span style="color: #339933;">;</span>
					<span style="color: #000088;">$data</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">&quot;customers&quot;</span><span style="color: #009900;">&#93;</span><span style="color: #009900;">&#91;</span><span style="color: #000088;">$row</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">id</span><span style="color: #009900;">&#93;</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">&quot;lastname&quot;</span><span style="color: #009900;">&#93;</span> <span style="color: #339933;">=</span> <span style="color: #000088;">$row</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">lastname</span><span style="color: #339933;">;</span>
					<span style="color: #000088;">$data</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">&quot;customers&quot;</span><span style="color: #009900;">&#93;</span><span style="color: #009900;">&#91;</span><span style="color: #000088;">$row</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">id</span><span style="color: #009900;">&#93;</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">&quot;phone&quot;</span><span style="color: #009900;">&#93;</span> <span style="color: #339933;">=</span> <span style="color: #000088;">$row</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">phone</span><span style="color: #339933;">;</span>
					<span style="color: #000088;">$data</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">&quot;customers&quot;</span><span style="color: #009900;">&#93;</span><span style="color: #009900;">&#91;</span><span style="color: #000088;">$row</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">id</span><span style="color: #009900;">&#93;</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">&quot;address&quot;</span><span style="color: #009900;">&#93;</span> <span style="color: #339933;">=</span> <span style="color: #000088;">$row</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">address</span><span style="color: #339933;">;</span>
					<span style="color: #000088;">$data</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">&quot;customers&quot;</span><span style="color: #009900;">&#93;</span><span style="color: #009900;">&#91;</span><span style="color: #000088;">$row</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">id</span><span style="color: #009900;">&#93;</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">&quot;email&quot;</span><span style="color: #009900;">&#93;</span> <span style="color: #339933;">=</span> <span style="color: #000088;">$row</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">email</span><span style="color: #339933;">;</span>
				<span style="color: #009900;">&#125;</span>
			<span style="color: #009900;">&#125;</span>
			<span style="color: #b1b100;">return</span> <span style="color: #000088;">$data</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">&quot;customers&quot;</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">;</span>
		<span style="color: #009900;">&#125;</span>
&nbsp;
		<span style="color: #000000; font-weight: bold;">function</span> totalCustomers<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span>
		<span style="color: #009900;">&#123;</span>
			 <span style="color: #000088;">$q</span> <span style="color: #339933;">=</span> <span style="color: #000088;">$this</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">db</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">get</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'customers'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
			<span style="color: #b1b100;">return</span>  <span style="color: #000088;">$q</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">num_rows</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">;</span>
		<span style="color: #009900;">&#125;</span>
	<span style="color: #009900;">&#125;</span>
<span style="color: #000000; font-weight: bold;">?&gt;</span></pre></div></div>

<p>El método getAllPaginated nos regresa los registros paginados, y el método totalCustomers nos devuelve la cantidad de registros totales.</p>
<p>Ahora vamos a crear un controlador con un metodo index (los controladores van dentro de la carpeta controllers)</p>
<p><strong>customers.php</strong></p>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">&lt;?php</span>
	<span style="color: #000000; font-weight: bold;">class</span> Customers <span style="color: #000000; font-weight: bold;">extends</span> Controller <span style="color: #009900;">&#123;</span>
&nbsp;
		<span style="color: #000000; font-weight: bold;">function</span> Customers<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span>
		<span style="color: #009900;">&#123;</span>
			parent<span style="color: #339933;">::</span><span style="color: #004000;">Controller</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>	
			<span style="color: #000088;">$this</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">load</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">helper</span><span style="color: #009900;">&#40;</span><span style="color: #990000;">array</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'text'</span><span style="color: #339933;">,</span><span style="color: #0000ff;">'form'</span><span style="color: #339933;">,</span><span style="color: #0000ff;">'url'</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
			<span style="color: #000088;">$this</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">load</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">model</span><span style="color: #009900;">&#40;</span><span style="color: #990000;">array</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'customers_model'</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
		<span style="color: #009900;">&#125;</span>
&nbsp;
		<span style="color: #000000; font-weight: bold;">function</span> index<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span>
		<span style="color: #009900;">&#123;</span>
			<span style="color: #000088;">$pages</span><span style="color: #339933;">=</span><span style="color: #cc66cc;">10</span><span style="color: #339933;">;</span> <span style="color: #666666; font-style: italic;">//Numero de registros mostrados por páginas</span>
			<span style="color: #000088;">$this</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">load</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">library</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'pagination'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span> <span style="color: #666666; font-style: italic;">//Cargamos la librería de paginación</span>
			<span style="color: #000088;">$config</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">'base_url'</span><span style="color: #009900;">&#93;</span> <span style="color: #339933;">=</span> base_url<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">.</span><span style="color: #0000ff;">'index.php/customers/index'</span><span style="color: #339933;">;</span> <span style="color: #666666; font-style: italic;">// parametro base de la aplicación, si tenemos un .htaccess nos evitamos el index.php</span>
			<span style="color: #000088;">$config</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">'total_rows'</span><span style="color: #009900;">&#93;</span> <span style="color: #339933;">=</span> <span style="color: #000088;">$this</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">customers_model</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">totalCustomers</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">;</span>  
			<span style="color: #000088;">$config</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">'per_page'</span><span style="color: #009900;">&#93;</span> <span style="color: #339933;">=</span> <span style="color: #000088;">$pages</span><span style="color: #339933;">;</span> 
			<span style="color: #000088;">$config</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">'num_links'</span><span style="color: #009900;">&#93;</span> <span style="color: #339933;">=</span> <span style="color: #cc66cc;">2</span><span style="color: #339933;">;</span> <span style="color: #666666; font-style: italic;">//Numero de links mostrados en la paginación</span>
&nbsp;
			<span style="color: #000088;">$this</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">pagination</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">initialize</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$config</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span> 
&nbsp;
			<span style="color: #000088;">$data</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">&quot;customers&quot;</span><span style="color: #009900;">&#93;</span> <span style="color: #339933;">=</span> <span style="color: #000088;">$this</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">customers_model</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">getAllPaginated</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$config</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">'per_page'</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">,</span><span style="color: #000088;">$this</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">uri</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">segment</span><span style="color: #009900;">&#40;</span><span style="color: #cc66cc;">3</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
			<span style="color: #000088;">$this</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">load</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">view</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'customers'</span><span style="color: #339933;">,</span><span style="color: #000088;">$data</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span> <span style="color: #666666; font-style: italic;">//Cargamos la vista llamada customers.</span>
		<span style="color: #009900;">&#125;</span>
	<span style="color: #009900;">&#125;</span>
<span style="color: #000000; font-weight: bold;">?&gt;</span></pre></div></div>

<p>Ahora creamos la vista para mostrar los datos (las vistas van en la carpeta views).</p>
<p><strong>customers.php</strong></p>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;">&lt;html&gt;
	&lt;head&gt;
		&lt;title&gt;Customers&lt;/title&gt;
	&lt;/head&gt;
	&lt;body&gt;
		&lt;table border='1'&gt;
			&lt;tr&gt;
				&lt;td&gt;Name&lt;/td&gt;
				&lt;td&gt;Lastname&lt;/td&gt;
				&lt;td&gt;Phone&lt;/td&gt;
				&lt;td&gt;Address&lt;/td&gt;
				&lt;td&gt;Email&lt;/td&gt;
			&lt;/tr&gt;
		<span style="color: #000000; font-weight: bold;">&lt;?php</span> <span style="color: #b1b100;">foreach</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$customers</span> <span style="color: #b1b100;">as</span> <span style="color: #000088;">$customer</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span> <span style="color: #000000; font-weight: bold;">?&gt;</span>
			&lt;tr&gt;
				&lt;td&gt;<span style="color: #000000; font-weight: bold;">&lt;?php</span> <span style="color: #b1b100;">echo</span> <span style="color: #000088;">$customer</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">'name'</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">;</span> <span style="color: #000000; font-weight: bold;">?&gt;</span>&lt;/td&gt;
				&lt;td&gt;<span style="color: #000000; font-weight: bold;">&lt;?php</span> <span style="color: #b1b100;">echo</span> <span style="color: #000088;">$customer</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">'lastname'</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">;</span> <span style="color: #000000; font-weight: bold;">?&gt;</span>&lt;/td&gt;
				&lt;td&gt;<span style="color: #000000; font-weight: bold;">&lt;?php</span> <span style="color: #b1b100;">echo</span> <span style="color: #000088;">$customer</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">'phone'</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">;</span> <span style="color: #000000; font-weight: bold;">?&gt;</span>&lt;/td&gt;
				&lt;td&gt;<span style="color: #000000; font-weight: bold;">&lt;?php</span> <span style="color: #b1b100;">echo</span> <span style="color: #000088;">$customer</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">'address'</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">;</span> <span style="color: #000000; font-weight: bold;">?&gt;</span>&lt;/td&gt;
				&lt;td&gt;<span style="color: #000000; font-weight: bold;">&lt;?php</span> <span style="color: #b1b100;">echo</span> <span style="color: #000088;">$customer</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">'email'</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">;</span> <span style="color: #000000; font-weight: bold;">?&gt;</span>&lt;/td&gt;
			&lt;/tr&gt;
		<span style="color: #000000; font-weight: bold;">&lt;?php</span> <span style="color: #009900;">&#125;</span> <span style="color: #000000; font-weight: bold;">?&gt;</span>	
		&lt;/table&gt;
		<span style="color: #000000; font-weight: bold;">&lt;?php</span> <span style="color: #b1b100;">echo</span> <span style="color: #000088;">$this</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">pagination</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">create_links</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span> <span style="color: #666666; font-style: italic;">//Imprime la numeración de páginas ?&gt;</span>
	<span style="color: #339933;">&lt;/</span>body<span style="color: #339933;">&gt;</span>
<span style="color: #339933;">&lt;/</span>html<span style="color: #339933;">&gt;</span></pre></div></div>

<p>Listo!!</p>
<p>Queda como se muestra en las imágenes..<br />
<img src="http://www.ubicuos.com/wp-content/uploads/2010/12/pag1.png" alt="" title="pag1" width="524" height="457" class="aligncenter size-full wp-image-2500" /></p>
<p><img src="http://www.ubicuos.com/wp-content/uploads/2010/12/pag2.png" alt="" title="pag2" width="522" height="456" class="aligncenter size-full wp-image-2501" /></p>
<p><img src="http://www.ubicuos.com/wp-content/uploads/2010/12/pag3.png" alt="" title="pag3" width="521" height="458" class="aligncenter size-full wp-image-2505" /></p>
<p>Listo..<br />
Dudas, sugerencia y/ó comentarios, son bién recibidos..</p>
<p>Saludos..</p>
]]></content:encoded>
			<wfw:commentRss>http://www.ubicuos.com/2010/12/28/paginacion-en-codeigniter/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Doce errores de programación que se deben evitar</title>
		<link>http://www.ubicuos.com/2010/12/27/doce-errores-de-programacion-que-se-deben-evitar/</link>
		<comments>http://www.ubicuos.com/2010/12/27/doce-errores-de-programacion-que-se-deben-evitar/#comments</comments>
		<pubDate>Tue, 28 Dec 2010 00:56:10 +0000</pubDate>
		<dc:creator>fernandomt_08</dc:creator>
				<category><![CDATA[Empresas]]></category>
		<category><![CDATA[Programación]]></category>
		<category><![CDATA[prgramadores]]></category>
		<category><![CDATA[tecnicas de programacion]]></category>

		<guid isPermaLink="false">http://www.ubicuos.com/?p=2487</guid>
		<description><![CDATA[Cuentále a tus amigos en Facebook Introduccion Una revista de autos una vez declaró que un vehículo tiene &#8220;carácter&#8221;, si se necesitan 15 minutos para explicar su idiosincrasia antes de que pueda ser prestado a un amigo. Mediante esa norma, cada pieza de software tiene un carácter &#8211; con demasiada frecuencia, apenas sale de la [...]]]></description>
			<content:encoded><![CDATA[<div align="left" style="padding: 0px 5px 5px 0px; clear: left; float: left;"><a name="fb_share" type="button_count" share_url="http://www.ubicuos.com/2010/12/27/doce-errores-de-programacion-que-se-deben-evitar/">Cuentále a tus amigos en Facebook</a></div><div class="tweetmeme_button" style="float: left; margin-left: 10px;width:90px">
			<a href="http://api.tweetmeme.com/share?url=http%3A%2F%2Fwww.ubicuos.com%2F2010%2F12%2F27%2Fdoce-errores-de-programacion-que-se-deben-evitar%2F"><br />
				<img src="http://api.tweetmeme.com/imagebutton.gif?url=http%3A%2F%2Fwww.ubicuos.com%2F2010%2F12%2F27%2Fdoce-errores-de-programacion-que-se-deben-evitar%2F&amp;style=compact&amp;b=2" height="61" width="50" /><br />
			</a>
		</div>
<h2>Introduccion</h2>
<p>Una revista de autos una vez declaró que un vehículo tiene &#8220;carácter&#8221;, si se necesitan 15 minutos para explicar su idiosincrasia antes de que pueda ser prestado a un amigo. Mediante esa norma, cada pieza de software tiene un carácter &#8211; con demasiada frecuencia, apenas sale de la caja.</p>
<p>La mayoría de las &#8220;peculiaridades&#8221; de la programación son propias de un contexto particular, lo que hace que sean muy oscuras. Los sitios web que ofrecen datos XML, por ejemplo, no puede haber sido codificados para decirle al navegador que espere los datos XML, causando una demorade todas las funciones hasta que el valor correcto encaje en su lugar..</p>
<p><a rel="attachment wp-att-2491" href="http://www.ubicuos.com/2010/12/27/doce-errores-de-programacion-que-se-deben-evitar/tabla1/"><img class="alignleft size-full wp-image-2491" title="tabla1" src="http://www.ubicuos.com/wp-content/uploads/2010/12/tabla1.jpg" alt="" width="417" height="316" /></a></p>
<p>Sin embargo, ciertas prácticas de programación hacen que la mayoría de los desarrolladores se tire de los cabellos al abrir un archivo que ha estado exhibiendo demasiada &#8220;personalidad&#8221;. Pase un tiempo en un bar cerca de cualquier compañía de tecnología, y escuchará los gritos: ¿Por qué el programador sigue utilizando esa estructura anticuada? ¿Dónde estaba el mecanismo de defensa contra los ataques de la web? ¿No había ninguna reflexión sobre lo que un novato haría con el programa?</p>
<p>Criaturas de hábitos, nosotros los desarrolladores parecemos encerrados en ciertos modos de falla que no pueden ser evitados, como es la frecuencia con la que somos víctimas de una particular práctica pobre de programación.</p>
<p>A continuación encontrará las dificultades de programación más comunes, cada una de ellas está acompañada por su opositora, dejando una prueba de que la programación, de hecho, se está convirtiendo en un arte -que requiere una mano hábil y una mente creativa para lograr un justo medio entre los extremos problemáticos.<span id="more-2487"></span></p>
<p><strong>Error de programación Nº 1: Acelerándolo y haciéndolo fallar</strong><br />
Apuntalar las bases es la forma más fácil de socavar el código. Con frecuencia esto significa perder de vista cómo el comportamiento arbitrario del usuario afectará su programa. ¿La entrada de un cero encontrará su camino en una operación de división? ¿El texto introducido es de la longitud correcta? ¿Los formatos de fecha han sido controlados? ¿El nombre del usuario ha sido verificado en la base de datos? Los errores en los lugares más pequeños hacen que el software falle.</p>
<p>La peor parte de la programación descuidada es que los avances en el diseño de lenguaje destinados a solucionar estos problemas no hacen su trabajo. Tome la última versión de Java, que trata de hacer la comprobación de puntero nulo más fácil, ofreciendo sintaxis abreviada para la prueba sin fin de puntero. Simplemente añadiendo un signo de interrogación a cada invocación de método, incluye automáticamente una prueba de punteros nulos, en sustitución de un nido de ratas de las posibles declaraciones, tales como:</p>

<div class="wp_syntax"><div class="code"><pre class="java" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">public</span> <span style="color: #003399;">String</span> getPostcode<span style="color: #009900;">&#40;</span>Person person<span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
<span style="color: #003399;">String</span> ans<span style="color: #339933;">=</span> <span style="color: #000066; font-weight: bold;">null</span><span style="color: #339933;">;</span>
<span style="color: #000000; font-weight: bold;">if</span> <span style="color: #009900;">&#40;</span>person <span style="color: #339933;">!=</span> <span style="color: #000066; font-weight: bold;">null</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
<span style="color: #003399;">Name</span> nm<span style="color: #339933;">=</span> person.<span style="color: #006633;">getName</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #000000; font-weight: bold;">if</span> <span style="color: #009900;">&#40;</span>nm<span style="color: #339933;">!=</span> <span style="color: #000066; font-weight: bold;">null</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
ans<span style="color: #339933;">=</span> nm.<span style="color: #006633;">getPostcode</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span>
<span style="color: #009900;">&#125;</span>
<span style="color: #000000; font-weight: bold;">return</span> ans
<span style="color: #009900;">&#125;</span></pre></div></div>

<p>Con esto:</p>

<div class="wp_syntax"><div class="code"><pre class="java" style="font-family:monospace;">   <span style="color: #000000; font-weight: bold;">public</span> <span style="color: #003399;">String</span> getFirstName<span style="color: #009900;">&#40;</span>Person person<span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
      <span style="color: #000000; font-weight: bold;">return</span> person<span style="color: #339933;">?</span>.<span style="color: #006633;">getName</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">?</span>.<span style="color: #006633;">getGivenName</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
    <span style="color: #009900;">&#125;</span></pre></div></div>

<p>Al final, sin embargo, estas mejoras de sintaxis solo se puede evitar que el código se estrelle, no aseguran que sea útil. Después de todo, no eliminan la raíz del problema: la proliferación de los valores nulos debido a la programación rápida y suelta.</p>
<p><strong>Error de programación Nº 2: La sobrecarga de detalles en la otra cara<br />
</strong>El software excesivamente abotonado puede frenarlo hasta hacer que se arrastre. La comprobación de unos pocos punteros nulos no puede hacer mucha diferencia, pero algunos software se escriben para ser como un obsesivo-compulsivo, que debe verificar que las puertas estén bloqueadas una y otra vez, de tal modo que el sueño no llega nunca.</p>
<div><a rel="attachment wp-att-2494" href="http://www.ubicuos.com/2010/12/27/doce-errores-de-programacion-que-se-deben-evitar/20080624-consejos-para-ser-un-buen-programador/"><img class="alignleft size-full wp-image-2494" title="20080624-Consejos-para-ser-un-buen-programador" src="http://www.ubicuos.com/wp-content/uploads/2010/12/20080624-Consejos-para-ser-un-buen-programador.jpg" alt="" width="300" height="183" /></a>La dedicación incansable a los detalles, incluso puede bloquear el  software si el control obsesivo requiere comunicarse con un sitio web a  distancia sobre la red. Tengo varios paquetes que se frenan a paso de  tortuga si los utilizo en una laptop sin conexión a Internet W-iFi, ya  que están tratando desesperadamente de llamar a casa para ver si una  nueva versión puede estar disponible. El Wi-Fi LED parpadea, y el  software se bloquea, buscando constantemente un punto de acceso que no  está allí.</div>
<div>El desafío es diseñar las capas del código para comprobar los  datos cuando aparecen por primera vez, pero esto es mucho más fácil  decirlo que hacerlo. Si varios programadores trabajan en una biblioteca,  o incluso si solo uno hace toda la codificación, es difícil recordar si  el puntero se comprobó, y cuándo fue.</div>
<div></div>
<div><strong>Error de programación Nº 3: No simplificar el control muy a menudo<br />
</strong>Los desarrolladores invitan al desastre por no simplificar el control sobre las tareas en su código.</div>
<div>Mike Subelsky, uno de los co-fundadores de OtherInBox.com, es un  entusiasta defensor de la existencia de un único lugar en el código para  cada puesto de trabajo. Si hay dos lugares, las probabilidades son que  alguien cambie una y la otra no. Si hay más de dos, las probabilidades  de que alguien va a dejar de mantener a todos trabajando de la misma  manera empeoran aún más.</div>
<div>
<div>&#8220;Habiendo trabajado en base a un código por más de tres años, mi  mayor pesar, es no estar haciendo el código más modular&#8221;, señala  Subelsky. &#8220;He aprendido a la fuerza porqué es tan importante el  Principio de Responsabilidad individual. Me adhiero a él con fuerza en  el nuevo código, y es lo primero que ataco al refactorizar el código  antiguo&#8221;.</div>
<div>Subelsky, como usted puede suponer, es un programador de Ruby  on Rails. El Framework alienta el código magro asumiendo que la mayor  parte de la estructura del programa se divide en patrones conocidos, una  filosofía que los programadores de Rails a menudo resumen como  &#8220;convención no configuración&#8221;. El programa asume que si alguien crea un  objeto de tipo Nombre con dos campos primer nombre y apellido, entonces,  inmediatamente debe crear una tabla de base de datos llamada Nombre con  dos columnas, primer nombre y apellido. Los nombres se especifican en  un solo lugar, evitando cualquier problema posterior si alguien no puede  cumplir todas las capas de la configuración en sincronización.</div>
<div></div>
<div><strong>Error de programación Nº 4: Delegarle demasiado a frameworks<br />
</strong>Algunas  veces las herramientas mágicas solo conducen a la confusión. Al  abstraer la funcionalidad y asumiendo lo que queremos, los frameworks  muy a menudo dejan a los desarrolladores en pérdida por lo que salió mal  en su código.</div>
<div>G. Blake Meike, un programador con sede cerca de Seattle, es  uno de los muchos desarrolladores que encuentra la excesiva dependencia  de las herramientas automatizadas, como Ruby on Rails, como un obstáculo  cuando se trata de producir un código limpio.</div>
<div>“Convención, por definición, es  algo fuera del código&#8221;, señala Meike. &#8220;A menos que sepa las reglas de  Ruby on Rails para convertir una URL en una llamada al método, por  ejemplo, no hay manera, en absoluto, que se de cuenta de lo que  realmente sucede en respuesta a una consulta&#8221;.</div>
<div>Él considera que la lectura del código a menudo significa  tener un manual cerca para descifrar lo que el código está haciendo a  sus espaldas</div>
</div>
<div>&#8220;Las reglas no son del todo triviales, y al mismo tiempo bastante  razonables. Con el fin de trabajar sobre una aplicación Ruby on Rails,  solo hay que conocerlas. A medida que la aplicación crece, depende cada  vez más de estos pedacitos casi triviales de conocimiento externo.  Eventualmente, la suma de todos los bits casi triviales es,  decididamente, no trivial. Es una ecósfera de cosas que tiene que  aprender a trabajar sobre la aplicación y recordar mientras la está  depurando&#8221;, indica.</div>
<div>Para empeorar las cosas, los frameworks a menudo lo pueden  dejar a usted, y a cualquiera que venga después de usted, enredado con  un código que es muy difícil de entender, modificar o ampliar.</div>
<div>Como Mike Morton, otro programador, explica, &#8220;Te llevan el  90% del camino hacia la cima de la montaña en una silla de manos, pero  eso es todo. Si quiere hacer el último 10%, tendría que haberlo pensado  antes y haber llevado oxígeno y pitones&#8221;.</div>
<div><strong>Error de programación Nº 5: Confiar en el cliente<br />
</strong>Muchos  de los peores errores de seguridad aparecerán cuando los  desarrolladores asumen que el dispositivo del cliente hará lo correcto.  Por ejemplo, el código escrito para ejecutarse en un navegador puede ser  reescrito por el navegador para ejecutar cualquier acción arbitraria.  Si el desarrollador no vuelva a comprobar todos los datos que vienen de  vuelta, cualquier cosa puede salir mal.</div>
<div>Uno de los ataques más simples se basa en el hecho de que  algunos programadores solo pasan de largo los datos del cliente a la  base de datos, un proceso que funciona bien hasta que el cliente decide  enviar por SQL en lugar de una respuesta válida. Si un sitio web pide un  nombre de usuario y añade el nombre de una consulta, el atacante puede  escribir en el nombre x; usuarios de DROP TABLE; La base de datos  debidamente asume que el nombre es x y luego pasa al siguiente comando,  que suprime la mesa llena con todos los usuarios.</div>
<div>Hay muchas otras maneras en que la gente inteligente puede  abusar de la confianza del servidor. Las encuestas web son invitaciones  para inyectar sesgo. Los desbordamientos de búfer siguen siendo una de  las maneras más sencillas de corromper software.</div>
<div>Para empeorar las cosas, los agujeros de seguridad graves  pueden surgir cuando se encadenan tres o cuatro agujeros aparentemente  benignos. Un programador puede dejar que el cliente escriba un archivo  si se asume que los permisos del directorio serán suficientes para  detener cualquier escritura caprichosa. Otro puede abrir los permisos  solo para corregir algunos errores aleatorios. Solo que no hay  problemas, pero en conjunto, estas decisiones de codificación puede  entregar acceso arbitrario al cliente.</div>
<div><strong>Error de programación Nº 6: No confíe del todo en el cliente<br />
</strong>Algunas  veces, demasiada seguridad puede llevar, paradójicamente, a agujeros  abiertos. Hace apenas unos días, me dijeron que la manera de resolver un  problema con una determinada pieza de software ha sido solo para &#8220;chmod  777&#8243; el directorio y todo su interior. Demasiada seguridad terminó  dañando las obras, dejando a los desarrolladores con las restricciones  flojas oólo para mantener los procesos en ejecución.</div>
<div>Los formularios web son otro campo de batalla donde la  confianza puede hacerle ahorrar en el largo plazo. No solo a nivel de  seguridad del banco, los largos cuestionarios de datos personales, y la  confirmación de direcciones de correo electrónico, desalientan a la  gente de participar incluso en sitios relacionados con el chisme, pero  tener que proteger esos datos una vez que se eligieron y almacenaron,  puede ser un problema mucho mayor de lo que en realidad es.</div>
<div>Debido a esto, muchos desarrolladores web están buscando  reducir la seguridad tanto como sea posible, no solo para hacer que a  las personas se les haga más fácil engancharse con sus productos, sino  también ahorrarles el problema de defender más de la cantidad mínima de  datos necesarios para establecer una cuenta.</div>
<div>Mi libro, &#8220;Bases de datos traslúcidas&#8221;, describe una serie de  formas en que las bases de datos pueden almacenar menos información,  mientras que prestan los mismos servicios.</div>
<div></div>
<div><strong>Error de programación Nº 7: Confiar demasiado en las cajas mágicas<br />
</strong>¿Preocupado  acerca de la seguridad? Solo añada un poco de criptografía. ¿Quiere que  su base de datos realice copias de seguridad? Basta con pulsar el botón  de reproducción automática. No se preocupe. El vendedor dijo:  &#8220;Simplemente funciona&#8221;.</div>
<div>Los programadores de computadoras son muy suertudos. Después  de todo, los científicos de la computación siguen creando bibliotecas  maravillosas llenas de un sinfín de opciones para arreglar lo que aflige  a nuestro código. El único problema es que la facilidad con la que  alguien puede aprovechar el trabajo de otro también puede ocultar los  problemas complejos que se pasan por alto o, peor aún, introducir nuevos  obstáculos en nuestro código.</div>
<div>La criptografía es una de las principales fuentes de  debilidad aquí, señala John Viega, co-autor de &#8220;24Pecados Capitales de  Seguridad de Internet: Defectos de programación y cómo solucionarlos&#8221;.  Muchos programadores asumen que se pueden vincular en la biblioteca de  encriptación, pulsar un botón, y tener una seguridad férrea.</div>
<div>Pero la realidad es que muchos de estos algoritmos mágicos tienen  deficiencias sutiles, y evitar estas debilidades requiere aprender más  de lo que está en la sección de inicio rápido del manual. Para empeorar  las cosas, solo saber que tiene que mirar más allá de la sección de  inicio rápido supone un nivel de conocimiento que va más allá de lo que  está cubierto en la sección de inicio rápido, esta es probablemente la  razón por la que muchos programadores están confiando la seguridad de su  código a la sección de inicio rápido en primer lugar. Como dicen los  profesores: &#8220;Usted no puede saber lo que no conoce&#8221;.</div>
<div></div>
<div><strong>Error de programación Nº 8: Reinventando la rueda<br />
</strong>Una  vez más, hacer su propio yogur, matar a sus propios cerdos, y escribir  sus propias bibliotecas solo porque usted piensa sabe una mejor manera  de codificar, puede volverse en su contra.</div>
<div>&#8220;Cultivar su propia criptografía es una agradable vista para  los atacantes&#8221;, señala Viega, incluso los expertos cometen errores al  tratar de impedir que otros encuentren y exploten las debilidades en sus  sistemas.</div>
<div>Por lo tanto, ¿en quién confiar: en usted o en los llamados expertos que también cometen errores?</div>
<div>La respuesta cae en el ámbito de la gestión de riesgo. Muchas  bibliotecas no necesitan ser perfectas, por lo que acaparar una caja  mágica es probable que sea mejor que el código que escribe. La colección  incluye rutinas escritas y optimizadas por grupo. Pueden cometer  errores, pero el proceso más amplio puede eliminar muchos de ellos.</div>
<div><strong>Error de programación Nº9: Demasiada apertura a los usuarios<br />
</strong>Los  programadores aman poder acceder a las variables y ajustar muchas  partes de una pieza de software, pero la mayoría de los usuarios no  pueden imaginar siquiera cómo hacerlo.</div>
<div>Por ejemplo Android. La última vez que instalé un paquete de  software para mi teléfono Android, me pidió la aprobación de cinco o  seis maneras en que el software podía acceder a mi información. Por  supuesto, el equipo de Android ha creado un conjunto maravillosamente  detallado de las opciones que me permite habilitar o no el software en  función de si se requiere el acceso a la cámara, seguimiento de mi  ubicación, o una docena de otras opciones. Pero poniendo en los usuarios  la responsabilidad de personalizar funcionalidades que no entienden por  completo, puede provocar un desastre en forma de agujeros de seguridad  inadvertidos y violaciones de privacidad, por no hablar de software que  puede resultar demasiado frustrante o confuso para su mercado objetivo</div>
<div>La ironía es que, a pesar de estar obsesionados con listas de  control a la hora de tomar decisiones de compra, la mayoría de usuarios  no pueden controlar la amplitud de las prestaciones ofrecidas por cada  acto de software. Con demasiada frecuencia, las características  adicionales desordenan la experiencia, haciendo que el software sea  difícil de navegar y usar.</div>
<div><strong>Error de programación Nº 10: Sobre determinar la experiencia de los usuarios<br />
</strong>Algunos  desarrolladores deciden evitar el problema de demasiadas  características, ofreciendo exactamente una solución. Gmail es famoso  por ofrecer solo algunas opciones que los desarrolladores aman. Usted no  tiene carpetas, pero puede rotular o etiquetar correo con palabras, una  característica que los desarrolladores argumentan es aún más potente.</div>
<div>Esto puede ser cierto, pero si a los usuarios no les gusta la  idea, se buscan formas de evitar estas limitaciones -un resultado que  podría traducirse en problemas de seguridad o el aumento de la  competencia no deseada. La búsqueda de este medio entre simple y rico en  funciones es un desafío interminable que puede resultar costoso.</div>
<div><strong>Error de programación Nº 11: Cerrando la fuente<br />
</strong>Uno  de los retos más difíciles para cualquier empresa es determinar cuánto  se comparte con las personas que utilizan el software.</div>
<div>John Gilmore, co-fundador de una de las primeras compañías de  software de código abierto, Cygnus Solutions, señala que la decisión de  no distribuir el funcionamiento del código va contra la integridad de  dicho Código, siendo una de las maneras más fáciles de desalentar la  innovación y, lo más importante, descubrir y corregir los errores.</div>
<div>&#8220;Un resultado práctico de la apertura de su código es que  gente de la que nunca ha oído hablar contribuirá a mejorar su software&#8221;,  señala Gilmore. &#8220;Van a encontrar errores (y tratar de solucionarlos);  van a agregar funciones que van a mejorar la documentación. Incluso  cuando su mejora ha sido hecha de forma amateur, unos minutos de  reflexión le revelarán una manera más armoniosa de lograr un resultado  similar&#8221;.</div>
<div>Las ventajas son más profundas. A menudo, el propio código  crece más modular y mejor estructurado conforme los demás vuelven a  compilar el programa y lo trasladan a otras plataformas. Solo la  apertura del código le obliga a hacer que la información sea más  accesible, comprensible, y mejor. A medida que hacemos los pequeños  ajustes para compartir el código, ellos alimentan los resultados de  nuevo en la base del código.</div>
<div><strong>Error de programación Nº 12: Suponer que la apertura es una panacea<br />
</strong>Millones  de proyectos de código abierto se han puesto en marcha, y solo una  pequeña fracción atrae cada vez a más de unas pocas personas para ayudar  a mantener, modificar o ampliar el código. En otras palabras, W.P.  Kinsella &#8220;si lo construyes, ellos vendrán&#8221; no siempre produce resultados  prácticos.</div>
<div>Mientras que la apertura puede permitir que otros entren al  juego y, por lo tanto, mejorar el código, el mero hecho de que esté  abierto no servirá de mucho a menos que haya un incentivo para los  colaboradores externos pongan el trabajo. Las pasiones entre los  defensores del código abierto pueden cegar a algunos desarrolladores  sobre la realidad de que la apertura por sí sola no impide los agujeros  de seguridad, fallas de eliminación, o que se haga gran cantidad de  código sin terminar intrínsecamente útil. La gente tiene otras cosas que  hacer, y una pila de código abierto tiene que competir con el  excursionismo, la familia, bares y puestos de trabajo remunerados.</div>
<div>La apertura de un proyecto también puede agregar una  sobrecarga para las comunicaciones y la documentación. Un proyecto de  código cerrado requiere documentación sólida para los usuarios, pero un  buen proyecto de código abierto viene con una amplia documentación de la  API y los mapas de ruta para el desarrollo futuro. Este trabajo extra  vale la pena para los grandes proyectos, pero puede llegar a hacerse  pesado para los más pequeños.</div>
<div>Con demasiada frecuencia, el código que trabaja parte del  tiempo es planteado en SourceForge con la esperanza de que los elfos  mágicos dejen de producir los zapatos y se apresuran a poner en marcha  el compilador -una decisión que puede descarrilar el impulso de un  proyecto antes de que realmente se inicie.</div>
<div>La apertura del proyecto también puede eliminar el apoyo  financiero y fomentar una especie de ley de la calle. Muchas compañías  de código abierto tratan de mantener alguna característica propietaria  en su control, lo que les da cierta ventaja al obtener gente que pague  para apoyar al equipo de desarrollo. Los proyectos que se basan más en  los voluntarios que en los programadores pagados a menudo encuentran que  los voluntarios son impredecibles. Mientras que la competitividad y la  creatividad muy abiertas pueden dar grandes resultados, algunos de huyen  de nuevo hacia la estructura, jerarquía, y el desarrollo de apoyo  metódico y autoritario.</div>
<div></div>
<div><strong>Peter Wayner, InfoWorld</strong></div>
]]></content:encoded>
			<wfw:commentRss>http://www.ubicuos.com/2010/12/27/doce-errores-de-programacion-que-se-deben-evitar/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Como hacer un Syntax Highlight en C#</title>
		<link>http://www.ubicuos.com/2010/12/04/como-hacer-un-syntax-highlight-en-c/</link>
		<comments>http://www.ubicuos.com/2010/12/04/como-hacer-un-syntax-highlight-en-c/#comments</comments>
		<pubDate>Sun, 05 Dec 2010 04:47:45 +0000</pubDate>
		<dc:creator>Roberto Carlos</dc:creator>
				<category><![CDATA[General]]></category>
		<category><![CDATA[Programación]]></category>
		<category><![CDATA[Tecnología]]></category>
		<category><![CDATA[csharp]]></category>
		<category><![CDATA[dotnet]]></category>
		<category><![CDATA[syntax highlight]]></category>

		<guid isPermaLink="false">http://www.ubicuos.com/?p=2462</guid>
		<description><![CDATA[Cuentále a tus amigos en Facebook En esta ocasión aquí les dejo un tutorial de cómo realizar un pequeño Syntax Highlight en C#, ya que realizarlo completo seria muy complejo, aquí lo básico para iniciar a crear un Syntax Highlight.  Lo primero que necesitamos es insertar un RichTextBox y poner las siguientes propiedades del RichTextBox [...]]]></description>
			<content:encoded><![CDATA[<div align="left" style="padding: 0px 5px 5px 0px; clear: left; float: left;"><a name="fb_share" type="button_count" share_url="http://www.ubicuos.com/2010/12/04/como-hacer-un-syntax-highlight-en-c/">Cuentále a tus amigos en Facebook</a></div><div class="tweetmeme_button" style="float: left; margin-left: 10px;width:90px">
			<a href="http://api.tweetmeme.com/share?url=http%3A%2F%2Fwww.ubicuos.com%2F2010%2F12%2F04%2Fcomo-hacer-un-syntax-highlight-en-c%2F"><br />
				<img src="http://api.tweetmeme.com/imagebutton.gif?url=http%3A%2F%2Fwww.ubicuos.com%2F2010%2F12%2F04%2Fcomo-hacer-un-syntax-highlight-en-c%2F&amp;style=compact&amp;b=2" height="61" width="50" /><br />
			</a>
		</div>
<p style="text-align: justify">En esta ocasión aquí les dejo un tutorial de cómo realizar un pequeño Syntax Highlight en C#, ya que realizarlo completo seria muy complejo, aquí lo básico para iniciar a crear un Syntax Highlight. </p>
<p style="text-align: justify">Lo primero que necesitamos es insertar un RichTextBox y poner las siguientes propiedades del RichTextBox como se indican </p>
<p style="text-align: justify"><strong>AcceptsTab = True</strong> </p>
<p style="text-align: justify">Para que mientras escribamos se pueda usar la tecla TAB en lugar de que con ella se pase al siguiente componente en el formulario. </p>
<p style="text-align: justify"><strong>DetectUrls = False</strong> </p>
<p style="text-align: justify">Voy a desactivar esta opción para que no se mezcle con la forma de resaltar código. </p>
<p style="text-align: justify"><strong>Font-name = Consolas </strong> </p>
<p style="text-align: justify">Utilizo esta fuente para que se vea como código y no como texto normal. </p>
<p style="text-align: justify">Cada vez que el texto cambie, tenemos que volver a darle formato al texto. Es por esta razón que todo el código necesario lo vamos a programar en el evento Text_Changed del RichTextBox. <span id="more-2462"></span></p>
<p style="text-align: justify">Lo que tenemos que hacer en este evento es ir seleccionando porciones de texto y cambiándole valores como color, fuente, etc. Podemos seleccionar todo el texto usando el comando SelectAll o porciones de texto usando el atributo SelectionStart y SelectionLength que marcan el inicio y longitud del pedazo seleccionado. Una vez que seleccionamos un pedazo de texto, podemos aplicarle formato utilizando una serie de propiedades, pero la que usaremos en este ejemplo es simplemente SelectionColor que nos permitirá cambiarle el color al texto seleccionado. </p>
<p style="text-align: justify">Para poder utilizar expresiones regulares en nuestro Sintax Highlight es necesario utilizar el siguiente nameSpace : </p>

<div class="wp_syntax"><div class="code"><pre class="csharp" style="font-family:monospace;"><span style="color: #0600FF; font-weight: bold;">using</span> <span style="color: #008080;">System.Text.RegularExpressions</span><span style="color: #008000;">;</span></pre></div></div>

<p>Ponemos el siguiente código dentro del evento Text_Changed del RichTextBox. </p>

<div class="wp_syntax"><div class="code"><pre class="csharp" style="font-family:monospace;"><span style="color: #008080; font-style: italic;">// Esta primer linea es necesari para evitar el parparpadeo que se produce al seleccionar texto en diferentes partes, lo cual se produce demasioadp rapido y solo vemos el parpadeo richTextBox1.Enabled = false; //Desabilitamos el RichTextBox int selStart = richTextBox1.SelectionStart; int selLength = richTextBox1.SelectionLength;</span></pre></div></div>

<p>// Nos aseguramos de que todo el texto<br />
// este negro antes de ponerle color<br />
richTextBox1.SelectAll();<br />
richTextBox1.SelectionColor = Color.Black;</p>
<p>Regex reg;<br />
MatchCollection partes;</p>
<p>// validamos palabras reservadas<br />
reg = new Regex(&#8220;(drop|select|table|insert into|from|update|values|where|alter|create|if|exists|foreign key|primary key|constraint|default|engine|InnoDB|charset|not|null)&#8221;);<br />
partes = reg.Matches(richTextBox1.Text.ToLower());<br />
for (int i = 0; i &lt; partes.Count; i++)<br />
{<br />
richTextBox1.SelectionStart = partes[i].Index;<br />
richTextBox1.SelectionLength = partes[i].Length;<br />
richTextBox1.SelectionColor = Color.Blue;<br />
}<br />
reg = new Regex(&#8220;(int|float|double|varchar|date)&#8221;);<br />
partes = reg.Matches(richTextBox1.Text);<br />
for (int i = 0; i &lt; partes.Count; i++)<br />
{<br />
richTextBox1.SelectionStart = partes[i].Index;<br />
richTextBox1.SelectionLength = partes[i].Length;<br />
richTextBox1.SelectionColor = Color.Blue;<br />
}</p>
<p>// Validamos los numero<br />
reg = new Regex(&#8220;(1|2|3|4|5|6|7|8|9|0)&#8221;);<br />
partes = reg.Matches(richTextBox1.Text);<br />
for (int i = 0; i &lt; partes.Count; i++)<br />
{<br />
richTextBox1.SelectionStart = partes[i].Index;<br />
richTextBox1.SelectionLength = partes[i].Length;<br />
richTextBox1.SelectionColor = Color.Magenta;<br />
}<br />
// Validamos cadenas<br />
reg = new Regex(&#8220;[\"][^\"]*[\"]&#8220;);//|[\'][^\']*[\']&#8220;);<br />
partes = reg.Matches(richTextBox1.Text);<br />
for (int i = 0; i &lt; partes.Count; i++)<br />
{<br />
richTextBox1.SelectionStart = partes[i].Index;<br />
richTextBox1.SelectionLength = partes[i].Length;<br />
richTextBox1.SelectionColor = Color.Orange;<br />
}</p>
<p>// Validamos cadenas<br />
reg = new Regex(&#8220;[\'/')][^\'/']*[\'/']&#8220;);<br />
partes = reg.Matches(richTextBox1.Text);<br />
for (int i = 0; i &lt; partes.Count; i++)<br />
{<br />
richTextBox1.SelectionStart = partes[i].Index;<br />
richTextBox1.SelectionLength = partes[i].Length;<br />
richTextBox1.SelectionColor = Color.Gray;<br />
}</p>
<p>// Regresamos todo a su sitio, también volvemos a habilitar el RichTextBox que fue desabilitado para evitar el parpadeo<br />
richTextBox1.SelectionStart = selStart;<br />
richTextBox1.SelectionLength = selLength;</p>
<p>richTextBox1.Enabled = true;<br />
richTextBox1.Focus();</p>
<p>Obtendriamos el siguiente resultado:</p>
<p><a rel="attachment wp-att-2476" href="http://www.ubicuos.com/2010/12/04/como-hacer-un-syntax-highlight-en-c/syntax/"><img class="aligncenter size-full wp-image-2476" src="http://www.ubicuos.com/wp-content/uploads/2010/12/syntax.png" alt="" width="352" height="324" /></a></p>
<p style="text-align: justify">Este pequeño tutorial esta basado en la sintaxis de MySql lo complejo de SyntaxHighlight depende de la sintaxis que te quieras basar y todo lo que quieras abarcar, como mencione anteriormente este es un tutorial sumamente sencillo basado en lo mas básico. <br />
Espero y les sea de ayuda!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.ubicuos.com/2010/12/04/como-hacer-un-syntax-highlight-en-c/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

<!-- Performance optimized by W3 Total Cache. Learn more: http://www.w3-edge.com/wordpress-plugins/

Minified using disk: basic
Page Caching using disk: enhanced
Database Caching 54/105 queries in 3.646 seconds using disk: basic

Served from: www.ubicuos.com @ 2012-02-05 08:11:07 -->
