Desarrollar aplicaciones web es un trabajo duro que requiere mucho tiempo que tienes que gastar haciendo miles de cosas. Si no utilizas un enfoque metódico, en especial un proyecto complejo, corres el riesgo de perder la perspectiva del proyecto y perder tu tiempo por nada.
Este artículo ilustra un proceso estructurado que puede ayudarte a simplificar el enfoque para desarrollar tus aplicaciones web, ahorrando tiempo y haciéndolo de forma eficiente.
Descarguen el documento N1 | Structured process you must know to develop a web application
Fases principales del proceso
En un proceso genérico para el desarrollo de aplicaciones web pudes identificar cinco fases principales:Definición de Requisitos
Diseño
Ejecución
Prueba
Liberación
Planificación y revisión es una "fase permanente" que siguen los procesos de desarrollo definiendo un plan de proyecto compuesto por una lista de actividades las cuales tienes que revisar durante la ejecución del proyecto. Para cada actividad se debe definir un conjunto de información que servirá para su revisión, por ejemplo:
- responsable
- duración
- costos
....
Denle un vistazo a estos artículos que escribí hace algún tiempo acerca de como implementar un plan de proyecto con un diagrama de Gantt usando Excel o Google Spreadsheets.
Como organizar tu plan de proyecto
Plantilla de diagrama de Gantt en Excel
Implementando un plan de proyecto y gestionando actividades con Google Spreadsheets.
1. Definición de Requisitos
In esta primera fase debes definir el alcance y necesidades de tu aplicación web en términos de lo tu aplicación debe hacer, las principales funcionalidades y requisitos técnicos:
Para definir el alcance de tu aplicación web es suficiente con recopilar una lista detallada de las funcionalidades con una descripción clara. En este punto no es importante "cómo" se realizara esto pero si el "qué" es lo que se debe realizar.
Necesidades
Analizar las necesidades es una parte crucial del proceso de desarrollo. En este paso debes estimar tu tráfico potencial, escoger un lenguaje de lado del servidor (PHP, ASP, Coldfusion...), bases de datos, seleccionar un proveedor de servicio de hospedaje... No debes sobrestimar/subestimar tus estimaciones. Evalúa cada cosa con un balance adecuado entre tiempos, costos y objetivos.
2. Diseño
Después de la fase de definición de requisitos, debes "diseñar" tu aplicación con un proyecto bien claro. En esta fase puedes identificar los siguientes pasos:
Diseño: Mapa de la Aplicación
Un mapa de la aplicación contiene solamente información significativa y esencial acerca de la estructura de tu aplicación: paginas (representadas como bloques) y principales relaciones entre ellas. Tu mapa de aplicación debería ser algo así:
De esta forma tienes un mapa con algunas "ubicaciones" (páginas) y una "ruta" (relaciones entre páginas) las que sencillamente debes seguir en orden para proceder, página por página, para implementar tu aplicación en la siguiente fase. De esta forma ahorraras mucho tiempo, teniendo claro e la mente que es lo que debes implementar.
Diseño: Base de Datos
Ahora es el momento de diseñar la base de datos para tu aplicación. Una forma simple de hacerlo es usando modelos Entidad-Relación. En general puedes seguir este orden: define primero tablas, luego atributos y relaciones entre tablas. Tu modelo ER debería parecerse a este:
1:1 expresa la cardinalidad de una relación (en este caso por ejemplo 1 usuario es asignado solamente a 1 tarea, 1 usuario vive solamente en una ciudad). Para más información acerca de este tema revisar en mis artículos más viejos:
Definiendo el modelo de entidades y relaciones
Un enfoque correcto para definir relaciones entre tablas de base de datos
10 artículos útiles acerca de diseño de bases de datos
Diseño: Estructura de la Página
El siguiente paso es hacer una maqueta de tu página, identificando todas las secciones principales usando un nombre (por ejemplo #header, #navbar, #mainContent, #sidebar).
Diseño: Lenguaje del lado del servidor
Teniendo en mente la orientación a objetos para el desarrollo de tu aplicación, puedes definir clases, funciones y toda la funcionalidad el lado del servidor que necesites. Recuerda ... esto no es la "ejecución" pero si una forma de tener una "guía" para o que deberás implementar en la siguiente fase.
Diseño: JS Framework
En este paso seleccionamos un JavaScript Framework (jQuery, Scriptaculous, MooTools...), que proveería las funcionalidades que quieres implementar (arrastrar y soltar, animación, efectos ...) recopilando una lista de que fucnionalidades específicas están relacionadas con una o más páginas en tu aplicación.
En este punto la fase de diseño esta completa. Puedes iniciar con tu ejecución.
3. Ejecución
Ahora el verdadero reto porque "ejecución" es la realización de tu aplicación. Puedes dividir esta fase en los siguientes pasos:
Ejecución: Base de Datos
Crea una nueva base de datos y escribe el código SQL para definir tus tablas, atributos y relaciones. En el pasado dedique algunos artículos a este tema. Revisen los siguientes enlaces para mayor información:
Como usar PHP y SQL para crear tablas de base de datos y relaciones.
Creación de tablas y relaciones con SQL.
Ejecución: HTML
Usa la maqueta de la página para implementarla en código HTML.
Este es el momento para adicionar al HTML todos los elementos que necesites en las secciones identificadas durante la fase de Diseño. Por ejemplo si las secciones de contenido principal tiene un artículo con un título, un texto en el cuerpo y algunas etiquetas, agrega estos elementos:
Ejecución: CSSUna vez lista la estructura principal, inicias a escribir código CSS para adicionar estilos a tu aplicación. Si necesitas algunas sugerencias de como escribir mejor el código CSS revisa alguno de estos artículos:
CSS: enfoque semántico en convención de nombrado.
Guías útiles para mejorar tu CSS y su mantenibilidad.
Ejecución: Lenguaje del lado del servidor
Implementa las clases de la aplicación, funciones, interacciones con la Base de Datos, consultas, y cualquier cosa que requiera interacción del lado del servidor.
Ejecución: JavaScript
Implementa las fucnionalidades AJAX usando el framework que escojiste en la fase de diseño.
4. Prueba
Durante esta fase debes someter el código de tu aplicación a varias condiciones de ejecución (por ejemplo diferentes navegadores). Tu objetivo es detectar todos los errores en tu aplicación antes del lanzamiento final.
Recuerda, este proceso debe ser meticuloso y requiere mucha paciencia. Probar cada página y cada funcionalidad (también en este caso puede ayudarte tu mapa de aplicación para proceder con cierto orden). Si encuentras un error durante la pruebas de ejecución, corrigelo modificando el código y entonces realizas la validación final (una prueba posterior) del código.
5. Liberación o lanzamiento
¡Finalmente estas listo para lanzar tu aplicación! Publícala en un directorio de prueba y realiza una prueba final. Si todo funciona correctamente entonces procede al lanzamiento final.
* El contenido de este artículo, incluyendo imágenes y referencias, es una traducción de original que puede encontrarse en la siguiente dirección:
http://woork.blogspot.com/2009/01/structured-process-you-must-know-to.html
