Archivo de la etiqueta: visual studio 2010

Half ToDo: Un caso de uso de ASP.net MVC4

Página principal

He de reconocer que me gustan los gestores de tareas, me imagino que será por lo mal que gestiono yo las mías. He probado muchos de los disponibles en el mercado y además quería hacer mi propia solución. Han sido varios intentos (MVCTask usando Azure, MetroTask para Windows 8, otro cliente por línea de comandos), pero creo que esta es la buena.

Las bases

La idea para desarrollar la aplicación era la siguiente:

  • Debía de ser simple
  • Debía de ser visualmente atractiva
  • Debía de resolver un problema

La idea era simple: Una práctica está dividida en varias tareas, y las tareas pueden tener dos estados, completada y sin completar. El porcentaje de terminación de una práctica está definido por el cociente entre las prácticas completadas dividido entre las prácticas totales.

Además, cada práctica estará enlazada a una persona concreta, de tal manera que yo solamente tenga acceso a las mías y no a las del resto de la gente (por aquello de la seguridad y tal).

Bajo el capó

Con esas tres premisas abrí Visual Studio y empecé un proyecto de nombre PracticasManager, ya que en un principio el proyecto va destinado a gestión de prácticas en la universidad.

Para realizar el proyecto me basé en la última versión de ASP.net MVC, la 4 que se encuentra en estos momentos en su fase de Developer Preview, ya que quería probar ciertas capacidades relativas al uso como aplicación móvil. El lenguaje de programación es C# y la interfaz para la creación de la aplicación es Razor.

