Implementar estos comandos de voz es sencillo en las aplicaciones UWP solo debemos tener en cuenta que los comandos de voz inician con un prefijo, el cual usualmente es el nombre de la aplicación o una "palabra clave" aunque tenemos la libertad de definir opciones para pronunciar el nombre de la aplicación antes o después del comando y elegir que comportamiento implementar cuando la aplicación se lanza.

Al escribir este post Cortana solo está disponible en las siguientes regiones y lenguajes:

• Australia (Inglés)
• Canadá (Inglés)
• China (Chino simplificado)
• Francia (Francés)
• Alemania (Alemán)
• Japón (Japonés)
• Italia (Italiano)
• España (Español)
• Reino Unido (Inglés)
• Estados Unidos (Inglés)

Si deseas obtener los últimos lenguajes puedes visitar el siguiente link

Nota: Toma en cuenta que para que Cortana funcione correctamente necesitamos que el lenguaje del dispositivo, el paquete de lenguaje y el país o región correspondan con las configuraciones antes mencionadas.

Definiendo VoiceCommands

Y bien vamos ahora con el código que es por lo que seguramente estás en este post.

En primer lugar, todos los comandos de voz están definidos en un archivo XML por lo tanto agregaremos una a nuestro proyecto.
Y después debemos escribir la siguiente estructura.

<?xml version="1.0" encoding="utf-8" ?>  
<VoiceCommands xmlns="https://schemas.microsoft.com/voicecommands/1.2">  
  <CommandSet xml:lang="en-us" Name="HoLCommandSet en-us">
    <CommandPrefix>Hello commands, </CommandPrefix>
    <Example>Launch</Example>

    <Command Name="LaunchApp">
      <Example>launch</Example>
      <ListenFor>launch</ListenFor>
      <Feedback>Welcome aboard, I'm opening the app</Feedback>
      <Navigate/>
    </Command>

  </CommandSet>

  <!--Se puede agregar un soporte opcional para cualquier otro lenguaje soportado -->
  <!--<CommandSet xml:lang="es-es" Name="HoLCommandSet es-es"-->

</VoiceCommands>

Veamos en que consiste cada una de las secciones.

VoiceCommands es el elemento principal de nuestro XML y dentro del cuerpo de este tag es donde vamos a colocar todos nuestros comandos, el esquema de VoiceCommands debe apuntar a la versión 1.2.

<VoiceCommands xmlns="https://schemas.microsoft.com/voicecommands/1.2">  

CommandSet es el elemento principal de cada uno de los comandos soportados por nuestra aplicación y debe apuntar al lenguaje que va a soportar en este caso xml:lang="en-us".

<CommandSet xml:lang="en-us" Name="HoLCommandSet en-us">  

CommandPrefix es la palabra o frase que utilizaremos como usuarios para decirle al sistema que escuche los comandos para nuestra App. Este prefijo debe ser definido para cada uno de los elementos CommandSet en el lenguaje que definamos.

<CommandPrefix>Hello commands, </CommandPrefix>  

Nota: la coma que he colocado en el prefijo es opcional y solo sirve para indicar al sistema que debe hacer una pequeña pausa.

Ahora podemos crear nuestro comando, en la estructura debemos definir el elemento ListenFor que indicará al sistema que palabra o frase se utiliza para reconocer el comando, FeedBack que define el texto de confirmación que Cortana dirá al usuario al ejecutar el comando, el elemento Example para este comando y el elemento Navigate que significa que la aplicación se lanzará en el primer plano.

<Command Name="LaunchApp">  
   <Example>launch</Example>
   <ListenFor>launch</ListenFor>
   <Feedback>Welcome aboard, I'm opening the app</Feedback>
   <Navigate/>
</Command>  

Instalando los comandos de voz

Una vez que hemos definido el archivo XML de nuestro comando de voz, es necesario instalarlo, para ello vamos a utilizar el método InstallCommandDefinitionsFromStorageFileAsync en el método OnLaunched antes de iniciar el frame principal.

 var storageFile =
                await
                    Windows.Storage.StorageFile.GetFileFromApplicationUriAsync(new Uri("ms-appx:///VoiceCommands.xml"));

            await
                Windows.ApplicationModel.VoiceCommands.VoiceCommandDefinitionManager
                    .InstallCommandDefinitionsFromStorageFileAsync(storageFile);

Frame rootFrame = Window.Current.Content as Frame;  

Nota: Como ya habrás notado los comandos se instalan después de la primera vez que ejecutas tu aplicación.

Controlando el lanzamiento de nuestra aplicación

Cuando inicias tu aplicación a través de los comandos de voz la aplicación entra en el evento OnActivated en lugar de OnLaunched por tanto debemos crear el frame principal en este evento para que nuestra aplicación funcione.

También es necesario controlar como fue lanzada nuestra aplicación esto lo he realizado en un switch utilizando el enumerador ActivationKind
y por último manejar en un método los parámetros de nuestro comando de voz.

protected override void OnActivated(IActivatedEventArgs args)  
{
    Frame rootFrame = Window.Current.Content as Frame;
    if (rootFrame == null)
    {
        rootFrame=new Frame();

        rootFrame.NavigationFailed += OnNavigationFailed;

        Window.Current.Content = rootFrame;
    }

    switch (args.Kind)
    {
        case ActivationKind.VoiceCommand:
            HandleVoiceCommand(args,rootFrame);
            break;
        default:
            break;
    }

    Window.Current.Activate();

    base.OnActivated(args);
}

En el método en el que manejaremos nuestros parámetros haremos un cast del parámetro arg a VoiceCommandActivatedEventArgs y obtendremos el nombre del comando para realizar las tareas que tengamos preparadas para nuestra aplicación, en este caso solo navegaremos a la página de inicio.

