¡Ya estamos en Twitter!

Perl en Español

  1. Home
  2. Tutoriales
  3. Foro
  4. Artículos
  5. Donativos
  6. Publicidad

Convirtiendo un sitio estático a dinámico

por

Hace unos años entre como programador en jefe de uno de los sitios web más grandes de México. Fue aquí donde tuve mi primera gran experiencia como programador.

Y ahora la comparto con todos ustedes.

El panorama

Cuando por primera vez vi la manera en que manejaban el sitio estaba impactado, el webmaster se la pasaba horas frente a la computadora actualizando páginas estáticas, quitando y poniendo registros a mano uno por uno.

El sitio contaba con cerca de 400MB de páginas web estáticas, cerca de 6,000 registros en promedio que el webmaster debía de mantener.

Diario llegaban un total de 40 nuevos registros que el webmaster debía de agregar a mano: uno por uno.

El problema de cuando haces las cosas de esta manera es que dejas mucho margen a errores que como humanos cometemos. Por ejemplo de pronto se puede repetir un registro, o al estar haciendo la copia de los registros se pueden ir caracteres de más, etc.

El webmaster quería un cambio y rápido, no podía continuar con este ritmo de trabajo, aparte de que se esperaba mucho más tráfico en los meses por venir.

Los cambios

Antes de iniciar los cambios uno debe de pensar en dos cosas fundamentales:

- ¿Va a reducir mi tiempo de trabajo y la eficiencia para los usuarios?
- ¿De cuánto es la inversión?

Con estas dos preguntas en mente lo primero que le planteé es que era necesario convertir todas los registros dentro las páginas HTML a un sistema de database, de esta manera sería mucho más rápido agregar, editar y eliminar registros, reduciendo de esta manera el tiempo de trabajo el cual se puede emplear en otras cosas.

El database que propuse es el MySQL y esto debido a varias razones, en primer lugar era el sistema de database que sabía utilizar, es rápido, eficiente y totalmente gratuito, una gran solución.

Estaba feliz que considerarán mi solución como buena y a los dos días me pidieron que me pusiera manos a la obra, mi felicidad acabo cuando vi el trabajo que me esperaba: ¿cómo diablos iba a pasar todos los registros de HTML a database?

Parecía misión imposible pero solo faltaba un poco de creatividad para llegar a solucionarlo.

Datos, datos y más datos

Es cuando ponen a uno en situaciones extremas como estas donde puedes ver si realmente sirves como programador o no. Este tipo de situaciones son únicas, no puedes encontrar un libro acerca de como solucionarlo, no existen tutoriales ni foros donde puedas hacer estas preguntas. Es un duelo entre tú y el problema, nadie más. Es como estar frente a un toro viendo como agarrarle los cuernos antes de que te golpee y te desangres a la muerte, puedo parecer dramático, pero la situación era dramática.

Lo primero que debía de hacer es analizar con cuidado todas las páginas HTML para ver si los registros eran similares y de esta manera crear una expresión regular que los dividiera. Para mi suerte todos los registros estaban dentro de las páginas con el mismo formato, el webmaster usaba un mismo template para introducirlos, era una tabla por registro, con sus columnas bien definidas.

<table id="registro">
<tr>
<td class="title"> TITULO </td>
<td class="fecha"> FECHA </td>
<td class="autor"> AUTOR </td>
</tr>
<tr>
<td class="texto" colspan="3"> TEXTO </td>
</tr>
</table>
<hr>

El siguiente paso era decidir bien como se crearía la tabla de MySQL donde se meterían todos los datos. Es muy importante este paso, pues de esto depende que sea eficaz o no el database, todo depende de la estructura de nuestra tabla.

Lo que hice fue hablar con el webmaster para ver cuales eran sus necesidades, si tenía algo en mente que no haya podido hacer debido a que tenía que hacer todo a mano, de esta manera llegue a la estructura final de la tabla en MySQL.

