Similar Posts
7 reglas para realizar Javascript de calidad
Siete consejos para realizar un javascript de calidad y no intrusivo:
- No hagas suposiciones: no pienses que el usuario tendrá el javascript activado o que usará un navegador adecuado.
- Usa IDs y relaciones entre elementos: para no depender de un HTML mal estructurado y que el javascript sea imposible de realizar, utiliza IDs para acceder a los elementos con los que se quiere tratar y busca elementos que faciliten acceder a otros elementos.
- Utiliza estilos: en vez de modificar los estilos de los elementos HTML mediante Javascript, usa clases CSS que modifiquen los estilos, y mediante Javascript se le puede añadir la clase a un elemento superior.
- Comprende el navegador y a los usuarios: debes pensar cómo funciona un navegador, no sobre saturar su comportamiento (abuso de drag&drop, eventos, …). Además debes pensar qué espera el usuario que haga el navegador, y respetarlo.
- Comprende los eventos: los eventos no solo corresponden a un objeto, sino a los elementros hijo que contiene. Así se pueden realizar eventos sobr un único elemento y no tener que modificar los demás.
- Respeta el código de otros: seguro que a parte de tu código existe algún otro que has añadido, por lo que deberás programar teniendo en cuenta que hay que evitar conflicto entre funciones.
- Después de ti vendrá otro: es muy frecuente que alguien acabe modificando tu código, ten un poco de consideración por los demás y escribe código legible y entendible.
The seven rules of Unobtrusive JavaScript
Vía / @dcedilotte
Indicar calidad de la password con Javascript
Ya hace tiempo comentamos como indicar la calidad de una contraseña mediante Javascript y esta vez vamos a mostraros otro ejemplo de cómo hacerlo.

En esta ocasión se van a usar dos scripts, uno de ellos está basado en el algoritmo de Javascript Password Strength Meter, el cual mide que la contraseña tenga más de 8 caracteres, tenga minúsculas y mayúsculas, algún número, use caracteres especiales y use L33t.
En este caso el formulario se realiza con Ext Form, una gran librerÃa, pero no me gusta que el formulario se cree mediante javascript.
Password Meter
VÃa / WebAppers
6 razones para utilizar librerías o frameworks Javascript
Últimamente los frameworks de Javascript que aparecen son cada vez más numerosos, y aunque ya en alguna ocasión hemos hablado de esto, no está mal recordar y añadir otros puntos por los que deberÃamos usar estas librerÃas o frameworks.
- No reinventes la rueda: no pierdas en tiempo en hacer algo que ya han hecho otros y que además dan buen resultado.
- Haz más con menos código: estas librerÃas suelen permitir encadenar código, por lo que con menos código se consigue menos espacio, mejor mantenimiento y menos tiempo de desarrollo.
- Ahorra tiempo: por mucho que te guste programar en Javascript, ahorrarás tiempo al realizarlo mediante estas librerÃas.
- No eres el mejor programador: por mucho que tu ego te diga que eres bueno, los hay mejores. Además, estas librerÃas suelen estar apoyadas por una comunidad que hace mejorar el trabajo.
- Velocidad: estas librerÃas suelen ser muy rápidas a la hora de realizar las acciones. Visita esta página para comprobarlo.
- El código se entiende mejor: el código base de Javascript puede ser más complicado de leer y entender.
jQuery CodeView: plugin para ver el codigo HTML
jQuery CodeView es un plugin que nos permite mostrar el código HTML de un elemento de la página.
Su uso sería así:
jQuery("#javascript_block").codeview();
jQuery("#javascript_block").codeview({
fontSize: "1.2em",
tabToSpace: -1,
feedColor: false
});
Vía / DZone
Hapi.js+Vue.js Crear servidor backend
El primer paso va a ser crear el entorno del servidor, para ello creamos un directorio e inicializamos el proyecto ejecutando:
npm init
Rellenamos todos los datos que nos van pidiendo para configurar el proyecto.
Ya tenemos el proyecto creado, ahora iremos instalando las librerías que necesitamos, en este caso hapi y glue.
npm i @hapi/hapi
npm i @hapi/glue
¿Qué es glue? Glue es un plugin que permite configurar el servidor de forma fácil.
Ahora creamos el fichero index.js e insertamos el siguiente código:
const Glue = require( '@hapi/glue' );
const manifest = {
server: {
port: 3001,
},
};
const options = {
relativeTo: __dirname,
};
const startServer = async function() {
try {
const server = await Glue.compose( manifest, options );
await server.start();
console.log( 'hapi days!' ); // eslint-disable-line
} catch ( err ) {
console.error( err ); // eslint-disable-line
process.exit( 1 );
}
};
startServer();
Fácil de entender, ¿no? Creamos el servidor usando Glue con el manifest y las opciones, y arrancamos el servidor.
Listo, accedemos a http://localhost:3001 para comprobar que funciona. Nos devolverá error 404 porque por ahora no hay definidas routes.
¿Cómo se arranca el servidor? podríamos usar directamente node, pero mejor usaremos nodemon. Primero lo instalamos:
npm i --save-dev nodemon
Y ejecutaremos lo siguiente para arrancar el servidor:
npm run start
Puedes obtener el código en GitHub hapi-vue-demo 0.1.0
Lawnchair: ‘base de datos’ clave-valor en Javascript
Lawnchair es una base de datos documental basada en JSON y que funciona en el cliente (Javascript). Puede venir muy bien para desarrollo de aplicaciones para móviles. Es muy fácl de usar y permite operaciones de escritura, lectura, búsqueda y eliminación.
var people = new Lawnchair('people');
// Saving a document async
people.save({name:'frank'}, function(r) {
console.log(r);
});
// Specifying your own key
people.save({key:'whatever', name:'dracula'});