El sistema ORM para el mapeo desde los objetos hasta la base de datos no podía ser otro que Entity Framework, usando el método Code-First, que permite definir nuestros objetos usando POCO (Plain Old C# object) y que las tablas de la base de datos se generen automáticamente.

La base de datos está gestionada por un SQL Server 2008 R2 que proporciona el proveedor del alojamiento.

Una cara bonita

Para la interfaz gráfica he usado Twitter Bootstrap, un conjunto de plantillas CSS y Javascript que permiten a los desarrolladores que no sabemos combinar colores que salga una interfaz decente. Finalmente la barra de progreso está creada con JQuery UI.

Detalle del listado de las tareas

También para móviles

Otra de las cosas que quería probar era el comportamiento de la aplicación en un móvil, así que usando las nuevas características de ASP.net MVC4, jQuery Mobile (y algun que otro paquete de nuget), pude implementar una interfaz básica de la aplicación para dispositivos móviles.

Detalle de la interfaz para dispositivos móviles

Alojamiento

Para el alojamiento decidí buscar algo diferente, tras probar Azure para otros proyectos (muy potente, y muy escalable, pero muy complejo para las necesidades de este proyecto) descubrí AppHarbor, un sistema de despliegue en la nube basado en Git (como Heroku, el sistema de despliegue preferido de las aplicaciones Ruby on Rails), completamente gratuito (para proyectos pequeños) y muy fácil de usar. La experiencia ha sido muy gratificante y recomiendo probarlo aunque sea con proyectos muy pequeños.

Detalle de interfaz de administración de AppHarbor

Conclusiones

Este proyecto me ha servido para poder lanzar una solución funcional para un problema concreto, así como la ocasión de probar tecnologías que no había visto hasta ahora, como JQuery Mobile, Bootstrap, el despliegue en AppHarbor entre otros.

Te animo a que la pruebes, está en una fase bastante experimental, así que puedes encontrar algún que otro fallo. Tanto si te gusta como si no, dejame un comentario y sabré qué puedo mejorar.

Enlace: Half todo en AppHarbor

Anuncios

Data binding en Windows Forms

Las interfaces de usuario basadas en formularios han permitido pasar de aplicaciones en modo consola a sistemas más interactivos. Esto representa un gran avance de cara a los usuarios, pero desde el punto de vista del desarrollo se puede complicar un poco el código.

En este artículo se verá cómo el acceso a datos o DataBinding proporciona varias ventajas en el desarrollo de las aplicaciones y aumenta la calidad del código. Para el código se usará C# y como herramienta de desarrollo, la versión profesional de Visual Studio 2010, aunque se puede emplear la edición express, completamente gratuita, sin ningún tipo de problemas.

Configuración inicial

Para este ejemplo se creará un nuevo proyecto C#, y se agregarán un par de controles al formulario por defecto, un par de campos de texto TextBox y un botón Button para ejecutar las acciones. El aspecto final del formulario tendrá este aspecto:

Además del formulario, se creará una clase Persona que contendrá dos campos, Nombre y Apellidos, así como un método denominado Guardar. El código es el siguiente:

    public class Persona
    {
        public string Nombre { get; set; }
        public string Apellidos { get; set; }

        public void Guardar() { }
    }

Sin DataBinding

El siguiente paso es mostrar datos en el formulario, para ello se edita el código del constructor para que muestre algunos datos, y luego se edita la acción del botón para que, a partir de los datos del formulario genere una nueva persona y lo guarde:

        public Form1()
        {
            InitializeComponent();
            Persona p1 = new Persona() { Nombre = "Roberto", Apellidos = "Luis" };
            textBox1.Text = p1.Nombre;
            textBox2.Text = p1.Apellidos;
        }

        private void button1_Click(object sender, EventArgs e)
        {
            Persona p2 = new Persona();
            p2.Nombre = textBox1.Text;
            p2.Apellidos = textBox2.Text;
            p2.Guardar();
        }

Este código está claro, el problema es que se han perdido 4 líneas en asignar valores desde y hasta dos campos de texto, en un formulario con 10 campos la cosa se puede complicar, y no es por el número de líneas de código, sino porque esta duplicidad puede generar errores al modificar el mismo.

Con DataBinding

La diferencia fundamental del enlace a datos es que se pueden enlazar los campos del formulario de manera directa a las propiedades de una clase, de tal manera que las asignaciones se siguen realizando, pero dentro del código generado por Visual Studio y son bidireccionales, es decir, que cualquier cambio en el formulario afecta directamente a las propiedades de la clase.

Para enlazar el formulario a la clase es necesario, con el formulario en modo diseño, seleccionar el primer campo a enlazar (en nuestro caso textBox1), desplazarse a la ventana propiedades, situada en la esquina inferior derecha, o con la secuencia Alt + Enter.

En esta ventana, se selecciona la opción DataBindings, y dentro de esa opción, el campo Text, no se sorprenda al no encontrar nada, ya que deberemos agregar el origen de datos al proyecto, pulsando en el botón Add Project Data Source…, el cual mostrará el asistente para la selección del origen de datos.

En este asistente se selecciona Object como el origen de datos del control:

Dentro de este origen se selecciona la clase Persona (Nota, si no aparece la clase es que no ha recompilado el proyecto, tras compilarlo y volver a ejecutar el asistente se mostrará la clase).

Al finalizar el asistente, al volver a ir al menú, el contenido no estará vacío, sino que se podrá acceder a los campos de la clase sin problemas, y asignarlos al valor Text del control. Al asginarlo por primera vez se mostrará un nuevo control en el diseñador, llamado personaBindingSource, que es el objeto que realiza la magia del enlace de datos. De esta manera se puede asignar los valores a los 2 campos de texto sin problemas.

Finalmente queda editar el código para sustituir las asignaciones por una única asignación al objeto personaBindingSource, y obtener la información del mismo:

        public Form1()
        {
            InitializeComponent();
            personaBindingSource.DataSource = new Persona() { Nombre = "Roberto", Apellidos = "Luis" };
        }

        private void button1_Click(object sender, EventArgs e)
        {
           (personaBindingSource.DataSource as Persona).Guardar();
        }

Hemos eliminado 4 líneas del código, y la validación se efectúa directamente en la clase. Esto permite que se puedan usar patrones como MVC en aplicaciones Windows Forms.

Conclusiones:

Windows Forms, aunque ha pasado a segundo plano con el auge de WPF, silverlight y las interfaces metro, se sigue empleando para soporte de aplicaciones existentes y como manera de creación de nuevas soluciones. Este método permite tener una codificación más limpia, liberar el código del formulario, y que la clase tenga la responsabilidad de validar datos y de mantener su integridad. Es verdad que esto implica cierto acoplamiento, pero la ventaja es que cualquier clase que herede de Persona podrá ser enlazada sin más que cambiar dos líneas de código.

Más información:

  • Descarga el ejemplo terminado aquí

Creando un servidor HTTP básico con C#

Una de las prácticas de la carrera, de la asignatura Redes II, consistía en hacer un servidor HTTP básico, que manejara comandos GET, POST, y mostrara páginas y ficheros de cualquier tipo. Esto en C es un auténtico coñazo, ya que tardas más tiempo pegándote con los punteros que trabajando en la solución, así que casi que además voy a hacer una copia en C#, y lo dejo por escrito ;).

Sigue leyendo