Saltar al contenido

Etiqueta: javascript

Cómo instalar paquetes de bower y npm en Yii2

Actualmente cuando trabajas en el frontend (la parte visual) de una página web utilizas código JavaScript para realizar ciertas acciones tales como: animaciones, validaciones, interacciones, etc. Y con el auge de popularidad de este lenguaje, existen muchas librerías y complementos que facilitan el desarrollo. Por eso, hoy en día es normal que si realizas una aplicación en Yii2, utilizarás componentes visuales para manejar calendarios, validaciones de correo, manejo de modales, etc.

A pesar de existir una cantidad notable de extensiones de Yii2 para instalar complementos adicionales, no se puede comparar a la calidad y cantidad de librerías y frameworks disponible en npm y bower. Además, si eres un programador de Javascript, estarás acostumbrado(a) estas herramientas y te sentirás limitado en Yii2. Sin embargo, existe una forma de instalar software de npm/bower en tu aplicación utilizando composer, de esta manera puedes gestionar tus dependencias de Javascript y PHP en una sola herramienta.

Instalación del plugin de composer

Asumiendo que ya tienes instalado composer, solo debes instalar el complemento composer-asset-plugin mediante el siguiente comando:

php composer.phar global require "fxp/composer-asset-plugin:~1.1.1"

Agregando dependencias en tu aplicación de Yii2

Una vez instalado el complemento, para instalar los paquetes debes agregar al nombre del paquete original el prefijo npm-asset/ o bower-asset/ dependiendo del caso. De esta forma, si quieres instalar combodate debes colocar como nombre bower-asset/combodate. Luego con hacer php composer.phar update instalarás las dependencias requeridas en la carpeta /vendors.

Ejemplo para instalar un paquete de npm:

 {
   "require": {     
        "npm-asset/el-paquete-npm": "dev-master"
    }
}

Para instalar un paquete de Bower:

{   
  "require": {     
      "bower-asset/el-paquete-de-bower": "dev-master" 
  } 
}

¡Y listo! una vez que tienes las dependencias, puedes incluirlas en tu plantilla de vista o crear un Assets, la opción recomendada de Yii2 para el manejo de archivos/librerías externas, pues te permite definir dependencias y en que momento cargarlas, para optimizar la carga de tu sitio web.

Espero que te sirva esta guía y puedas disfrutar de todo el poder de Javascript para aplicarla en las vistas de tu aplicación realizada en Yii2, un gran framework de PHP.

Deja un comentario

Doom corriendo nativamente en un navegador

Hace unos años (18 años) salió Doom para PC, un juego revolucionario por su gran motor gráfico, altos requerimientos de hardware y un alto nivel de violencia. Luego de su gran popularidad, id Software liberó su código fuente bajo GPL en 1997 haciendo que el juego fuese migrado literalmente a casi todo lo que corra software (podemos ver Doom en teléfonos, consolas nuevas y antiguas, emuladores, etc).

Pues anoché vi un experimento en MDN (Mozilla Developer Network) de Doom corriendo nativamente en un navegador gracias a un desarrollador que logró migrar Doom a Javascript, realmente me impresionó la calidad del trabajo pues a pesar de ser su primer release se puede jugar muy bien. Utiliza la tecnología Canvas de HTML5 y Javascript, utiliza los .wads del demo por cuestiones de licencia, por ahora no permite grabar partidas pero el creador prometió usar las base de datos de HTML5 para guardar información e ir agregando  nuevas características.

Doom corriendo en Firefox gracias a Javascript
Doom corriendo en Firefox gracias a Javascript

Solo lo probé en firefox y encontre unos detalles como la desaparición de algunos sprites (de enemigos sobre todo) y la ausencia de la música original del juego. Realmente me sorprende como hemos avanzado en la tecnología, es como decir que veremos a Rage corriendo en un navegador usando WebGL en unos años. Ahora espero ver Quake 3 corriendo en WebGL y demás tecnologías, por ahora está QuakeLive pero no es nativo en el navegador sino utiliza unos complementos para permitir jugar con el navegador.

Si desean ver y probar este demo, pueden hacerlo en: https://developer.mozilla.org/en-US/demos/detail/doom-on-the-web/ si tienen un navegador con soporte para HTML5 y buena máquina de Javascript.

 

1 comentario

Secrets of the JavaScript Ninja (Secretos del Ninja Javascript)

Secrets of the JavaScript Ninja, es un libro escrito por el famoso John Resig, (Si eres un desarrollador web deberías saber quien es) creador de jQuery, la grandiosa librería Javascript que facilita enormemente el desarrollo con Javascript.

Hace unos días lo terminé de leer y me gustó mucho, me parece un libro recomendado para todo desarrollador que trabaje con Javascript (recordemos que jQuery no es lo mismo que Javascript), los ejemplos y temas estan dirigidos a programadores con experiencia media o avanzada en el lenguaje, en mi caso, me considero un novato en este lenguaje y logré aprender mucho pero varios temas no los pude entender bien o tenía que leerlo varias veces para captar la idea, sin embargo, si son nuevos con este lenguaje también es bueno leerlo, porque enseña a ver las cosas distintas y como aprovechar la resolución de algunas cosas desde un punto de vista donde se toma ventaja de las características únicas de Javascript, o bien sea problemas existente pero como adaptarlo a las posibilidades de JS.

Los principales temas abarcados por el libro son: tips para mejor desarrollo de scripts, como crear una libería JS, funciones para facilitar ciertas operaciones, ejecuciones de pruebas, creación de código compatible con varios navegadores y muchos mas. Así que, si trabajan con este lenguaje, desean aprender y les gusta leer, compren esten libro que les será muy útil.

3 comentarios

Excelentes 30 tips de desarrollo web para principiantes

NetTus+ publicó un artículo muy interesante sobre 30 consejos que se deben seguir para el desarrollo web, todos son excelentes y altamente recomendados para cualquier persona interesada en esta área o que ya lleve muchos años trabajando en ella. Estos consejos estan dirigido principalmente a principiantes para que desde los inicios lleven a cabo buenas prácticas, sin embargo, recomiendo a cualquiera leerlos porque aquellos que tenemos tiempo en el desarrollo web, aún conservamos malas prácticas (después de este artículo pienso eliminar casi todas) y es recomendable conocer cuales son.

El artículo está en inglés en el siguiente enlace: 30 HTML Best Practices for Beginners

Deja un comentario