Prepararse para desarrollo web, selección de herramientas
Nos hemos decidido a crear una aplicación web, así que vamos a empezar por el principio, escogiendo las herramientas que vamos a necesitar.
Como vamos a desarrollar para entorno web, la aplicación funcionará sobre un explorador web y esto es lo primero que necesitamos. Para desarrollar usa siempre Firefox. ¿Por qué? Porque Firefox ofrece mejores herramientas para desarrollar y depurar que el resto de exploradores. Nunca uses para desarrollar Internet Explorer. El explorador de Microsoft cumple los estándares a medias, es habitual que tus desarrollos funcionen en todos los exploradores y cuando vayas a probarlos en Internet Explorer den fallos inexplicables debido a peculiaridades del explorador mal documentadas. Si puedes evitarlo, no programes para Internet Explorer, este explorador es una lacra para los desarrolladores y no adaptarse a él es la mejor manera de que se pongan las pilas y lo mejoren para que se adapte al mundo. Naturalmente, debido al gran número de usuarios de Windows y al desconocimiento, Internet Explorer sigue ocupando una cuota de mercado superior al 30%, por lo que en muchos desarrollos te verás obligado a tenerlo en cuenta. Ármate de paciencia.
Pero volviendo a Firefox, en este explorador tenemos varias herramientas imprescindibles. Primero tenemos la consola de JavaScript (Herramientas -> Consola de errores ó Ctrl+Mayús.+J) que viene con el explorador. Adicionalmente, como complementos tenemos varios muy útiles.
De los que yo uso habitualmente, por un lado tenemos Web Developer, herramienta imprescindible que nos permite controlar todo lo que está pasando en nuestra página. Por otro lado está Firebug, potente herramienta de depuración que nos permite hacer cambios en nuestro código al vuelo.
Una vez seleccionado el explorador, vamos con la herramienta de desarrollo propiamente dicha. Existen muchos entornos muy pesados, que hacen cantidad de cosas y te meten código como de la nada en tus aplicaciones web. En muchos casos el código no es óptimo y además son lentos. Cómo estamos aprendiendo, en mi opinión es mejor utilizar una herramienta que nos permita controlar absolutamente todo y en la que necesitemos saber exáctamente lo que estamos haciendo. Si usas Linux, puedes usar una herramienta del tipo Bluefish, que te facilita el trabajo pero no programa por tí. Me parece que existía un compilado de Bluefish para Windows, de todos modos en Windows hay una herramienta que todo programador debería tener a mano, Notepad++. Es el editor de código fuente mas potente y cómodo que conozco. Ante todo, si realmente quieres desarrollar aplicaciones web, no uses Dreamweaver o Frontpage, el mundo te lo agradecerá.
Por último, la parte mas importante del desarrollo web (y de todos los desarrollos) es la documentación. Sin ella estás perdido, así que aunque al principio te resulte complicada, te tendrás que ir acostumbrando a ella. Necesitamos toneladas de documentación para poder hacer exáctamente lo que queramos, pero no te agobies, no te pongas a leer documentación como si fuese novela, ve aprendiendo poco a poco según lo vayas necesitando.
Adjunto una relación de enlaces a documentación que pueden ser de utilidad:
- HTML Quick (Básico)
- CSS 2.1 (Guía de referencia rápida)
- W3Schools (Todo lo necesario, en Inglés)
- PHP (Básico)
- PHP (Documentación oficial)
Con esto hay para empezar. Si vés que falta algo o conoces alguna buena web con documentación para programación web, por favor, deja un comentario.
¿Protoype o JQuery?
JQuery, sin duda.
La manera de trabajar con JQuery es mas sólida, incluye clases que permiten efectos visuales (para tenerlos en Prototype hay que usar script.aculo.us), pesa sólo 19KB frente a 126KB de Prototype, tiene un mayor número de actualizaciones y está mejor documentado.
Esas son mis razones para escoger JQuery siempre que tengo que usar un framework AJAX. De todas maneras debo decir que Prototype es un buen framework y su uso está muy extendido.
AJAX
AJAX es uno de los pilares de la Web 2.0. No es un lenguaje de programación, no es un framework, no es un entorno de desarrollo, no es una nueva tecnología. AJAX es tan solo una metodología aplicada sobre JavaScript que nos permite cargar partes de un documento XML dinámicamente. Como todo el código JavaScript, AJAX se ejecuta del lado del cliente, en el navegador.
En el modelo clásico de programación web, la comunicación es síncrona. El cliente solicita un recurso y este es servido por el servidor, una vez finalizado el proceso se puede solicitar un nuevo recurso. Mediante AJAX podemos efectuar varias solicitudes de recursos a la vez, antes de recibir la respuesta del servidor, que serán cargadas según se vayan recibiendo, lo que se conoce como comunicación asíncrona.
A la hora de desarrollar, esta técnica nos permite que unas partes de la web cambien en función de otras partes o de una situación dada, acercando la programación web a la programación de escritorio.
AJAX se basa en la interfaz JavaScript XMLHttpRequest. Pueden desarrollarse clases y métodos usando esta interfaz para usar AJAX en nuestros desarrollos no obstante, es mejor no reinventar la rueda. Existen frameworks AJAX muy optimizados y bien depurados que es recomendable usar si queremos dar dinamismo a nuestros desarrollos. Entre ellos dos que recomiendo, y en los que me detendré mas adelante en este blog son Prototype y JQuery.