Proyecto de fin de semana

Cuando intentas investigar las finanzas de una empresa, siempre terminas navegando por varias páginas, y muchas veces termina siendo repetitivo. Esta fue mi motivación para automatizar dicho proceso, y al mismo tiempo aprender una nueva tecnología con la cual expandir un poco el abanico de herramientas que tengo.

De esta manera surge la iniciativa de desarrollar una extensión de Google Chrome. Todo comenzó un viernes por la noche, buscando como hacerla me di cuenta que no es más que una página web sencilla, un par de archivos .js y no mucho más.

Sabiendo esto, inicie una investigación un poco más profunda, para ver si ya existía algo y conseguí un par de alternativas, sin embargo no me facilitaban el trabajo.

El problema

El trabajo al que hago referencia consistía básicamente de:

1. Tomar un Ticker Symbol de una empresa.
2. Abrir una página para consultar.
3. Una vez que termine mi consulta, cerrar el tab.

Los pasos 2 y 3, se repiten N veces según las páginas que quiero ver, esta es la parte aburrida y tediosa.

Planteo de la solución

Buscar una forma que dado un Ticker Symbol, me abra las páginas que quiero, y finalmente cerrarlas. Fundamentalmente un input y un dos botones abrir y cerrar.

Ejecución de la solución

Sin pensar en mucha cosa, inicie mi travesía a través del Get Started de Google Developer y decir que la experiencia fue sencilla, fácil, rápida no le hace justicia, muy bien documentado y muy cómodo de implementar, un espectáculo!.

El prototipo estuvo listo en cuestión de horas (apenas). Pero me faltaba automatizar otro paso: refrescar la extensión para ver los cambios. Me estaba tomando un par de clicks más hacer esto, pero acudí a un Application Builder llamado parcel, igualmente simple y sencillo. Ya venía usando npm (node) para todo esto así que incorporarlo fue un suspiro.

Desarrollar y refrescar no implicaba ningún esfuerzo extra:

yarn dev

Y listo! Parcel hace build, compile, copy, paste y un café.

Avance del desarrollo

La extensión ya hacia lo básico, abrir un par de sitios con el Ticker Stock dado, maravilloso, surgieron entonces algunas mejoras:

• Storage: para guardar estos sitios para usarlos luego.
• Cerrar todas las tabs de un click.
• Eliminar/Agregar URLs al storage.
• Carga de datos de prueba.
• Hacer un logo (muy rudimentario con Inkscape).

Conclusion

Es muy divertido facilitarte la vida un poco y aprender mientras lo haces. Termine con un código muy simple, retomando conceptos de Javascript que hacía mucho no aplicaba, y con un producto que me llena de alegría ya que hoy día está publicado en la Google Web Store como: Stock Ticket Multi Tabs.

Te invito a que pruebes hacer tus proyectos personales, aprende cosas nuevas, y cuéntale todos tus logros. No dejemos de aprender nunca.

Instala Stock Ticket Multi Tabs y dale una probada! Tus comentarios son muy importantes.

Si quieres colaborar para mejorarla Stock Ticket Multi Tabs en GitHub