Web 2.0 Tips

Icon

Consejos y trucos para el desarrollo y diseño de webs

Guardando contraseñas de forma correcta (hashes + salts)

Siempre que tenemos que hacer un sistema que maneje usuarios,
necesitamos tener algún método para identificar que realmente sea el
usuario el que va a entrar al sistema, para eso lo mas usado siempre
es el metodo de usuario / contraseña. Y lo mas común es que usemos una
base de datos para guardarlos.

El tema es, que pasa si alguien por algún método puede leer la base de
datos donde guardamos nuestras contraseñas, puede hacerce no solo con
su usuario en nuestro sistema, sino con la contraseña del usuario que
puede ser utilizada en varios sitios aparte del nuestro, es una
cuestion tanto técnica como ética nunca guardar la contraseña de
nuestros usuarios en texto claro. Pero ¿que métodos podemos usar? Aca
van algunos…

Leer este tip »


Animación en CSS3 en un :hover (mouseover)

Les voy a dejar un buen tip que lo usamos en DreamDesigners, para varios proyectos.

Como animar un div mediante una acción con el mouse (mouse over) que en la sintaxis de css sería :hover

La idea será realizar un tooltip hecho 100% con las transiciones de CSS3 sin necesidad de utilizar Javascript o JQuery.

Antes que nada, tenemos que saber que los nuevos browsers ya soportan css3, aunque muchos todavía no de forma nativa, por lo tanto debemos utilizar a la hora de “animar” ciertos prefijos en el código del style.

Leer este tip »


Limpiar string para fabricar urls “amigables” en PHP

Hoy por hoy no importa que nuestra web anda sin errores y rápida, también tiene que hacerlo sobre urls humanamente amigables. ¿Qué quiere decir esto? que en vez de:

http://nuestraweb.com/index.php?seccion=articles&id=323

Debemos tener algo así:

http://nuestraweb.com/articles/323-mi-first-notebook.html

Leer este tip »


Saber el tamaño de un elemento, width vs outerWidth en jQuery

Muchas veces necesitamos saber cual es el ancho de un elemento, podemos saberlo de entrada si nosotros mismos lo definimos y si no se modifica en ningún momento, pero que pasa si este elemento es de ancho dinámico o nuestro sitio tiende a modificarlo (efectos, etc), para esto jQuery tiene un método llamado width()que nos devuelve el ancho actual del elemento, pero esto nos devolvería la version width de css, que no es la “real”, ya que el elemento puede tener propiedades que agranden su tamaño, como borde, padding, margen, etc.

Leer este tip »


Formas de leer el valor de un select en javascript

Los elementos select son problemáticos a la hora de obtener el valor del option seleccionado, en primer lugar por que un select no solamente puede contener un elemento seleccionado, sino varios, aunque es poco común este elemento también fue diseñado para usarse como una lista de valores, esto se hace usando la propiedad multiple de estos elementos:
Leer este tip »


[PHP] Arreglar XMLs con Entities errors con una expresión regular

Este es un tip corto, tenia que usar un XML y en algunos casos me tiraba error:

PHP Warning:  simplexml_load_string(): Entity: line 1: parser error : xmlParseEntityRef: no name in /home/exos/aver.php on line 8

Warning: simplexml_load_string(): Entity: line 1: parser error : xmlParseEntityRef: no name in /home/exos/aver.php on line 8
PHP Warning:  simplexml_load_string(): yBack</song><producer>Timbaland,J.Timberlake,Danja</producer><catalogNo>88175* & in /home/exos/aver.php on line 8

Warning: simplexml_load_string(): yBack</song><producer>Timbaland,J.Timberlake,Danja</producer><catalogNo>88175* & in /home/exos/aver.php on line 8
PHP Warning:  simplexml_load_string():                                                                                ^ in /home/exos/aver.php on line 8

Warning: simplexml_load_string():                                                                                ^ in /home/exos/aver.php on line 8

Esto es por que el SimpleXML de PHP no parsea el XML si tiene errores de entidades o formato, y es que muchos generan los XML’s a mano y no escapan bién estas entidades, una solucion que ofrece este formato es usar CDATA, que tiene una sintaxis asi:

<SuperTag>
      <subtag>
            <valor><![CDATA[Esto no hace falta que esté escapado & :-)  `'  " < />]]></valor>
      </subtag>
</SuperTag>

El objetivo de esta Expresión regular es simplemente aplicar un CDATA en todos los valores que no sean otros tags.

Leer este tip »


Usando el método stop() en jQuery

Como ya saben jQuery es comodísimo a la hora de agregar efectos a nuestras páginas y mejorar las interfaces, un simple efecto de fade que antes eran varias lineas de código, ahora es un simple .fedeIn() / . fadeOut(), y asi con muchas cosas, podemos hacer estos efectos “lentos” para dar una sensación mas moderna, hacer desaparecer elementos, o habilitar otros en ciertos casos, los efectos nos suman muchos puntos en cuanto a como se ve la página. Pero tenemos un problema, que pasa cuando 2 efectos se cruzan, por ejemplo, si el desvanecimiento de un div tarda 1 segundo, y a los 500 milisegundos lo hago “reaparecer”, estarémos enviando 2 efectos a la vez, cosa que puede terminar en errores gráficos.

Leer este tip »


Usando Full-Text en MySQL, para búsquedas super rápidas

Al trabajar en webs dinámicas siempre nos encontramos con la necesidad de ofrecer facilidades a los usuarios, una es la de búsqueda por texto, que es buscar fragmentos de texto en una tabla para filtrar elementos, esto se puede hacer con un simple where que buscará dicho fragmento en todo los registros de la tabla, la usada sentencia like, pero realmente no es para nada lo mas óptimo, y desaprobechamos muchas ventajas que podemos tener con indices del tipo full-text, acá, una iluminación.

Leer este tip »


Automatizando el modelo con triggers en MySQL

Actualmente en la programación web casi no se utilizan las funciones mas avanzadas de las bases de datos, simplemente se usa para guardar y listar los datos que nuestras aplicaciones generan, pero como todo avanza, y las aplicaciones se vuelven cada vez mas complejas, es necesario profundizar mas nuestros conocimientos. En este caso voy a presentar los triggers, que básicamente son fragmentos de código que se ejecutan al dispararse un evento.

Leer este tip »


Creador de backgrounds on-line

Me encontré con esta interesante aplicación, que me saco de un apuro, como ya abre dicho, me llevo muy mal con programas de dieño, y no tengo ojo para hacer nada, asi que siempre que necesito algo de grafica pido una mano. En este caso necesitaba un background lindo para una págica web y me puse buscar y encontre esta web que los genera de forma muy facil.

Leer este tip »


Categoria

Haste fan

Web Analytics