private void HandleVoiceCommand(IActivatedEventArgs args,Frame frame)  
{
    var commandArgs = args as VoiceCommandActivatedEventArgs;

    var speechRecognitionResult = commandArgs.Result;
    var command = speechRecognitionResult.Text;

    var voiceCommandName = speechRecognitionResult.RulePath[0];
    var textSpoken = speechRecognitionResult.Text;

    Debug.WriteLine("Command: " + command);
    Debug.WriteLine("Text spoken: " + textSpoken);

    switch (voiceCommandName)
    {
        case "LaunchApp":
             frame.Navigate(typeof (MainPage));
             break;
        default:
        break;
    }

}

Y ahora podemos ejecutar nuestro proyecto y ver el resultado de nuestro ejemplo como se muestra en las siguientes imágenes (recuerda que debes ejecutar la aplicación al menos una vez para que se instalen los comandos).

El código de ejemplo lo he dejado en github y espero te resulte útil.

Si deseas saber más sobre los comandos de voz para Cortana visita el siguiente link

Espero te resulte útil este post y puedas incluir estos comandos de voz en tus aplicaciones.
¡Saludos!

@saturpimentel

Actualmente UWP no incorpora ningún framework de validación, sin embargo la comunidad de C# es pujante y en GitHub ya hay una alternativa muy interesante que vale la pena revisar: ValidatableBase .

En este post revisaremos como implmentar validación con atributos utilizando esta libreria.

Tarea 0 - Instalación

Lo primero es que debes descargar o clonar el repositorio de GitHub ya que actualmente al menos no tienen binarios publicados. Abres la solución y la compilas en modo release para obtener la dll.

Tarea 1 - Preparar la solución UWP y agregar la libreria de validación

1. Desde Visual Studio 2015 creamos un nuevo proyecto de tipo Blank UWP
   
2. Desde el explorador de soluciones creamos una nueva carpeta llamada Binaries y allí adicionamos los archivos generados al compilar ValidatableBase
   
   • ValidatableBase.dll
   • ValidatableBase.pdb
3. Agregamos como referencias del proyecto la libreria ValidatableBase.dll copiada en la carpeta de la solución
4. Ahora creamos otro folder y lo nombraremos util, allí crearemos BindableBase, sino sabes que es puedes referirte a este artículo : Apps, Binding, INotifyPropertyChanged y BindableBase | XAML | C# , pero en todo caso acá lo tienes
   
5. Abrimos el archivo MainPage.xaml y nos aseguramos de insertar este xaml en el Grid que viene por defecto.
   

   
       <StackPanel HorizontalAlignment="Stretch" VerticalAlignment="Center">
           <StackPanel Orientation="Horizontal">
               <TextBlock Width="100" Text="Nombre: "/>
               <TextBox Width="250" />
           </StackPanel>
           <StackPanel Orientation="Horizontal">
               <TextBlock Width="100" Text="Email: "/>
               <TextBox Width="250"/>
           </StackPanel>
           <StackPanel Orientation="Horizontal">
               <TextBlock Width="100" Text="Errores :"/>
               <TextBlock Width="400" Height="100"/>
           </StackPanel>
           <Button HorizontalAlignment="Stretch">Validar</Button>
       </StackPanel>
   
   

6. Ahora creamos una carpeta Models y allí el modelo, una clase User definida cmo se ve a continuación, heredando de ValidatableBase
   ``` using Sullinger.ValidatableBase.Models;

   public class User
   {
       BindableBase binder;
   
   
   private string name;
   
   
   public string Name
   {
       get { return name; }
       set { binder.SetProperty(ref name, value); }
   }
   
   
   private string email;
   
   
   public string Email
   {
       get { return email; }
       set { binder.SetProperty(ref email, value); }
   }
   
   
   public User()
   {
       binder = new BindableBase();
       email = name = string.Empty;            
   }
   
   
   }
   

   ```

7. En la solución creamos una carpeta ViewModels y en ella creamos la clase MainPageVM, por el momento como se ve a continuación
   ``` public class MainPageVM : BindableBase, ICommand { public event EventHandler CanExecuteChanged;

   public bool CanExecute(object parameter)
   {
       return true;
   }
   
   
   public void Execute(object parameter)
   {
       throw new NotImplementedException();
   }
   
   
   private User usuario;
   public User Usuario
   {
       get { return usuario; }
       set { SetProperty(ref usuario, value); }
   }
   
   
   private string errores;
   
   
   public string Errores
   {
       get { return errores; }
       set
       { SetProperty(ref errores, value); }
   }
   
   
   public MainPageVM()
   {
       errores = string.Empty;
       usuario = new User();
   }        
   

   } ```

   La libreria incorpora mecanismos más sofisticados y útiles que el que vamos a usar para mostrar los errores, pero con el fin de mantenerlo sencillo he optado por cumular los errores en una cadena de texto.

8. Ahora que tenemos esto listo, regresemos al xaml y dejamos listos el DataContext, los Binding y el Comando del botón, quedando así:
   

   ```

   <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
       <StackPanel HorizontalAlignment="Stretch" VerticalAlignment="Center">
           <StackPanel Orientation="Horizontal">
               <TextBlock Width="100" Text="Nombre: "/>
               <TextBox Width="250" Text="{Binding Usuario.Name, Mode=TwoWay}" />
           </StackPanel>
           <StackPanel Orientation="Horizontal">
               <TextBlock Width="100" Text="Email: "/>
               <TextBox Width="250" Text="{Binding Usuario.Email, Mode=TwoWay}"/>
           </StackPanel>
           <StackPanel Orientation="Horizontal">
               <TextBlock Width="100" Text="Errores :"/>
               <TextBlock Width="400" Height="100"/>
           </StackPanel>
           <Button HorizontalAlignment="Stretch" Command="{Binding}">
               Validar
           </Button>
       </StackPanel>
   </Grid>
   

   ```