Decidí crear un index numérico auto incremental que serviría como id para cada uno de los registros, de esta manera cada registro sería único sin importar los campos que tengan y no tenía que preocuparme por la asignación de ids al introducir nuevos registros.

El siguiente paso era crear el pequeño script que dividiría todos los HTML y los metería en el database, esto era prácticamente sencillo pero era necesario pensar bien las cosas, no te gustaría encontrar que de pronto por algún error, en el campo donde debería de estar el mail hay algún nombre.

Finalmente hice el script, muy pequeño pero eficaz script que hacía los siguientes pasos:

  1. Abrir y leer el código HTML.
  2. Dividir cada registro en elementos de array, lo que agarré como divisor era un código <hr> que había entre registro y registro.
  3. Hacer un loop a través de todos los elementos de array y pasar los datos por una expresión regular que sacaría la información importante. Esta expresión regular era algo así como:
    $registro =~ /<table><td>(.*?)</td><td>(.*?)</td></table>/;

    #$1 = Título
    #$2 = Nombre

  4. Meter los datos en MySQL.
Hay un paso que omití entre el paso 3 y el 4, un error que me costaría caro y que me haría repetir todo de nuevo. En realidad no todos los registros eran iguales, había algunos registros que estaban puesto con otro tipo de código, después me dijeron que esos registros eran de los primeros que llegaron y que después hubo cambio de interface. Por esos decidí hacer una verificación, debido a que todos los campos eran necesarios, es decir todos los registros debían de tener título, autor, etc., debido a esto podía checar que después de pasar por la expresión regular todas mis variables tuvieran la información correcta. En caso de que faltare una variable guardaba el registro completo en un archivo txt y pasaría al siguiente elemento del array.

Al finalizar, abría el archivo TXT con los registros "deformes" y los metía a mano, esto debido a que normalmente estos registros eran 2 o 3 a lo mucho.

Así procese cientos de páginas HTML hasta que finalmente estuvo todo vaciado al database, era feliz, aunque había acabado con lo más difícil aún faltaban cosas que hacer.

Todo se resume a la interfase

El paso a seguir es la creación del sistema de administración de los registros para el webmaster, elemento muy importante pues de esto dependía la eficacia de su trabajo.

En mi experiencia usando programas de terceras personas me he dado cuenta de un gravísimo error en el que caen los programadores. A veces cuando estas creando un programa que van a usar ciertos usuarios, se te olvida que esos usuarios lo mas seguro es que NO son programadores, entonces terminas creando un programa difícil de usar y comprender.

Por esta razón siempre pongo muchísima atención a la interfase gráfica. La interfase gráfica va a decidir si tu programa va a tener éxito o no, a un usuario normal no le importa lo que pase detrás de las cámaras, lo importante es que el programa sea útil y fácil de usar, la verdad de las cosas es que si tu programa necesita de un manual de 500 páginas para poder ser usado pocas gentes lo van a querer usar.

NOTA: Esta regla funciona cuando vas a hacer programas que van a ser usados por usuarios comunes y corrientes.

Lo primero que había que hacer es preguntarle a la persona que va a usar el programa que es lo que quiere que haga, en este caso el webmaster. Así que me senté con él, le pedí que me dijera como sería su programa de ensueño y lo demás me lo dejará a mí. Me dio todas las ideas de su cabeza, me dijo como quería los botones, que quería que pasará cuando apretara esto o el otro, y que si en caso de que hubiera esto se lanzará tal cosa, etc., me dio una lista de deseos, de la cual no vi nada que no pudiera hacer.

Paso 1: Versión Beta

Me puse a diseñar la interfase, para este momento todavía no había escrito nada de código, llegue con el webmaster y le pregunte que le parecía. La vio, la analizó un poco y me dijo que le encantaba, me pidió unos cambios menores, nada grande.

Para este momento ya tengo lista la interfase, la estructura del programa, consideren como los huesos, ahora falta poner todo los sistemas que va a hacer que esta criatura funcione.

