Mostrando entradas con la etiqueta Software Libre. Mostrar todas las entradas
Mostrando entradas con la etiqueta Software Libre. Mostrar todas las entradas
sábado, 7 de julio de 2018
Plantilla de Onsen UI para Vue CLI
Vue JS 2 ofrece la herramienta de línea de comandos Vue CLI que permite crear la estructura básica de aplicaciones de una sola página (Single Page Applications, o SPA) de forma amigable. Para más detalles sobre la instalación y uso de esta herramienta recomiendo ver los siguientes enlaces:
- Tutorial de Vue.js 2 - 1. Qué es Vue.js y preparación del entorno
- Tutorial de Vue.js 2 - 2. Creación de proyecto desde plantilla
La plantilla que he creado es un fork de la plantilla de Onsen UI para PWA con Webpack, la cual a su vez se basa en la plantilla para PWA de Vue JS. La plantilla de Onsen UI incluye:
- Aplicación básica de ejemplo utilizando Onsen UI.
- Webpack, para empaquetar los componentes del sitio web.
- Recarga en caliente, para actualizar los cambios realizados en el código de forma inmediata en el navegador.
- Verificador de sintaxis (lint).
- Pruebas unitarias y de integración.
- Extracción de CSS.
- Manejo de estados utilizando Vuex.
Adicional a esto, he agregado las siguientes características en mi versión de la plantilla:
- Soporte para TypeScript.
- Uso de Vue Router para el manejo de rutas en aplicaciones de una sola página.
- Integración de Vue Router y el componente Ons Navigator, mediante Vuex, para el cambio de páginas, basado en este ejemplo.
- Axios como cliente HTTP para el consumo de servicios web.
- La aplicación de ejemplo ha sido extendida para mostrar el manejo de rutas y la descarga de datos desde servicio web.
El código fuente de la plantilla está disponible acá: https://github.com/guillegr123/ons-vue-pwa-webpack-full
Para crear una aplicación utilizando la plantilla, basta ejecutar el siguiente comando, y contestar algunas preguntas:
$ vue init guillegr123/ons-vue-pwa-webpack-full mi-app
Luego, para instalar las dependencias:
$ cd mi-app $ npm install
Y finalmente, para ejecutar en modo de desarrollo:
$ npm run dev
Con ello se muestra la siguiente aplicación de ejemplo:
Algunos puntos de interés:
- En el menú lateral existe una sección llamada "internal links", que hace referencia a las páginas dentro de la app. El resto son enlaces externos.
- En la página de "Movies" se descarga un listado de películas desde un servicio web utilizando Axios.
Cualquier comentario/sugerencia con respecto a la plantilla, así como cualquier contribución, es bienvenida.
Saludos.
sábado, 24 de febrero de 2018
Jasonetor - Mi primera extensión para VS Code
¡Saludos! En esta ocasión quería presentarles mi primera extensión para Visual Studio Code, llamada Jasonetor. El nombre suena un poco chistoso, pero se me ocurrió de JSON Editor (JaSONE[ed]itor), pues en efecto la intención es ser un visor y editor de JSON. También viene un poco del nombre Jasonette, que es una herramienta para crear aplicaciones móviles utilizando JSON. Y cabe mencionar que también medio suena a Terminator XD.
¿Qué es Jasonetor?
La idea principal es que Jasonetor llegue a ser un editor amigable de JSON. Sin embargo actualmente se encuentra en pañales (v0.0.2 al momento de escribir esta entrada), por lo que solamente muestra el JSON como una vista de árbol, en la que se puede minimizar o expandir cada nodo, y además resalta nodos al hacer clic izquierdo en ellos. Por otra parte, aún posee dependencias que se descargan desde internet, por lo que no funcionará si no se posee conexión a internet, al menos al iniciar la extensión.
¿Cómo surgió Jasonetor?
Jasonetor surgió de la necesidad de encontrar una mejor forma de editar archivos JSON en mi actual trabajo. Esto se debe a que trabajamos de cuando en cuando con archivos JSON, los cuales se han vuelto bastante extensos. Es por ello que el proceso de edición de estos se ha vuelto sumamente engorroso, lento y propenso a errores. Así que el principal objetivo de Jasonetor es disminuir el tiempo que invertimos y perdemos debido a errores en la edición de estos archivos.
Aunque Jasonetor pretende ser una herramienta para ser utilizada en mi actual trabajo, no está limitado solamente a este, y no forma parte directa de él, ya que es un proyecto que estoy desarrollando en mi tiempo fuera de la oficina. Por eso mismo, Jasonetor ha sido concebido como un proyecto de software libre (open source), cuyo código fuente se encuentra en GitHub, por lo que cualquier apoyo o contribución es bienvenida y muy agradecida.
Inicialmente la idea era hacer una herramienta de edición que mostrara el JSON en una vista de árbol, y lo permitiera editar. Mi elección fue utilizar Electron JS, que es un framework para crear aplicaciones de escritorio nativas utilizando JavaScript, HTML y CSS, y resulta muy natural utilizar estas tecnologías web para graficar JSON de forma fácil y amigable. Cabe mencionar que conocí sobre Electron gracias a Hans Hernández, compañero de trabajo y creador de CatFactory.
Sin embargo, luego pensé que sería mucho mejor si se pudiera editar el JSON no solamente de forma gráfica, sino de forma textual, en dos vistas paralelas, ya que usualmente nos resulta más rápido editar el texto en lugar de mover el ratón para seleccionar los elementos en una vista de árbol. Pero sería demasiado difícil incluir un editor de texto con colorización de sintaxis. Luego recordé que Visual Studio Code ya es un editor que ha sido creado con Electron, y hay una gran cantidad de extensiones de código libre desarrolladas por la comunidad, así que pareció la opción más sensata, en lugar de re-inventar la rueda. Luego de ver los fuentes de ejemplo, más algunas extensiones similares, me animé a intentar crear una extensión por mí mismo.
¿Cómo funciona Jasonetor?
Jasonetor fue creado a partir de la extensión de ejemplo de Hola Mundo, provista en la documentación sobre el desarrollo de extensiones para Visual Studio Code.
Internamente posee un TextDocumentContentProvider, el cuál se utiliza para mostrar el cuerpo de una página HTML en una vista que se abre a la par del editor de texto, al presionar F1 e ingresar el comando JSON editor. Esta parte se basó en:
- Extensión de ejemplo de Microsoft de una vista previa de propiedades CSS.
- La extensión Live HTML Previewer de Harshdeep Gupta.
La página HTML es una pequeña aplicación de Vue JS 2, que utiliza un componente recursivo basado en el ejemplo de Anthony Gore para dibujar el JSON en vista de árbol. Para la selección y de-selección de nodos se utiliza el concepto de bus de eventos, mediante la creación de una instancia adicional de Vue.
Siguientes pasos
De momento no he decidido por completo los pasos a seguir con Jasonetor, pero tratando de ordenar las características cronológicamente según las necesidades que tenemos actualmente, más algunos ítems de la lista de deseos (porque aún no sé hasta donde se pueda llegar :P), creo que serían los siguientes:
- Incluir dependencias dentro del proyecto, para no requerir conexión a Internet.
- Separar los componentes de Vue en archivos propios, y comprimir el código fuente utilizado para dibujar la vista de árbol (creo que lo segundo va a tener que ser realizado como parte de lo primero).
- No actualizar vista de árbol si el JSON no es válido, y notificar de esto al usuario.
- Parsear o mapear el JSON, para poder detectar la ubicación de los cambios que realice el usuario (si no encuentro una librería, voy a tener que buscar mis cuadernos de Teoría Matemática de la Computación y Compiladores).
- Editar el JSON en la vista de árbol, y actualizar el texto en el editor.
- Desplazar la vista de árbol de forma paralela a la edición de código.
- Actualizar la vista de árbol de forma parcial, solamente con los cambios detectados.
- Soporte para búsqueda mediante JSON Path.
- Soporte para XML, YAML y otros lenguajes de metadatos (se vale soñar).
domingo, 5 de noviembre de 2017
Importar datos desde Excel en C#
Este es un requerimiento con el que muchas veces nos encontramos: ¿Cómo leer datos desde una hoja de cálculo de Microsoft Excel (o similares), utilizando C#? Bueno, existen muchas herramientas y técnicas en el salvaje internet para leer archivos de Excel, desde utilizar las librerías de objetos para interoperabilidad provistas al instalar Excel, utilizar un proveedor OleDB, hasta crear tu propia librería para manipular los archivos de Excel, que después de todo, solo son conjuntos de archivos XML comprimidos con una extensión especial (al menos desde Office 2007).
Sin embargo, mi forma preferida de hacerlo desde hace un par de años, ha sido utilizar la librería EPPlus, que es una librería de código abierto creada por Jan Källman, que provee una API amigable y avanzada para la manipulación de archivos con el formato Office Open XML. Esta librería, publicada bajo la licencia GNU Lesser General Public License, provee funcionalidades que van desde acceder a las celdas de las hojas de cálculo, hasta crear gráficos y tablas dinámicas, así como protección y encriptación de documentos.
EPPlus no necesita librerías de interoperabilidad, ni posee otras dependencias aparte del .NET Framework. Esto permite distribuir la librería como parte de nuestro proyecto, sin requerir la instalación de componentes de terceros. Y lo mejor de todo: está disponible como un paquete de NuGet. Gracias a ello, solo basta con buscar el paquete EPPlus desde el administrador de paquetes de NuGet de Visual Studio, e instalarlo en nuestro proyecto, para hace uso de la librería.
Supongamos por ejemplo que se desea leer un archivo de Excel que contiene en la primera hoja un listado de productos, con los datos Código, Nombre y Precio en las columnas A, B y C, respectivamente. Por simplicidad, asumiremos que todos los productos poseen todos los datos, y que finalizaremos la lectura al alcanzar la primera fila cuyo valor en la columna A esté en blanco. También tendremos en consideración que la primera fila de la hoja posee los encabezados de las columnas. Tendríamos algo así:
Nuestro objetivo será hacer una aplicación de consola sencilla, que lea el listado de productos, y los muestre en la línea de comandos. Para ello, creamos una nueva aplicación de consola de .NET Framework, desde Visual Studio, e instalamos el paquete EPPlus:
Luego, importamos el espacio de nombres OfficeOpenXml, provisto por el paquete EPPlus para el acceso a los archivos de Excel, y System.IO, para la lectura de archivos desde el disco duro. Luego, se procede a escribir el código en el método Main de la clase Program. A continuación se muestra el código fuente final, en el que se explica paso a paso a través de los comentarios el proceso para la lectura del archivo:
El resultado de ejecutar el programa anterior, con el archivo de Excel mostrado, es el siguiente:
Cabe mencionar que el archivo de Excel no debe estar abierto, para poder ser leído. De lo contrario, la aplicación lanzará una excepción al intentarlo leer.
Espero que este ejemplo les haya sido de utilidad, y que se animen a utilizar EPPlus como una alternativa para la manipulación de hojas de cálculo. Que tengan un feliz día.
sábado, 12 de agosto de 2017
Sobreviviendo a un OS descontinuado - Apricity OS
Saludos a todos, ya tenía un largo tiempo de no escribir en el blog, debido a algunos proyectos que han consumido demasiada parte de mi tiempo libre :(
Precisamente debido a esto, ya que los proyectos habían sido desarrollados en en Windows (Visual Studio, .NET, y todas esas cosas del imperio), ya tenía un largo rato de no utilizar el sistema Linux que también tengo instalado en mi computadora personal. Pues bien, esta mañana finalmente encendí mi computadora e ingresé a mi muy apreciada instalación de Apricity OS, y como primera tarea decidí que quería hacer funcionar el administrador de fondos de escritorio que tengo instalado, llamado Variety, ya que la ultima vez que entré al sistema habia notado que este había dejado de funcionar y que no podría ser iniciado. Intente ejecutarlo desde la línea de comandos, para obtener más información acerca del posible error, y vi un mensaje que me indicaba que la razón por la cual no estaba funcionando era que la versión de Variety que tenía instalada era antigua, y que debía actualizar a la versión más reciente. Yo le temo a las actualizaciones, pues tienden a romper cosas, en Windows y Linux, pero bueno, era solo un paquete, así que procedí a la actualización usando la confiable herramienta pacman.
sudo pacman -S variety
Pero tristemente no se pudo, ya que en su lugar me apareció el siguiente mensaje:
Siendo un noob en Linux, y en particular en Arch, me puse a investigar en google, y de lo que logré encontrar, decidí que tal vez necesitaba actualizar las bases de datos de los repositorios, así que intenté eso:
sudo pacman -Syy
Y luego me apareció un mensaje más claro:
Falló la descarga del archivo 'apricity-core.db' desde static.aprictyoscom : Falló la conexión a static.apricityoscom puerto 80: Conexión rechazada
La triste sorpresa
Mmm, ¿será tal vez que el servidor no está disponible?¿Habrá algún espejo para poder usar?
¿Será que iban a hacer mantenimiento de sus servidores este día?
Bueno, a googlear para buscar alguna noticia. Y allí fue cuando, para mi sorpresa, me dí cuenta de la triste noticia: Apricity OS ha sido descontinuado, desde el 6 de mayo del presente 2017. Ingresando a su página de Github, se puede ver el siguiente mensaje:
¿Apricity OS?
La noticia es triste para mí, ya que Apricity OS había sido mi versión favorita de Linux, desde que empecé a ocupar Linux. Apricity OS era una distro basada en Arch Linux, que intentaba ofrecer lo mejor de este sistema operativo de un forma amigable y sencilla. Entre las cosas buenas que tenía era que oseía un instalador gráfico para facilitar la instalación y actualización de paquetes. También compartía el modelo de actualización de liberación continua de Arch, lo que permitía actualizar el sistema sin tener que instalarlo desde cero nuevamente cada vez que hubiera una nueva versión. Otra característica interesante es que incluía ICE, que es una aplicación que permite utilizar auna aplicación web como si fuera una aplicación de escritorio normal. También poseía una interfaz con un diseño limpio y moderno utilizando Gnome 3.
¿Y ahora qué?
La verdad es que a mí me encanta este sistema operativo, sigue siendo el que más me ha gustado, y considero que siendo basado en Arch, aún puedo continuar utilizándolo, ya que buena parte de los paquetes provienen de ese entorno. Bajo esta premisa, mi siguiente paso fue desactivar el repositorio de Apricity OS de la configuración de pacman. Para ello abrí el archivo /etc/pacman.conf en un editor de texto con el usuario administrador (en mi caso utilicé el comando gksudo geany /etc/pacman.conf para ello). Luego marqué como comentarios las siguientes líneas:[apricity-core] SigLevel = Required Server = http://static.apricityos.com/apricity-core-signed/
Así:
#[apricity-core] #SigLevel = Required #Server = http://static.apricityos.com/apricity-core-signed/
Con ello pacman ignora el repositorio de Apricity OS, lo cual evita que se produzca el fallo debido a que no puede descargar su base de datos. Hecho esto ya pude actualizar el paquete que necesitaba.
Conclusiones finales
Es una triste noticia que un sistema operativo tan eficiente, elegante y amigable haya llegado a su fin, en un tiempo tan corto (creo que fue un poco más de un año el tiempo que el proyecto estuvo disponible), pero así es el mundo del software libre, ya que se depende del trabajo voluntario de comunidades de desarrolladores que buscan ofrecer piezas de software increíbles sin esperar nada a cambio. "Por amor al arte", como dicen. Solo nos queda agradecer a estas personas por la maravillosa experiencia que nos ofrecieron al traer al mundo a Apricity OS, y también nos deja la motivación para que nosotros nos animemos a integrarnos a alguna de estas apreciables comunidades.Saludos, y hasta la próxima.