Tarea 2 - El proceso de validación

1. La validación en ValidatableBase es basada en atributos, así que hay que decorar el modelo con atributos que indiquen que queremos validar, la propiedad Name de User la validaremos como requerida.
   
   [ValidateObjectHasValue( FailureMessage = "El nombre no se puede dejar en blanco", ValidationMessageType = typeof(ValidationErrorMessage))] public string Name { get { return name; } set { binder.SetProperty(ref name, value); } }

   Notemos que el atributo indica que el campo es requerido, y podemos colocar un mensaje de validación personalizado, de igual forma debemos indicar que esta validación es tipo error, podría tambien ser un warning.

2. Le hacemos la misma decoración al campo email
3. El campo email debe etener una validación adicional, pues desde luego queremos validar que si corresponda con un correo electrónico válido, hay varias formas de hacerlo con la libreria, ya que incluso puedes crear tus propios ValidationAttribute, pero para mantenerlo simple adicionaremos un atributo ValidateWithCustomHandler al campo Email quedando así
   [ValidateWithCustomHandler( DelegateName = "IsValidEmail", FailureMessage = "Esto no parece un correo electrónico", ValidationMessageType = typeof(ValidationWarningMessage))] [ValidateObjectHasValue(FailureMessage = "El email no se puede dejar en blanco", ValidationMessageType = typeof(ValidationErrorMessage))] public string Email { get { return email; } set { binder.SetProperty(ref email, value); } }