Me encerré un día escribiendo línea tras línea de código. Cuando me inspiró puedo hacer el programa en sólo un día, fácilmente puedo escribir cerca de 5,000 líneas de código en un sólo día. Me fui a descansar y al día siguiente hice mis pruebas, estuve checando el código, probando las funciones hasta que sentí que ya estaba listo para ser mostrado.

Llegue con el webmaster y le mostré su gran centro de administración, esta era realmente una suite, tenía todo para dar de alta y baja registros, modificar todos sus datos, un mecanismo de búsqueda, upload de archivos, creador de galerías automáticas, en fin todo lo necesario.

Le pedí que lo usará sin mi ayuda, no le iba a servir si para cualquier cosa me tenía que consultar, lo deje y me fui a mi casa esperando su llamada.

Finalmente como a las tres o cuatro horas el teléfono sonó, sentí un hormigueo en mi estómago, me iban a dar el veredicto final de mi primer gran aplicación, no podía aguantar los nervios, levante el teléfono y con voz temblorosa dije "Bueno...", como lo esperaba era el webmaster, sentía en su voz un gran entusiasmo, me empezó a decir como esta aplicación le había resuelto la vida, nunca se había imaginado que algo así sería posible, y como vio que pude hacer todo lo que me pidió, ya había preparado una segunda lista de deseos, la cual me paso en esa misma llamada. Colgué el teléfono y me puse a trabajar.

Paso 2: Segunda Versión

Tengo que ser sincero con ustedes, lo más chocante para mí es hacer un programa y después tener que revisarlo y cambiarle cosas, hay veces, aunque sé que no es nada práctico, que prefiero hacer todo de nuevo a tener que cambiar líneas de código de un monstruo de 5,000 líneas de código.

En este caso por suerte me había preparado para esto, era mi primer programa modular, las funciones las había separado por módulos dependiendo de su categoría, así que fue muy sencillo crear nuevas funciones con nuevo módulos.

Ese mismo día había terminado todo, me fui a acostar y al día siguiente me levante para checar todos los sistemas, como al medio día le hable al webmaster para pedirle que checara de nuevo el programa.

Como el día anterior me habló unas horas después, había hecho de todo y me pidió una par de cambios más.

Paso 3: Versión Final

Sabía que estos cambios eran los últimos, así que decidí afinar mi código fuente, me puse a checar que todos los comentarios se entendieran, le puse mi firma a todos los módulos y le puse seguridad por contraseña, la versión final estaba finalizada.

Como les decía había creado una suite completa, pero lo más importante es que tenía la capacidad de hacer cambios sin mucho problema. Como todo era modular en vez de tener un sólo archivo con miles de líneas, tenía varios de ellos con varias funciones por categorías, por lo que era fácil encontrar lo que buscaba dentro de mi código y aparte que era coherente.

El sabor de la victoria

Así finalizaba mi primera gran prueba como programador, y por suerte la pase ileso y listo para más retos, los cuales vendrían tiempo después y que pronto les platicaré.

¿Quiéres más tutoriales como este? Escribir tutoriales toma una gran cantidad de tiempo y esfuerzo. Si este tutorial te ayudó a aprender o a solucionar algo, por favor considera dejar alguna donación en apoyo a Perl en Español.

Cliquea en el botón de abajo para dejar tu donación por medio de PayPal.

Comparte:
Otros Artículos:
En Nuestros Foros:

    Software error:

    junk after document element at line 1, column 32, byte 32 at /usr/lib64/perl5/vendor_perl/XML/Parser.pm line 187.
    

    For help, please send mail to the webmaster ([email protected]), giving this error message and the time and date of the error.

  • Entra a los foros »
Socializa:
Síguenos por Twitter

Suscríbete GRATUITAMENTE al Boletín de Perl en Español

Perl en Español es mantenido con Movable Type
Todo el contenido de Perl en Español está bajo una licencia CC:
Creative Commons License