Tutorial de FireBug

0
55

Esta maravillosa extensión de firefox, es muy esencial al momento de desarrollar aplicaciones Web.
Esta herramienta sirve para depurar, testear, realizar cambios en caliente y analizar nuestras paginas Web.
Planes Hosting

Los tabs:

El tab Console:

Nos provee de información de peticiones POST y GET por Ajax
dentro del contenido de la petición podemos ver la respuesta del XMLHttpRequest,
los parámetros que se mandaron por POST o GET, y las cabeceras de la pagina
El tab HTML:

Permite hacer cambios a la pagina en caliente, podemos modificar contenidos, cambiar el id de algún elemento, ocultar elementos, en fin.
Tiene un inspeccionados que cuando te sitúas en alguna parte de la pagina, automáticamente te lleva al lugar de código en
esta pantalla. También funciona al contrario.
El tab CSS:

Al igual que el anterior nos permite hacer cambios en caliente de las hojas de estilo.
Reconoce colores e imágenes para visualizarlos al poner el mouse sobre la propiedad.
Tiene un mininavegador en el cual podemos escoger a que hoja de estilo especifico queramos entrar.
El tab Script (mi favorito):

este tab nos da la facilidad de poder depurar nuestro código Javascript
también tiene la opción de poner breakpoints para estancar la carga y podemos ver el contenido de variables, bucles, etc.
El tab DOM (Document Object Model):

Es el Modelo en Objetos para la representación de Documentos, ósea se trata de una interfaz en la cual los programas y scripts pueden acceder y modificar dinámicamente su contenido.
El tab Net (Network):

Con esto podemos saber donde pierde mas tiempo la carga de tus paginas Web en una línea de tiempo,
este componente diferencia entre la carga de cache del servidor y la no cacheada.
Puedes filtrar los resultados por tipo de archivos, examinar cabeceras y monitorizar el XMLHttpRequest.
FireBug