lunes, 5 de agosto de 2013

Como hacer una WebApp y no perder la cabeza (Parte 1)

Este articulo puede sonar un poco tonto, y forma parte de los n artículos que vas a conseguir para hacer una web app. Sin embargo, esto esta pensado para personas que, como yo, están sumergidos es una gran ola de recursos tecnológicos (PHP, Node, Django, HTML5, jQuery, etc) y que a la hora de hacer algo pierden más tiempo en como mejorar algo que ni siquiera a empezado. En cierto modo esto es una auto-critica pero es necesaria a final de cuentas.

Empieza por lo básico.

Olvídate de los recursos tecnológicos, hace ya años que se pudieron hacer webapps sin jQuery, Ajax o HTML5... concentrarte en lo que quieres hacer. Saca una hoja de papel, y doblala por la mitad, ¡Esto es muy importante, cuida los arboles! y escribir una única pregunta muy importante:


Y si seguramente el muñequito eres tu leyendo estas lineas, y si eres programador más aun, no obstante la realidad es otra. Un gran numero de programadores sigue instrucciones de un gerente en sistemas que dedico sus 5 años de estudio universitario en responder esa pregunta. Algunos otros programadores aprenden por experiencia o a los golpes. Pero lo cierto es que indistintamente de lo que eres esa es la pregunta inicial. Y tu, y solo tu puedes responder esa pregunta cuando haces algo por ti mismo.

Ahora bien, de nuevo ¡OLVIDA TODO LO RELACIONADO CON LA PARTE TECNOLÓGICA! céntrate en tus objetivos y necesidades. En mi caso, debo hacer un sistema de catalogo de equipos y piezas. Pues no me queda más que responder a la pregunta:


Ok... Fíjense que mi amiga PHP o HTML o Python no aparecen... Esto es la mejor manera de obligarnos a no empatarnos con la tecnología. Debes recordar que la tecnología es un recursos que facilita las cosas. Ahora bien, ya sabemos que vamos hacer, ahora la pregunta es como lo vamos hacer. Pues ahora bien en cierto modo lo que llamamos la filosofía del programa. Esta sera tu carta magna, no debes modificará por ningun motivo porque tu programa fue creado para eso. Si eres licenciado o ingeniero, toma el "¿Que voy hacer?" como la pregunta de objetivo general cuyo encabezado es la respuesta. Ahora debes definir el "¿qué?" en este caso, "¿Que es un catalogo de piezas y equipos?". Para mi lo defino como "Una base de datos editable que contenga los equipos y piezas de manera funcional de los sistemas a los cuales se realiza mantenimiento" (Si en el papel esta diferente).


Como vez marque dos palabras en negrita, estas dos palabras me introducen un poco en el "¿COMO?" y es aqui donde solemos meter la pata... a que me refiero, a veces ni sabemos que vamos a hacer y saltamos al como o peor aun... tecnológicamente como.

Les voy a narrar una pequeña anécdota, la primera alpha del programa la hice precisamente saltándome todo esto. Y perdí 3 semanas en algo que podríamos llamar estúpido... y es en el mecanismo de login. Y tu lector, me dirás, pssss que bobo... eso lo hago en dos minutos. SI estas en lo correcto pero me tope aprendiendo varios recursos tecnológicos (dominar jquery, el concepto de ajax, php, las sesiones, entre otras) todo eso y dejando de lado... EL PROGRAMA... OH MIERDA la cague... si pero a veces hay que rectificar y siempre hay ganancia:

De mi error aprendí:

  • Debo organizarme, es algo fundamental.
  • No debo lucir en el primer momento (HTML5, jquery, ajax, CSS3 entre otras herramientas aun no son usadas comúnmente en la industria).
  • Aprendí jquery y Ajax (¡¡¡SALTEN DE EMOCIÓN!!!)
  • Empece con Node, aprendí Node, termine con PHP, aprendí con PHP (curiosamente la primera propuesta era en Python WSGI), pero no importa, aprendí dos recursos más (¡¡¡SALTEN DE EMOCIÓN!!!).
  • No siempre hay que empezar desde 0. 
No soy diseñador o dibujante y este tipo de proyecto no puedo dedicarle mi tiempo de trabajo... Entonces debí aprender que muchas cosas ya están hechas y comprobadas, esto se llaman frameworks... Para mi caso, por lo menos debo saber usarlas con genialidad. Existen frameworks de diseño como Bootstrap 3, es una muy completa librería de diseño para decorar botones y menús. Para aplicaciones, Django me resulto muy útil pero si deseas sacarle al máximo provecho debes primero ir a pie... Estos framework de aplicación se basan en patrones de arquitectura de software que al principio pueden ser agobiantes de aprender. Debes tener conceptos firmes de Programación orientada a objetos pero incluso más allá del concepto de Objeto.

Volvamos al papelito... ya dijimos que el "¿Qué?" y lo definimos, ahora viene el "¿Cómo?". Dos palabras fueron resaltadas por un motivo importante, son los métodos y características que debe tener el trabajo. EDITABLE implica que debo poder acceder a la base de datos y modificar las cosas, eso implica (para mi) tres cosas: AGREGAR EQUIPOS, BORRAR EQUIPOS y EDITAR EQUIPOS. Tal vez falta algo un poco más lógico que se nos olvida pero no deja de ser importante y es: CONSULTAR EQUIPOS. Con eso ya tenemos cuatro métodos:

  • AGREGAR
  • BORRAR
  • EDITAR
  • CONSULTAR*
Para entender un poco, debes recordar un poco tus clases de primaria. Un programa se parece bastante a una clase de gramática; el verbo de manera imperativa manda sobre el sujeto. Por aquí termina la primera parte, la segunda tocara el tema de como trabajar la información, y como diseñar la base de datos.

Nota: te abras dado cuenta que consultar tiene un *, en la parte 3 enteras el motivo.

Por cierto así quedo la hoja: