Simple Grid Table JSon

La libreria "JSonTable" dibuja una tabla en HTML a partir de datos serializados en formato JSON. La version actual muestra todos los campos del JSON (permitiendo ocultar campos), le agrega un link para ordenar al encabezado de la tabla y agrega paginado a la tabla.

Para poder utilizar el metodo, es necesario incluir el encabezado de la tabla con el id en el codigo HTML.

drawTable(vData, tableName, rows, actPage, keySort, vArrNotShow)

• vData (requerido): JSON para convertir a tabla
• tableName (requerido): id de la tabla que debe incluirse en el codigo HTML. El metodo drawTable rellena la tabla.
• rows (requerido): cantidad de registros a mostrar por pagina.
• actPage (requerido): pagina actual a mostrar.
• keySort (opcional): nombre del campo a ordenar.
• vArrNotShow (opcional): Array con los nombres de los campos a ocultar. Ejemplo "['Colmuna1', 'Columna4']"

Sobreescrituras permitidas:

• drawTable(vData, tableName, rows, actPage)
• drawTable(vData, tableName, rows, actPage, keySort)
• drawTable(vData, tableName, rows, actPage, keySort, vArrNotShow)

Código:

https://github.com/agustinte/JSonTable 

Testing de aplicaciones - Técnicas de prueba

Una estrategia de prueba del software integra los métodos de diseño de casos de pruebas en una serie de pasos bien planeada que desembocará en la eficaz construcción de la aplicación.

Cualquier estrategia de prueba debe incorporar la planeación de pruebas, el diseño de casos de pruebas, la ejecución de pruebas y la recolección y evaluación de los datos resultantes.

La prueba es un conjunto de actividades que se planean con anticipación y se realizan de manera sistemática. Por lo tanto, se debe definir un conjunto de pasos en que se puedan incluir técnicas y métodos específicos del diseño de casos de prueba.

Podríamos  decir  que  la  prueba  es  un  intento  sistemático  de  “romper”  un  programa  que pensamos que está funcionando bien.

El concepto de prueba incremental se aplica a cómo probamos características del programa.   La   prueba   debería   enfocarse   primero   a   las   partes   más   simples   y   más frecuentemente utilizadas. Solo una vez que estas funcionen correctamente, deberíamos pasar a probar otros componentes.

Algunas consideraciones

• Probar mientras se escribe el código:  cuanto más temprano se encuentra un problema es mejor. 
• Programar “a la defensiva”:  una técnica útil es agregar código para manejar las situaciones “que no pueden ocurrir”. 
• Probar el código en sus límites
• Verificar  los  errores  retornados:  se  deben  controlar  los  códigos  de  error  devueltos  por llamadas  a  funciones,  operaciones  de  entrada/salida,  etc.  

Características de las pruebas

• Las pruebas solo pueden mostrar la presencia de defectos, no su ausencia    
• Las pruebas serán exitosas si detectan errores  
• Las pruebas siempre deben realizarse contra un resultado esperado y los resultados obtenidos se deben revisar minuciosamente     
• La prueba finalizará cuando el proceso establece confianza en que el componente o sistema hace lo que se supone tiene que hacer, ya que nunca se podrá demostrar que un componente o sistema no tiene defectos.

Tipos y estrategias de prueba 

Fase	Tarea	Tipo de Preba	Estrategia de Prueba	Ejecutor
Diseño y desarrollo	Prueba Unitaria	Unitaria	Caja negra Caja Blanca	Desarrollador
Diseño y desarrollo	Prueba periodica	Funcional Regrecion Recupero Seguridad	Normalmente caja negra	Tester
Diseño y desarrollo	Prueba de integracion	Funcional Stress Volumen Performance Regrecion Recupero Seguridad Interfaces con otros sistemas Conversion de datos	Caja Negra	Tester
Aceptcion	Prueba de Aceptacion	Aceptacion del usuario Ambiente e instalacion Stress Volumen Performance Recupero Seguridad Interfaces con otros sistemas	Caja Negra	Usurarios Operaciones Auditoria Seguridad

Estrategia de caja negra 

Las pruebas de caja negra se desentienden completamente del comportamiento y estructura interna  del  programa.  También  son  llamadas  pruebas  conducidas  por  los  datos  o  pruebas conducidas por las entradas/salidas. 

Las condiciones y casos de prueba tendrán variaciones considerando, según corresponda: 

• Partición de equivalencias: debido a que nunca se podrán probar todos los valores posibles de un atributo o campo, se seleccionan conjuntos de valores típicos, tales que cubran  un  extenso  abanico  de  casos  de  prueba.  Estas  pruebas  son  llamadas  por "partición  de  equivalencias”  o  “subdominios”.  La  prueba  se  realiza  tomando,  por ejemplo, un valor válido y dos inválidos del mismo tipo que la clase válida para cada subconjunto. 
• Condiciones de borde: se ingresan valores para los casos extremos, y casos inválidos para los valores siguientes a los extremos. 
• Otros tipos de datos: se prueban ingresos de otros tipos de datos (números en lugar de caracteres  alfabéticos,  fechas  en  lugar  de  números,  etc.).  Muchas  veces  dichas validaciones son resueltas por la herramienta utilizada para el desarrollo. 
• Condiciones cruzadas: por ejemplo, no se pueden cargar los datos del cónyuge si la persona no está casada. La estructura del modelo de datos define también estas reglas cruzadas que deben ser probadas. 
• Conjetura de errores (sospechas): se crean casos de prueba con mayor cantidad de variaciones,   para   componentes   considerados   de   riesgo,   debido   a   complejidad, circunstancias del desarrollo, programas modificados por varias personas, programa armado pegando pedazos de otros, etc. 
• Transición-estado, o causa-efecto: se crean casos de prueba que ejerciten todas las combinaciones  de  acciones  /  cambios  de  estado  causados,  para  los  diagramas  de transición-estado que correspondan a los ciclos de vida de las entidades de interés. 

Estrategia de caja blanca

Se  definen  a  partir  del  conocimiento  de  la  estructura  interna  del programa. También son llamadas pruebas estructurales.  Para analizar la estructura del componente a probar, se representa el flujo de control del mismo a través de un diagrama de flujo. Se determina el conjunto básico de caminos independientes,  y se preparan los casos de pruebas  que forzarán la  ejecución de cada camino.

Debería usarse esta estrategia para componentes críticos y/o sospechosos. Las condiciones y casos de prueba tendrán variaciones considerando:

• Cobertura de sentencias: cada línea de código debe ser ejecutada al menos una vez. 
• Cobertura  de  decisión:  para  cada  decisión  debe  proveerse,  al  menos,  un  resultado verdadero y uno falso. 
• Cobertura de condición: para cada condición en una decisión deben proveerse valores que ejerciten todos los casos posibles, al menos una vez. 
• Cobertura de decisión / condición: combinación de las anteriores, todos los caminos posibles e independientes, según salidas de condiciones y decisiones, eliminando los casos redundantes o no posibles. 

Prueba Unitaria 

Se  realiza  sobre  una  unidad  de  código  claramente  definida,  es  llevada  a  cabo  por  los desarrolladores. Requiere un trabajo complejo y laborioso.   

Prueba Funcional 

Prueba que verifica los requerimientos funcionales del sistema. Comprueba que las partes de un  sistema  que  funcionan  bien  aisladamente  en  la  prueba  unitaria,  también  lo  hacen  en conjunto. 

Prueba de Stress 

Prueba   excediendo   los   límites   de   su   capacidad   de   procesamiento   y   de almacenamiento. Se utiliza cuando hay poco control sobre los usuarios u otros sistemas que interactúan con el nuestro.

Las entradas de datos generados automáticamente exigen a un programa de modo diferente que los datos ingresados por un usuario. 

Pruebas de Volumen y Performance 

Verifican que el sistema soporte los volúmenes máximos definidos en la cuantificación  de  requerimientos  para  la  capacidad  de  procesamiento  y  la  capacidad  de almacenamiento. 

Pruebas de Regresión  

Pruebas  orientadas  a  verificar  que,  luego  de  introducido  un  cambio  en  el  código,  la 

funcionalidad original no ha sido alterada. 

Prueba de Recupero 

Pruebas orientadas a verificar que el sistema se recupera correctamente ante situaciones que 

afectan o suspenden su ejecución (estos casos fueron tratados en la clase anterior). 

Automatización de las pruebas (test automation) 

Probar manualmente un programa es muy tedioso y a veces poco redituable. Un testing apropiado involucra cantidad de pruebas, cantidades de lotes de datos de entrada y muchas comparaciones de resultados. 

La forma más básica de automatización de las pruebas son los tests de regresión.  

Los mismos ejecutan una secuencia de pruebas que comparan la nueva versión de un programa  con  la  anterior.  La  intención  es  comprobar  que  el  comportamiento  no  ha cambiado excepto en las formas esperadas. 

Simple ABM (CRUD) de una tabla con WebMatrix

En el siguiente post se detallara como armar un ABM (pantallas de alta, baja y modificación) de una tabla simple (en este caso la tabla de provincias) utilizando JQuery en la plataforma WebMatrix.
El resultado sera algo como esto:


Vista de datos

Agregar nuevo dato

Modificar Dato

Lo primero que debemos hacer es descargar JQuery UI (en este ejemplo utilizaremos la versión 1.8.4)

Este ejemplo esta armado sobre una tabla de provincias llamada Provincias con  los siguientes campos:

• ProvinciaId
• Nombre

En el HEAD del archivo _SiteLayout.cshtml debemos agregar las siguientes lineas para referenciar a JQuery

<link type="text/css" href="@Href("~/Styles/jquery-ui-1.8.4.custom.css")" rel="stylesheet" />
        <link type="text/css" href="@Href("~/Styles/Site.css")" rel="stylesheet" />
        <script type="text/javascript" src="@Href("~/Scripts/jquery-1.4.2.min.js")"></script>
        <script type="text/javascript" src="@Href("~/Scripts/jquery-ui-1.8.4.custom.min.js")"></script>

Para armar el ABM utilizaremos:

• Una página “maestra” de provincias, que incluirá una vista parcial (partial view) con la grilla de las provincias y un botón para crear un nuevo elemento.
• La vista parcial: es la encargada de leer la tabla de provincias y mostrarla. Además mostrara los links de editar y eliminar.
• Métodos de tratamiento de datos. Son tres páginas CSHTML que solo contienen código para procesar diferentes solicitudes:
• Agregar nievo elemento.
• Modificar un elemento.
• Eliminar un elemento.

Archivos:

Método de alta de provincias AgregarProvincia.cshtml

@{
    bool bOk = true;
    string sError = "";
    var url = Request.Url.ToString();
    if (url.Contains("?Nombre"))
    {
        var db = Database.Open("database");
        string nombre = url.Substring(url.IndexOf('?') + 8);
        if (nombre != "") {
            var provincia = db.QuerySingle("SELECT * FROM Provincias WHERE Nombre like @0", nombre);
            if (provincia == null) {
                db.Execute("INSERT INTO Provincias (Nombre) VALUES (@0)", nombre);
            }
            else {
                bOk = false;
                //sError = "La provincia ya existe.";
                sError = "1";
            }
        }
        else {
            bOk = false;
            sError = "2";
        }
    }
    else {
        bOk = false;
        sError = "2";
    }

}

@if (bOk)
{
    @:<script languaje="JavaScript">location.href='/Administracion/Provincias/ProvinciasJQ.cshtml';</script>
} else if (sError == "1"){
    @:<script languaje="JavaScript">alert("Error: La provincia ya existe." );location.href='/Administracion/Provincias/ProvinciasJQ.cshtml';</script>
} else if (sError == "2") {
    @:<script languaje="JavaScript">alert("Error: Debe ingresar un nombre para la provincia." );location.href='/Administracion/Provincias/ProvinciasJQ.cshtml';</script>
}


Obtiene por parámetro de la url el nombre a insertar y realiza reglas de negocios antes de hacerlo. Si da algún error muestra en alert y vuelve a la página que lo llamo.


Método de edición de provincia EditarProvincia.cshtml

@{
    bool bOk = true;
    string sError = "";
    var url = Request.Url.ToString();
    if (url.Contains("?Nombre"))
    {
        var db = Database.Open("database");
  
        string nombre = Request.QueryString["Nombre"];
        string id = Request.QueryString["Id"];
  
        //nombre = nombre.Substring(0, url.IndexOf('&'));
        if (nombre != "" && id != "") {
            var provincia = db.QuerySingle("SELECT * FROM Provincias WHERE Nombre like @0", nombre);  
            if (provincia == null) {
                db.Execute("UPDATE Provincias SET Nombre = (@0) WHERE ProvinciaId = (@1)", nombre, id);
            }
            else {
                bOk = false;
                //sError = "La provincia ya existe.";
                sError = "1";
            }
        }
        else {
            bOk = false;
            sError = "2";
        }
    }
    else {
        bOk = false;
        sError = "2";
    }

}

@if (bOk)
{
    @:<script languaje="JavaScript">location.href='/Administracion/Provincias/ProvinciasJQ.cshtml';</script>
} else if (sError == "1"){
    @:<script languaje="JavaScript">alert("Error: La provincia ya existe." );location.href='/Administracion/Provincias/ProvinciasJQ.cshtml';</script>
} else if (sError == "2") {
    @:<script languaje="JavaScript">alert("Error: Debe ingresar un nombre para la provincia." );location.href='/Administracion/Provincias/ProvinciasJQ.cshtml';</script>
} 
Obtiene por parámetro de la url el nombre y el id de la provincia a modificar y realiza reglas de negocios antes de hacerlo. Si da algún error muestra en alert y vuelve a la página que lo llamo.


Método de eliminación de provincia EliminarProvincia.cshtml

@{
    // Valida si se tiene que eliminar un registro
    var url = Request.Url.ToString(); 
    if (url.Contains("?Eliminar"))
    {
        var db = Database.Open("database");
        string id = url.Substring(url.IndexOf('?') + 10);
        db.Execute("DELETE FROM Provincias WHERE ProvinciaId = @0", id);     
    } 
}

<script languaje="JavaScript">location.href='/Administracion/Provincias/ProvinciasJQ.cshtml';</script>
Obtiene por parámetro de la url el id de la provincia a eliminar y si existe lo elimina. Luego vuelve a la página que lo llamo.


Partial View ProvinciasGrid.cshtml


@{
    var db = Database.Open("database");
    var selectQueryString = "SELECT * FROM Provincias";
    var data = db.Query(selectQueryString);
    var grid = new WebGrid(source: data,
                           defaultSort: "Nombre",
                           rowsPerPage: 10);
}

<fieldset>
    <legend>Listado de Provincias</legend>
    <div id="grid">
        @grid.GetHtml(tableStyle: "ui-widget ui-widget-content",
                    headerStyle : "ui-widget-header",
            columns: grid.Columns(
                    grid.Column(header: "Accionnes",
                        format:
                        @<text><a href="../../Methods/Provincias/EliminarProvincia.cshtml?Eliminar=@item.ProvinciaId">(Eliminar)</a>
                               <a href="#" onclick="mostrarEdicion('@item.ProvinciaId', '@item.Nombre')">(Editar)</a></text>),
                    grid.Column("ProvinciaId", "Id"),
                    grid.Column("Nombre", "Provincia")
            )
        )
    </div>  
</fieldset>
Básicamente lee todos los registros de la tabla de provincias y los muestra en una grilla. Además agrega dos links. Uno para eliminar, que llama al método EliminarProvincia con un parámetro que es el id de la provincia a eliminar. El otro link es el de editar y llama a una función de javascript que estará en la página principal de las provincias.


Página principal de provincias Provincias.cshtml


@{
    // Set the layout page and page title
    Layout = "~/_SiteLayout.cshtml";
    Page.Title = "Tabla de Provincias";   
}

    <script type="text/javascript">
        $(function() {
            $('#dialog-form').dialog({
                autoOpen : false,
                modal: true,
                height: 160,
        width: 475,
                buttons: {
                    'Agregar' : function(){
                        $.ajax({
                            type: "POST",
                            url: $("#add-book-form").attr('action'),
                            data: $("#add-book-form").serialize(),
                            dataType: "text/plain",
                            success: function(response) {
                                $('#dialog-form').dialog('close');
                                location.href = "../../Methods/Provincias/AgregarProvincia.cshtml?Nombre=" + $("#nombre").val();
                            },
                            error: function(response) {
                                alert(response);
                                $('#dialog-form').dialog('close');
                            }
                        });
                    },
                    Cancelar: function() {
                        $('#dialog-form').dialog('close');
    }
                }
            });
                   
            $('#dialog-form-edit').dialog({
                autoOpen : false,
                modal: true,
                height: 200,
        width: 475,
                buttons: {
                    'Aceptar' : function(){
                        $.ajax({
                            type: "POST",
                            url: $("#add-book-form").attr('action'),
                            data: $("#add-book-form").serialize(),
                            dataType: "text/plain",
                            success: function(response) {
                                $('#dialog-form').dialog('close');
                                location.href = "../../Methods/Provincias/EditarProvincia.cshtml?Nombre=" + $("#nombreEdit").val() + "&Id=" + $("#IdProv").val();
                            },
                            error: function(response) {
                                alert(response);
                                $('#dialog-form-edit').dialog('close');
                            }
                        });
                    },
                    Cancelar: function() {
                        $('#dialog-form-edit').dialog('close');
    }
                }
            });

            $('#nueva-provincia')
                .button().click(function() {
                    $('#dialog-form').dialog('open');
                });              
               
        });
       
        function mostrarEdicion(id, descripcion){
            $('#IdProv').val(id);
            $('#nombreEdit').val(descripcion);
            $('#dialog-form-edit').dialog('open');
        }
       
        </script>
   
    <div id="grid" class="ui-widget">
        @RenderPage("~/Partials/ProvinciasGrid.cshtml")
    </div>
   
    <div id="dialog-form" title="Agregar nueva provincia">
        <div class="row">
            <span class="label"><label for="nombre">Nombre:</label></span>
            <input type="text" name="nombre" id="nombre" size="40" />
        </div>
    </div>

    <div id="dialog-form-edit" title="Editar provincia">
        <div class="row">
            <span class="label"><label for="nombre">ID:</label></span>
            <input type="text" disabled="disabled" name="IdProv" id="IdProv" size="5" />
            <br/>
            <span class="label"><label for="nombre">Nombre:</label></span>
            <input type="text" name="nombreEdit" id="nombreEdit" size="40" />
        </div>
    </div>   
   
    <p><button id="nueva-provincia">Agregar nueva provincia</button></p> 

Esta página cuenta con dos div que serán las pantallas de creación y modificación de datos: dialog form y dialog form edit. Mediante JQuery se arma las respectivas pantallas y las acciones a realizar en cada una. Cada pantalla llamara al método que le corresponda, mencionado anteriormente. 


Espero que sea de ayuda. Cualquier duda pueden comentar y con gusto, si es que puedo, se las aclarare.

Microsoft WebMatrix

WebMatrix es una nueva herramienta de desarrollo web gratuita que hace que sea más fácil crear, personalizar y publicar un sitio web.

En WebMatrix se pueden crear aplicaciones web desde cero utilizando bases de datos y el motor de vista Razor.

Si bien el IDE de la aplicación no se compara con la herramienta Visual Studio, es bastante amigable e intuitivo, sin demasiadas opciones y fácil de usar. Tal vez el punto mas flojo es la falta de intelisence en el sector del código c# dentro de la pagina cshtml.

Lo mas destacado de esta herramienta es que tiene todo lo necesario para desarrollar un sitio, sin requerir grandes recursos:

• Cuenta con IIS para poder correr el sitio.
• Se puede administrar la base de datos.
• Permite la edición de las paginas del sitio.

Recursos Online

La siguiante lista contiene informacion util para programadores sobre la herramienta:

• http://www.asp.net/webmatrix
• http://www.microsoft.com/web/webmatrix 
• http://www.desarrolloweb.com/manuales/manual-microsoft-webmatrix.html

Error al instalar visual studio lightswitch - Silverlight

Microsoft Visual Studio LightSwitch es una herramienta para crear aplicaciones de calidad empresarial-profesional para el escritorio, la web, y la nube. LightSwitch es una nueva adición a la familia de Visual Studio.

Mas adelante iré posteando todo lo relacionado a esta nueva herramienta de Microsoft, por ahora beta...

Pero antes que nada, quiero mostrarles la solución al problema que se me presento al querer instalarla.

Luego de varios pasos de la instalación, surgió un error al querer instalar Silverlight 4. Para solucionar esto hay que desinstalar la versión que tengamos de silverlight e instalar la versión DSK que se encuentra en la carpeta "WCU\Silverlight" del cd de instalación. Luego de esto debemos proceder con la instalación.

Como les comente, mas adelante posteare como trabajar con esta nueva herramienta.

Acceso a datos SQL Express y C#

En el presente post les mostrare como acceder a una base de datos SQL Express (gratuita) mediante una aplicación de Windows con C#.

Pueden descargar la aplicacion desde: http://www.megaupload.com/?d=JHUFC14H

Requisitos de Software:

• Microsoft .NET Framework Redistributable 2.0 (descarga gratuita en
  http://msdn.microsoft.com/netframework/downloads/updates/default.aspx)


• Instalar alguna de las siguientes herramientas de desarrollo con las opciones por
  defecto:
  o Visual C# 2005 Express Edition (descarga gratuita en
  http://msdn.microsoft.com/vstudio/express/visualcsharp/)
  o Visual Basic .NET 2005 Express Edition (descarga gratuita en
  http://msdn.microsoft.com/vstudio/express/vb/)
  o Visual Studio 2005, en cualquiera de sus otras ediciones (Standard,
  Professional o Team System)


• Instalar el motor de base de datos Microsoft SQL Server 2005 Express Edition
  con las opciones por defecto (descarga gratuita en
  http://www.microsoft.com/sql/editions/express). Asegurarse que la instancia
  instalada se encuentre en ejecución (se debe buscar el servicio llamado SQL
  Server (SQLEXPRESS) en la lista de servicios del sistema).

Una vez que tengamos andando SQL Express, hay que correr los scripts "BaseEjemplo.sql" y luego "TablaEjemplo.sql".

En la solucion encontraremos una carpeta llamada "AccesoDatos", en esta carpeta se encuentran las clases "BaseDatos.cs" y "BaseDatosException.cs".
La clase "BaseDatos.cs" contiene todo el manejo de datos, lo cual crea una abstracción la misma.

El formulario Form1 contiene todos los metodos de accesos: alta, modificacion y baja.

La aplicacion de ejemplo esta desarrollada en tres capas:

• Acceso a datos (carpeta AccesoDatos)
  
• Negocios (carpeta )
  
• Presentacion (en este caso se dejo en el directorio principal de la aplicacion, pero se puede armar una carpeta con todos los formularios o incluso un proyecto.)

HP reduce los chips a escala atómica

Hewlett-Packard (HP) anunció avances en el diseño de un nuevo tipo de interruptores que podría reducir los chips a escala atómica, sustituyendo a los transistores actuales, fabricados con materiales semiconductores, y que permitiría fabricar equipos más eficientes y veloces.

Ésto sería posible gracias al memristor o reóstato de memoria, un elemento de circuito pasivo concebido en 1971 por el ingeniero Leon Chua, de la Universidad de California, pero que no fue construído hasta 37 años después. Un hito logrado por científicos de la firma tecnológica HP, que contaron la experiencia a la revista Nature en abril de 2008.

Los instrumentos fueron llamados así por su habilidad de “recordar” el monto de la carga que fluyó a través de ellos una vez que se desconecta la corriente. Esto quiere decir que sirven para construir memoria y capacidad de almacenamiento en los equipos, una aplicación que de acuerdo a Stan Williams, investigador de HP, podría estar en el mercado antes de tres años.

Además, los ‘memristors’ son más simples que los transistores de los semicondutores actuales, pueden almacenar información, incluso sin electricidad y se pueden utilizar tanto para el procesamiento de datos como para aplicaciones de almacenamiento.

Hoy, esas funciones se realizan en dos instrumentos separados, lo que quiere decir que los datos deben ser transferidos entre los dos, haciendo más lento el proceso de cómputo y gastando energía.

“El procesador y la memoria podrían ser exactamente la misma cosa“, le dijo a la BBC Williams. “Eso nos permite pensar distinto acerca de cómo se hace la computación”.

Según el profesor Leon Chua, el primero en proponer los memristores, el trabajo era “conceptualmente, apenas la punta del iceberg”. “En el futuro cercano podremos usar los memristores para fabricar computadoras verdaderamente parecidas a cerebros“, señaló.

Desde que hace dos años se anunciaron los trabajos, el equipo de investigadores de HP fue capaz de incrementar la velocidad de los dispositivos para igualarlos a los transistores de silicio actuales, y probarlos en un laboratorio.

Esto indica que ahora sería posible considerar la existencia de chips basados en ‘memristors’ como una alternativa a las memorias flash basadas en transistores que se utilizan en dispositivos de consumo como reproductores MP3, portátiles o cámaras digitales.

[Fuente: RedUsers]