4. Cramos en la clase User el método IsValidEmail y lo marcamos con un atributo ValidationCustomHandlerDelegate como se ve a continuación

   `` [ValidationCustomHandlerDelegate(DelegateName = "IsValidEmail")] private IValidationMessage IsValidEmail(IValidationMessage failureMessage, PropertyInfo property) { const string regExp = @"\A(?:[a-z0-9!#$%&'*+/=?^_{|}~-]+(?:.[a-z0-9!#$%&'+/=?^_`{|}~-]+)@(?:a-z0-9?.)+a-z0-9?)\Z";

       return Regex.IsMatch(this.Email, regExp, RegexOptions.IgnoreCase)
           ? null
           : failureMessage;
   }    
   

   ```

Tarea 3 - Mostrar los errores

1. La aplicación ya esta preparada para realizar las validaciones, invocaremos la validación en el método Execute del viewmodel: MainPageVM
public void Execute(object parameter) { Usuario.ValidateAll(); }

2. Así como esta ya se ejecutarán las validaciones, pero desde luego hace falta mostrar los mensajes en pantalla, para ello modificams el código del método Execute del viewmodel: MainPageVM para concatenar todos los mensajes encontrados para cada propiedad tras la validación.
   ``` public void Execute(object parameter) { Errores = string.Empty; Usuario.ValidateAll();

   if (Usuario.HasValidationMessages())
   {
       var propiedades = Usuario.GetValidationMessages();
   
   
   foreach (var propiedad in propiedades)
   {
       foreach (var error in propiedad.Value)
       {
           Errores += $"{propiedad.Key}: {error.Message}\n";
       }
   }
   
   
   }
   

   } ```

   Como lo mencioné, la libreria tiene otras cosas más sofisticadas para mostrar los errores a traves de binding de colecciones, pero para mantener el ejemplo sencillo lo he hecho de esta manera

3. vamos al xaml y configuramos el Binding del control que muestra los errores, en el último TextBlock
   
   <TextBlock Width="400" Height="100" Text="{Binding Errores}" />
4. Ahora ejecutamos la aplicación y listo! cada vez que presionemos el botón se realizarán las validaciones.
   

Eso fue todo, espero sea últil ;)

La aplicación a la que me refiero tenía un backend con Mobile Services el cual ya ofrece un Azure Service Bus que utilizamos como backplane para la distribución de los mensajes.

Este es un post con un breve ejemplo de cómo enviar mensajes entre las aplicaciones, como primer punto vamos a definir que es SignalR.

¿Qué es SignalR?

SignalR es una biblioteca open source desarrollada por miembros del equipo de ASP .Net y que nos sirve para conectar aplicaciones en tiempo real de una manera muy sencilla, SiganlR nos provee una capa de abstracción que nos permite utilizar diferentes transportes que inicia por Web Sockets y en caso de no ser soportados hace un proceso de fallback entre los diferentes tipos de conexión que soporta.

El proceso de fallback a grandes rasgos sería el siguiente, primero intentaría conectar por web sockets, en caso de no poder conectarse lo intentará con Server Sent Events, Forever Frames y Long Pollig sucesivamente hasta lograr una conexión.

Una de las características principales de SignalR es que nos permite simular una conexión persistente en el caso del HTTP y administra la conexión con web sockets que sí soportan una conexión persistente.

SignalR nos da también la habilidad de hacer "push" desde el servidor hacia el cliente, evitando que el cliente tenga que realizar conexiones al servidor para validar si existe nueva información, SignalR evita esto permitiendo al servidor realizar callback a los clientes.

Creando nuestro primer Signalr Hub

Lo primero que haremos es instalar los paquetes de Nuget que nos darán acceso a las características de SignalR en nuestro servidor.

Para esto iremos a la consola de Nuget y agregaremos la siguiente línea.

Install-Package WindowsAzure.MobileServices.Backend.SignalR  

Una vez hemos agregado los paquetes a nuestro proyecto Web podemos crear nuestro hub, en este ejemplo crearemos un método que nos permita enviar un mensaje a todos los clientes conectados.

[HubName("ChatHub")]
    public class ChatHub : Hub
    {
        public ApiServices Services { get; set; }

        public void Send(string message)
        {
            Clients.All.helloMessage(message);
        }
    }

Nota: Clients.All no es la única manera en la que podemos enviar mensajes, también tenemos Caller, Others, AllExcept, etc. te invito al leer el siguiente post para más información.

Después en el archivo WebApiConfig agregaremos el siguiente código para iniciar los servicios de SignalR.

public static class WebApiConfig  
    {
        public static void Register()
        {
           //Initialize SignalR
           SignalRExtensionConfig.Initialize();            
        }
    }

Conectando nuestra aplicación

Ahora agregaremos los paquetes de Nuget para habilitar los servicios de SignalR en el cliente, como podrás notar en este ejemplo utilizaremos una aplicación universal.

Agrega la siguiente línea en la consola de Nuget.

Install-Package Microsoft.AspNet.SignalR.Client  

Una vez se instalen los paquetes agregaremos el siguiente código para conectarnos con los servicios de SignalR.

private IHubProxy proxy;  
private HubConnection hubConnection;

private async Task ConnectToSignalR()  
{
   //Se crea el hub utilizando la url de nuestro Mobile Service
   hubConnection = new HubConnection(App.MobileService.ApplicationUri.AbsoluteUri);  

   //Agregamos en los headers la llave de Mobile Service, de lo contrario no nos permitirá realizar la conexión 
   hubConnection.Headers["x-zumo-application"] = App.MobileService.ApplicationKey;

   //Creamos un proxy para conectarnos con el hub de chat que hemos creado previamente
   proxy = hubConnection.CreateHubProxy("ChatHub");
   // Iniciamos la conexión
   await hubConnection.Start();

   //Utilizaremos el método On para recibir la notificación cada vez que se utilice el mensaje "helloMessage".
   proxy.On<string>("helloMessage", async (msg) =>
   {
      await Dispatcher.RunAsync(CoreDispatcherPriority.Normal, () =>
      {
         message += " " + msg;
         Message.Text = message;
      });
   });
}

Al navegar a la página conectaremos con el hub.

 protected override async void OnNavigatedTo(NavigationEventArgs e)
 {          
    await ConnectToSignalR();
 }

Después agregaremos el siguiente código en un botón para enviar información desde nuestra app y no solo recibir.

private async void Button_OnClick(object sender, RoutedEventArgs e)  
{
   //Utilizaremos el método invoke cuando deseemos enviar un mensaje desde nuestra aplicación
   await proxy.Invoke<string>("Send", TextBox.Text);
   TextBox.Text = string.Empty;
}

Escalando con Azure Service Bus

En este caso al utilizar Mobile Service y tener un nivel de servicio básico o estándar (como es el caso que he platicado anteriormente) te tengo una buena noticia, ya tenemos habilitado Azure Service Bus para sincronizar nuestra entrega de mensajes en los clientes sin importar cuantas instancias tengamos trabajando. ¡Excelente! ¿No te parece?
La siguiente es una imagen que explica cómo funciona SignalR en conjunto con Azure Service Bus.

Nota: Azure Service Bus a pesar de ser un muy buen servicio no es el único con el que puedes trabajar ya que SignlR te permite trabajar también con Redis y con SQL Server.

Ahora ya podemos enviar mensajes en tiempo real a través de nuestras aplicaciones.

Te dejo él código del proyecto de ejemplo en github, como siempre espero te resulte útil y no olvides compartir.

¡Saludos!

En este post vamos a ver como reconocer a cada una de las diferentes familias, para ello vamos a crear un nuevo proyecto y en el MainPage.xaml.cs vamos a agregar la siguiente referencia.

using Windows.System.Profile;  

Después vamos a agregar una propiedad que va a contener un mensaje con el nombre de la familia a la que pertenece el dispositivo la cual vamos a obtener a través de la propiedad DeviceFamily de la clase VersionInfo.

public string DeviceFamily = $"La familia del dispositivo es:{AnalyticsInfo.VersionInfo.DeviceFamily}";  

Entre los posibles resultados que arrojará esta propiedad se listan los siguientes:

• Windows.Desktop
• Windows.Mobile
• Windows.Xbox
• Windows.IoT

Por último vamos a utilizar un atado de datos con x:Bind para vincular la propiedad con el TextBlock y listo podemos ejecutar nuestro aplicación y saber en qué familia de dispositivos se esta ejecutando nuestra aplicación.

<StackPanel>  
    <TextBlock Text="¡Hola UWP!" FontSize="24" FontWeight="Light" Margin="12" />
    <TextBlock Text="{x:Bind DeviceFamily}" Margin="12,0,0,0" />
</StackPanel>  

Ahora podemos conocer a que familia pertenece el dispositivo donde se está ejecutando nuestra aplicación y hacer los cambios que consideremos necesarios, espero les resulte útil ¡Saludos!

Con la salida de Windows 10 han llegado las Universal Windows Platform Apps y ahora dedicaré un tiempo para escribir una serie acerca de cómo iniciarse en el desarrollo de estas aplicaciones y algunos cambios que son importantes. Resolvamos primero la siguiente pregunta.

¿Qué son las Universal Windows Platform?

En resumen, las aplicaciones Universal Windows Platform son las nuevas aplicaciones de Windows 10, las cuales incluyen un núcleo común para todos los dispositivos con Windows 10 y que además incluye un API específica para cada una de las familias de dispositivos, permitiéndonos desarrollar aplicaciones con tiempo, esfuerzo y recursos menores en los diferentes dispositivos de la familia Windows 10 comparado con el desarrollo por separado.

Si necesitas más información puedes ver la presentación que he realizado hace algún tiempo en este link o ver el siguiente vídeo.

Las herramientas

Veamos las herramientas que nos serán necesarias para el desarrollo de estas aplicaciones.

Visual Studio 2015 y Microsoft Blend

Primero vamos a necesitar Visual Studio 2015 en cualquiera de sus versiones Enterprise, Professional o Community que además incluyen Blend (una herramienta para hacer interfaces de usuario mucho más atractivas con menor esfuerzo que en Visual Studio).

Te dejo el link donde puedes descargar la versión Community y ver precios de las otras versiones aquí.

SDK de desarrollo

Por lo general al inicio de la instalación de Visual Studio 2015 se te ofrece la opción de agregar las herramientas de desarrollo para Universal Windows Platform Apps, selecciónala y el asistente instalará todo lo necesario, asegúrate de seleccionar también los emuladores.

Si no elegiste la instalación anterior siempre puedes descargar el SDK por separado en el Dev Center, solo tienes que buscar la opción que aparece en la siguiente imagen y descargar el instalador.

Creando nuestro primer proyecto UWP

Para generar nuestra primer aplicación UWP, solo tienes que ir al menú File -> New -> Project.
A continuación, seleccionemos la opción Windows y después una aplicación en blanco tal como se muestra en la siguiente figura.

Cambiemos un poco el código de MainPage.xaml y agreguemos la siguiente línea dentro del Grid.

<TextBlock Text="¡Hola Windows 10!" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="35"></TextBlock>  

Ahora compilemos, ejecutemos nuestra aplicación y ¡Listo!

Si tienes acceso a una raspberry con Windows 10 IoT también puedes ejecutar la aplicación y puedes probar en los dispositivos móviles con Windows 10.

Una pregunta que surgió en un grupo y que considero es común, es como podemos quitar el contador de frames que aparece en la esquina superior izquierda el cual es útil para monitorear aplicaciones que utilicen muchos gráficos, la respuesta es muy sencilla solo tenemos que cambiar el valor de la propiedad EnableFrameRateCounter a false en el archivo App.xaml.cs.

#if DEBUG
    if (System.Diagnostics.Debugger.IsAttached)
    {
        this.DebugSettings.EnableFrameRateCounter = false;
    }
#endif

¿Cuál es la estructura general de los Universal Windows Platform?

Existen componentes comunes en todos los proyectos UWP y que van a resultar conocidos para todos los desarrolladores que tengan experiencia con proyectos con XAML,veamos los más relevantes.

Los archivos App.xaml y App.xaml.cs

App.xaml.cs es el archivo de entrada a todas las aplicaciones UWP y contiene los métodos que se encargan de controlar los eventos de activación (el cual es sobrescrito) y suspensión. En el proyecto que hemos generado por default nos ha agregado una llamada al método InitializeComponent() también ha inicializado Application Insights(Un sistema de monitorización que veremos más adelante) y ha agregado el método encargado de controlar el evento Suspending.

Nuestra página principal MainPage

Esta vista está compuesta por MainPage.xaml y MainPage.xaml.cs y hereda de la clase Page, en la primera podemos manejar todos nuestros elementos gráficos de una manera muy cómoda y en el segundo archivo podemos agregar toda nuestra lógica y manejadores de eventos, aunque como hemos visto en una serie anterior en aplicaciones empresariales lo más recomendable es implementar el patrón MVVM.

Para mayor información del patrón MVVM visita el siguiente link

El archivo de manifiesto del paquete

En el archivo Package.appxmanifest se encuentra la descripción y la identificación de tu aplicación, es en este archivo donde podemos agregar capabilities y extensions además de que puedes administrar las pantallas de inicio, los Tiles y logos. Para modificar este archivo, no es necesario que conozcas todos los tags XML de cada una de las características ya que contamos con el Manifest editor (editor de manifiesto) que nos permite manejar todo de una forma gráfica, ¿Fácil no?

El folder de referencias

Es común en todos los proyectos utilizar librerías adicionales de terceros y estas están dentro del folder references en el cual puedes también almacenar los archivos de los paquetes que agregues de Nuget.

Las propiedades del proyecto

El archivo de propiedades es donde puedes definir como se compilará tu proyecto, actualizar las versiones de tu proyecto y configuraciones para hacer debug de tu proyecto entre otras cosas.

Con esto llegamos al final de este post, te invito a suscribirte a la lista de correos para mantenerte informado de las nuevas entradas de esta serie antes que nadie y si tienes alguna duda puedes encontrarme en twitter como @saturpimentel.

Nos vemos.
¡Saludos!

New news that's new... Today we released Visual Studio 2015 Update 1 CTP - https://t.co/7bKKNMwd6F Read all about it. pic.twitter.com/Xr4mAChShB

— Visual Studio (@VisualStudio) octubre 8, 2015

Después de ver el tweet fui a la página y revisé las nuevas características que pronto veremos en Visual Studio 2015.

Una de las que más llamó mi atención fue Interactive Window, esta pequeña ventana nos va a permitir probar pequeñas piezas de código de una manera rápida y sencilla sin la necesidad directa de compilar y ejecutar nuestro proyecto en curso o generar otro (algo que al menos una vez todos hemos hecho).

¿Qué es Interactive Window?

Interactive Window es una REPL que soporta características como el IntelliSense dentro de Visual Studio 2015.

Según wikipedia un REPL es:

Un read–eval–print loop (REPL), es un simple, entorno interactivo de programación computacional que toma entradas de usuario individuales (es decir expresiones individuales), las evalúa y retorna el resultado al usuario; un programa escrito en un entorno REPL es ejecutado en trozos.

Activar esta ventana es muy sencillo, solo tienes que instalar el update 1 de Visual Studio 2015 y seleccionar la opción View > Other Windows > C# Interactive.

Contexto asíncrono y público.

Esta herramienta soporta por el momento la versión 6.0 de C#,
el contexto es por default asíncrono y tiene un nivel de acceso public para variables y métodos, aun cuando el contexto es asíncrono puede trabajar con código no asíncrono, como en el siguiente ejemplo

Pantalla para Enumerables

Una de las cosas que más me ha gustado es el soporte que tiene para LINQ to objects y lo sencillo que es entender el resultado.

Características interactivas

Esta herramienta es muy fácil de utilizar con solo presionar enter podremos evaluar nuestros snippets de código, también contamos con un histórico de navegación que podemos utilizar utilizando las combinaciones de teclas alt + flecha arriba y alt + flecha abajo.

Podemos navegar en el editor de una forma simple e intuitiva y las acciones de copiar y pegar mantienen el formato y puedes utilizar los clásicos shortcuts ctrl + c y ctrl + v.

Esta ventana también tiene soporte de múltiples líneas y además tienes disponible la capacidad de selección de los snippets.

Características de edición

Como he mencionado anteriormente tenemos disponible IntelliSense además de buscar y reemplazar.

Comandos

Interactive Window tiene soporte para algunos comandos que pueden resultarte útiles y se listan a continuación.

• #r nos da la capacidad de agregar referencias a ensamblados por ejemplo 'turuta\ensamblado.dll'

• #load con este comando puedes cargar archivos scripts de c# (.csx)
• #clear o #cls para limpiar la pantalla
• #help para ayuda, por si solo muestra la lista de comandos, pero si especificas el comando te muestra la documentación disponible.
• #reset para reiniciar Interactive Window a su estado inicial.

Interactive Window también está disponible en línea de comandos

Con algunas limitaciones evidentes, como la falta de IntelliSense y otras inherentes a la consola podemos tener acceso a C# Interactive.

Para ello solo tienes que iniciar la consola de Visual Studio 2015 y teclear csi.

Conclusión

En lo personal me ha gustado esta nueva herramienta ya que me permitirá probar código y verificar el resultado de algunas operaciones sin necesidad de ejecutar ni tener que crear proyectos solo para probar alguna funcionalidad.

Para mantenerse al tanto de la documentación del proyecto de Interactive Window pueden hacerlo aquí y si quieren probar el update 1 de Visual Studio 2015 pueden hacerlo aquí, solo tengan muy en cuenta que es una versión CTP por lo tanto aun no es una versión final (advertidos están :D).

Por último, dejo algunas preguntas para ti.
¿Qué te parece esta nueva herramienta? ¿En que escenarios la utilizarías?

¡Saludos!

Hola, este es el primero de una serie de HOL(= Hands On Lab) que he diseñado para que aprendas los fundamentos sitios web en Azure.

Como obtener una suscripción en Azure

Puedes obtnerlas de muchas formas

1. A través del trial, este trial es de 200 USD que te regala microsoft para que pruebes lo que quieras: Try it Now Aunque es gratis se requiere tarjeta de crédito, más como un procedimiento de verificación que cualquier cosa. Te descuentan un dolar de prueba y en 24 horas te lo devuelven
2. Con una suscripción normal de pago
3. Por medio del programa BizSpark, si eres emprendedor puedes registrarte en este programa y Microsoft te apoyara en tu emprendimiento con un montón de beneficios, entre los que se encuentran 150 USD al mes durante tres años para consumir servicios en Azure. Puedes ver este video para más info:

4 . Si tu, o la empresa para la que trabajas tienen una suscripción a MSDN esta viene tambien con un bono mensual gratuito para consumir servicios en Azure.
5. Sitios web de Azure que duran una hora y es GRATIS Try Azure WebSites

Tarea 1 - Crear un sitio web gratuito y compartido

Utilizando el portal de Azure

1.Navegamos al portal de azure manage.windowsazure.com
2.Dentro del panel de opciones seleccionamos Aplicaciones Web

3.En el menu inferior damos click en Nuevo

4.Se desplegará un menú para crear un nuevo sitio web, donde seleccionamos "Creación personalizada"

5.Configuramos el sitio de la siguiente forma, asegurate de personalizar tu nombre, escoge la opción de sitio web gratuito y base de datos gratuita. Sino tienes una base de datos gratuita procede a crear una nueva con las configuraciones por defecto.En plan de hospedaje asegúrate de utilizar Este de EEUU (Gratis)

6.Asegurate de nombrar la base de datos de una forma adecuada, para que siempre sepas que base de datos es.
7.De la misma forma, para este ejercicio, en el panel siguiente crea un nuevo servidor de base datos, para efectos de este laboratorio usaremos los siguientes datos de acceso

• Usuario: JuanK
• PassWord: DevCamp2015
• Región: Este de EEUU

8.Seguidamente hay que establecer el repositorio, seleccionaremos "Repositorio Git Local"

1. Eso es todo hemos creado nuestro primer sitio web. Dentro del panel de Azure damos click en nuestro sitio creado y a continuación click en "Examinar"
   

2. En el browser se abrirá el nuevo sitio creado con su contenido por defecto
   

Utilizando X-Plat

Hay muchas formas para crear un sitio web en azure, la más normal es a través del portal como lo acabamos de hacer, sin embargo en un entorno profesional para desarrolladores o ITpro es necesario recurrir a la automatización por ello revisaremos formas alternativas de crear un sitio web.

1.Abrir la consola de X-Plat, para ello abrimos una consola de comandos pulsando en el teclado [Windows] + [R], allí escribimos CMD y presionamos [ENTER]

2.En la consola de comandos ingresamos el siguiente comando, lo cual producirá la siguiente salida

    azure

3.Para ver las opciones disponibles para crear un sitio web ingresamos.Esto nos mostrará la lista completa de comandos para crear un sitio web desde X-plat.

azure site  

4.Para poder trabajar con X-PLat necesitamos adicionar nuestra cuenta de Azure, nos aseguraremos de solo trabajar con ella por el momento. Para ello ingresamos el siguiente comando

azure account clear  
azure account download  

5.El último comando ingresado lanzará una ventana del browser, es posible que se requiera autenticación, pero una vez realizada el browser cargará la siguiente página

6.Esto descargará un archivo .publishsettings con el conjunto de credenciales, asegúrate de guardarlos en una ubicación adecuada.

 azure account import "K:\MyDownloads\MSDN-credentials.publishsettings"

7.Ahora haremos uso del comando create así que ingresamos el siguiente comando para ver el detalle de su uso.

azure site create -h  

8.El cual nos devolverá algo como esto:

Create a web site

Usage: site create [options] [name]

Options:  
  -h, --help                       output usage information
  -v, --verbose                    use verbose output
  --json                           use json output
  --location <location>            the geographic region to create the website
  --hostname <hostname>            the custom host name to use
  --slot <slot>                    the name of the slot
  --git                            Configure git on web site and local folder
  --gitusername <gitusername>      the publishing username for git
  --github                         Configure github on web site and local folder
  --githubusername <username>      the github username
  --githubpassword <password>      the github password
  --githubrepository <repository>  the github repository full name (i.e. user/repository)
  -s, --subscription <id>          the subscription id

9.Con esta información podemos proceder a crear un nuevo website, ingresaremos el siguiente comando, la ejecución tardará un poco.

azure site create --location "East US" --git juank2  

10.Puedes cambiar juank2 por el nombre que desees, de seguro ese nombre ya esta ocupado. En el ejemplo hemos usado la ubicación "East US", para obtener una lista de las diferentes ubicaciones para websites puedes ingresar este comando el cual dará la siguiente respuesta.

site location list

Name  
----------------
South Central US  
North Europe  
West Europe  
North Central US  
West US  
East Asia  
East US  
Southeast Asia  
East US 2  
Japan West  
Japan East  
Central US  
Brazil South  
site location list command OK  

11.Desde el portal revisa que el sitio se haya creado de forma exitosa y abre la URL de la misma forma en como lo hiciste en la Utilizando el portal de Azure.

Tarea 2 - Crear un sitio web - Básico y conocer sus funcionalidades - Wordpress

1.Navegamos al portal de azure manage.windowsazure.com
2.Dentro del panel de opciones seleccionamos Aplicaciones Web

3.En el menu inferior damos click en Nuevo

4.Seleccionamos la opción "De la galería"

5.En el recuadro escogemos "Blogs" y seguidamente "WordPress"

6.Seguidamente debemos configurar el blog, seleccionamos

• "Crear una nueva bsae de datos MySQL"
• Este de EEUU Gratis

7.En la siguiente pantalla configuramos la BD MYSql, con un nombre adecuado y la misma región seleccionada para el website.

8.Eso es todo hemos creado nuestro primer sitio web. Dentro del panel de Azure damos click en nuestro sitio creado y a continuación click en "Examinar"

9.Arrancará una pantalla de configuración para wordpress

10.Revisa la pestaña con el icono de nube allí encontrarás acceso directo a otras funcionalidades del sitio
11.En la parte inferior se ubican los controles de Inicio, Apagado y Reinicio del sitio entre otras opciones

12.En la pestaña "Configurar" encontraremos múltiples opciones pero para este caso debemos notar estas, porque se encuentra activado el soporte para PHP.

13.En la pestaña "Escalar" debemos notar que tenemos un sitio web de tipo "Gratis" por lo que la barra de desplazamiento se encuentra bloqueada
14.Damos click en "Compartido", más abajo en número de instancias movemos la barra hasta 3 y presionamos "Guardar"

15.Lo que acabamos de hacer es configurar nuestro sitio con más capacidad, ahora no solo no tiene las limitaciones de un sitio web gratuito, sino que ahora se encunetra en un hosting compartido y nos permite crear varias instancias del mismo sitio a manera de cluster para balancear el consumo del mismo en tres servidores. Otra ventaja de los sitios "Compartidos" versus los "Gratis" es que puedes asociar nombres de dominio personalizados.

Tarea 3 - Crear un sitio web - Básico y conocer sus funcionalidades - Java

1.Navegamos al portal de azure manage.windowsazure.com
2.Dentro del panel de opciones seleccionamos Aplicaciones Web

3.En el menu inferior damos click en Nuevo

4.Seleccionamos la opción "De la galería"

5.Seleccionamos "Apache Tomcat"

6.En la siguiente pantalla nombramos el website y escogemos el tipo de sitio/región que vamos a crear

7.Una vez creado el sitio procedamos a la pestaña "Configuración" Allí notaremos que aunque la opción de java esta deshabilitada en el portal , este comportamiento puede ser modificado en el archivo de configuración del web server para la aplicación.
8.Navegamos al portal de azure manage.windowsazure.com
9.Dentro del panel de opciones seleccionamos websites

10.En el menu inferior damos click en Nuevo

11.Seleccionamos "Creación Rápida", configuramos nombre y región "Este de EEUU Básico" o crear un nuevo plan de hospedaje en esa misma Zona.

12.Exploramos el sitio como lo hemos hecho en otras oportunidades, y veremos

13.Vamos a la pestaña "Configuración" y encendemos las opciones que se ven a continuación, seguidamente presionamos guardar.

14.Exploramos el sitio nuevamente y obtendremos

15.Ahora el sitio soporta java de acuerdo a la configuración del portal
16.En el portal de Azure vamos a la pestaña "Escalar" puesto que así lo configuramos desde su creación, en la parte inferior podemos mover el slider hasta 3 instancias, pero a diferencia del modo Compartido revisado anteriormente ahora trabajamos con instancias de computo dedicadas exclusivamente para nuestras aplicaciones.
17.Otra cosa importante de notar es que ahora podemos escoger la capacidad de estas instancias de computo. Para este ejercicio el sitio debes configurarlo en modo básico y dos instancias del tamaño mostrado en la gráfica.

18.Recuerda grabar.
19.Configurar el sitio como básico te da acceso a otras funcionalidades de la plataforma, en la pestaña "Configuración" revisa los settings que aparecen a continuación, estas funcionalidades no están disponibles en sitios configurados como "Compartido" o "Gratis"

Tarea 4 - Crear un sitio web - Estándar y conocer sus funcionalidades - ASP.Net MVC

1.Abrimos Visual Studio, creamos un nuevo proyecto [File > New project] de tipo "ASP.Net Web Application"

2.En la configuración seleccionamos

3.Escogemos un nombre par el sitio y lo configuramos como se ve a continuación

4.Visual Studio por si mismo creará el website de Azure y asociara el proyecto con este. Es probable que en este proceso se te solicite autenticación.
5.Presionamos [F5] para lanzar el sitio localmente, una vez lanzado se debe ver así.

6.Desde Visual Studio detenemos el sitio web

7.Click derecho sobre el proyecto y seleccionamos "Publicar"

8.En el diálogo siguiente validaremos la conexión
9.Si todo está bien, y debería estarlo damos click en publicar

10.El sitio se lanza automáticamente en el browser puedes cambiar el tamaño de la ventana para ver como el sitio se adapta automáticamente, esto se llama diseño responsive y esta presente gracias a que la plantilla de ASP.Net esta creada con un framework de CSS para tal fin: BootStrap. ASP.Net es compatible con tecnologías estándar de punta como HTML5, CSS3 y javascript.

11.El sitio ya se encuentra publicado en Azure, vamos a la pestaña "Configuración" y nos aseguramos que este configurado como "Estándar"
12.Aumentaremos el número de instancias a 4 y guardamos. Tengamos atención en la parte resaltada en rojo

13.Los sitios estándar tienen todos los beneficios de estar en la nube. No solo podemos cambiar el tamaño de las instancias de computo y aumentar el número de instancias, sino que ademas podemos crear un sitio elástico. Es decir un sitio que sea capaz de aumentar o reducir el número de instancias según se requiera. Para qué? para solo utilizar lo que se necesita y por ende solo pagar por lo que realmente se usa. En adición a tener un sitio que responde de manera inmediata a diferentes volúmenes de usuarios.
14.Seleccionamos la opción de escalar por CPU, configuramos luego de la siguiente forma:

• Número mínimo de instancias: 3
• Número máximo de instancias: 8
• CPU Mínima: 30
• CPU Máxima: 80

15.Lo que acabamos de hacer no es otra cosa que establecer la forma en que mi sitio escalará de manera elástica, le hemos indicado que cada que el promedio de uso CPU esté por debajo del 30% se deben apagar instancias de computo hasta llegar a un mínimo 3. Y que cada vez que el promedio de CPU esté por encima del 80% encienda nuevas instancias de computo hasta un máximo de 8. Guardemos los cambios y exploremos el sitio.
16.Tener un sitio estándar tiene aún más flexibilidad para configurar la escalabilidad de la aplicación. Damos click en el botón "Configurar horas de programación"

17.Configuramos horas de programación adicionales marcando las casillas que se muestran en la imagen. Lee lo que dice cada una de ellas

18.Al aplicar los cambios ahora podemos escoger nuevos valores de la lista, cada uno de ellos nos permite crear diferentes programaciones según si es de noche o de día o si estamos en un fin de semana.

19.Seleccionemos la opción "Noche de la semana" configurándola como se ve a continuación. Analiza el porque esta configuración puede ser conveniente.

20.Guarda los cambios, selecciona ahora "Fin de semana" y en número de instancias coloca solo 21.Analiza el porque esta configuración puede ser o no ser conveniente.

22.Vamos al menú configuración y habilitamos la siguiente opción.

23.Normalmente cuando un sitio web entra en desuso, es decir deja de recibir visitas por un tiempo, el web server baja el sitio de la memoria, lo cual no esta mal pero cuando alguien vaya a visitar el sitio después de este periodo inactivo sentirá el sitio un poco lento mientras el web server termina de cargarlo en memoria nuevamente. Esta opción le indica al web server que nunca baje el sitio de memoria aunque este se encuentre inactivo.
24.En el portal de Azure vamos a la pestaña "Copias de Seguridad". Ahora que nuestro sitio está en modo estándar podemos automatizar la generación de copias. Explora estas opciones. Sino tienes una cuenta de almacenamiento en Azure puedes crearla en esta opción.

FIN

nameof es una de estas nuevas características y en este vídeo veremos cómo utilizarlas y cuáles son sus características.