Trucos Desarrollo Web: Uso del GREP

En ocasiones me encuentro con el problema que tengo que retocar ciertos Estilos CSS de alguna Web que llega a mis manos. Con ayuda del Firebug o alguna otra herramienta de desarrolladores incluida en los navegadores Web veo el nombre del div, el id y puedo localizar ciertos elementos, pero a veces no consigo ubicar el fichero concreto CSS donde están estos elementos específicos en los estilos (no me da el nombre del fichero ni la ruta del fichero CSS), suele ocurrir en casos en los que tengo que retocar estilos de un CMS, Prestashop, Magento…etc.

problema-encontrar-div
¿Ahora qué hago? En Estos CMS suele haber varios directorios CSS ubicados en diferentes lugares, ¿me los descargo todos y busco de uno en uno el div “header_user_info”? Uff es que no tengo ni idea de donde estará…Qué agobio, y tiempo perdido no??? No os preocupeis!
Antes de nada, decir que ya imagino que hay cientos de métodos para solucionar este problema, quizás mucho más sencillos del que yo explico aquí, aunque creo que a muchos les interesará conocer el uso del GREP, por la enorme cantidad de recursos y salidas que te da en LINUX (y como la mayoría de Servidores WEB están en apache con Linux corriendo pues quizás venga bien conocerlo).
Yo concretamente como soy de la vieja escuela en estos casos no me rompo mucho la cabeza y me dirijo a la terminal de Linux y nos conectamos a través de SSH a nuestro servidor Web (si, esa ventana llena de comandos que no entendemos, no tengáis miedo porque no muerde ni sale de la pantalla para estrangularte)

¿Qué es el Comando GREP?
El comando GREP es un comando de Sistema que por lo tanto funciona en todas las versiones de LINUX: Centos, Ubuntu…etc.
Es uno de mis preferidos en LINUX, y le saco cientos de utilidades concatenándolo con otros en labores de Sistemas Informáticos, pero hace tiempo me di cuenta que también puede ser útil en labores de Desarrollo WEb, y cuando algo me toca mucho las narices no dudo en acudir a él.
Antes de nada para los novatos en linux decirles que cada comando tiene su manual incluido, y podemos acceder a él escribiendo man.

comando-man-linux

El comando GREP Busca cadenas de texto dentro de TODOS los ficheros o directorios que especifiquemos, cosa que en Windows creo que no podríamos hacer, y tendríamos que abrir un editor de texto y buscar entre todos los ficheros (uno por uno) en los que creemos que está incluida la cadena de texto.

¿Uso del GREP?

Ahora si queremos procedemos a entrar en la ruta del servidor donde está el httpdocs, aunque si lo preferimos podemos operar desde la raíz u otro directorio cualquiera, yo lo hago así por comodidad, para no escribir las rutas en cada uno de los comandos que escribo. En mi caso la ruta es la siguiente, esto ya dependerá de donde tengáis creado el directorio donde está apuntando vuestro nombre de dominio.

ruta-cd-linux

Ahora que estamos en un nivel de directorio por encima del httpdocs o public de la web que estamos trabajando ejecutamos el Grep de la siguiente manera:
Sintaxis: grep -R “elemento-del-div” /ruta-del-httpdocs-de-la-web
quiere decir: búscame recursivamente la cadena “elemento-del-div-que-sea” en todos los ficheros que están en el directorio donde cuelga mi Web.

grep

Y ahora vemos como con facilidad el Grep nos da la salida de comando perfecta, apuntando los ficheros que contienen la cadena de texto correspondiente a nuestro id=”header_user_info”, fácil y sencillo.
Ahora os pido que me ofrezcáis diferentes soluciones a este problema, y así me ayudéis a completar este artículo usando una mezcla de vuestros conocimientos y los míos.

Espero que este artículo os sirva de ayuda,
Un saludo,
Óscar / Devservice.es
Por Óscar Carrillo