supr159

Hace tiempo de mi última publicación y para no perder la costumbre y la inteligencia colectiva, hoy les traigo otro post con un proyecto propido que aún sigue en construcción. Aquí les dejo una captura para los quieren saltarse la lectura y al final un resumen level 5: El proyecto es una página para compartir textos cortos e imagenes y en un futuro, posts complejos. También hay un buscador de usuarios. Hay una funcionalidad de seguidor/seguidores y los usuarios también pueden agregar comentarios y reacciones. Como resumen y para los que les interesa saber que utilicé para construir el sitio aquí les dejo una lista: El sitio está construido con Ruby on Rails; y otros , slim, webpacker, typescript , stimulusjs. Seguramente algunos pensarán que solo es un sitio más (y si que lo es) pero tiene algo en particular y es lo siguiente: El código del sitio es open source, eso quiere decir que si alguien quiere ver, copiar o modificar algo, lo puede hacer sin problemas. Y para aquellos que se están iniciando en esto de la programación les puede resultar útil como ejemplo e incluso como práctica si alguno quiere contribuir (aquí un link de ayuda). Aquí el link del código. Saludos y como siempre los comentarios son bienvenidos. RESUMEN LEVEL 5: Hice un sitio con código fuente open source para fomentar la inteligencia colectiva.

Linces, hoy les voy a enseñar a crear una extensión para Chrome muy básica pero que a mi me ayuda a ver post de imágenes de manera más fácil, sin tener que scrollear, casi al estilo Facebook. Aquí les dejo una probadita del visor de imágenes que crearemos al terminar este post. Y aquí otra con Sansa Como necesitaba una asistente, pasé un buen rato buscando a alguien y al final me he decidido por nada más y nada menos que Barbara Palvin. También puedes usar el mismo post o busca otro con imágenes . Antes de comenzar les recomiendo tener un poco de conocimientos de Javascript(JQuery), CSS, HTML, Atom y la Terminal o CMD de Windows. El tutorial no es muy complejo y en cada paso incluyo una imagen o gif de como se realiza el procedimiento, pero, si aún así se atoran en algún punto, siempre pueden acudir a la vieja confiable, Google. Ahora si, empecemos. 1. Abre la consola o CMD de Windows y cambia de directorio hasta una carpeta donde se colocará la extensión y luego dentro crea una nueva carpeta que se llame taringa-tools o como más te agrade. 2. Abre Atom usando el siguiente comando y dentro verás una carpeta con el mismo nombre. 3. Crea un nuevo archivo y llamalo manifest.json, luego agrega el código que se muestra en la imagen. 4. Busca un icono en internet, llamalo icon.png y agregalo en la carpeta de trabajo, luego crea un nuevo archivo que se llame popup.html y agrega el código que se muestra en la siguiente imagen. 5. Ahora ya podemos cargar nuestra extensión en Chrome, la siguiente imagen muestra la forma de como hacerlo. 6. Si todo salió bien en el paso anterior notarás que se muestra el icono de nuestra extensión en Chrome, pero aún no hace nada útil. Así que eso es lo siguiente que vamos a hacer. Modifica el archivo manifest.json como se ve en la siguiente imagen. 7. Esta nueva parte inyecta el archivo content.js cuando accedemos a la página que nosotros queramos, en este caso http://www.taringa.net/*. La estrella, en términos simples significa que Chrome inyectará nuestro archivo content.js en cualquier página que inicie con una URL de taringa. Ahora crea un nuevo archivo que se llame content.js y agrega el siguiente código. 8. Esta línea es para verificar que todo funcione antes de continuar. La siguiente imagen te muestra como recargar la extensión para ver la alerta en el navegador. 9. Si viste la alerta podemos continuar. Ahora necesitamos descargar unas librerías que nos ayudarán. Primero descarga  JQuery , después  Viewer  y luego agrega los archivos a la carpeta de trabajo y actualiza el archivo manifest.json como se muestra en la siguiente imagen. 10. Bien, ahora de acuerdo con la documentación de Viewer, necesitamos una clase para agregar el visor. 11. En la siguiente imagen se puede ver que etiqueta utilizaremos para agregar el visor. En pocas palabras todas las imágenes que estén dentro de la etiqueta con la clase main-content-post (el cuerpo del post) serán usadas para el visor. 12. Ahora que ya sabemos en que clase colocar el visor, ya podemos actualizar el archivo content.js como se muestra en la imagen. 13. Ahora si actualizamos el navegador y la extensión, podremos ver que el visor funciona pero no se muestra correctamente. 14. En estas dos imágenes puedes ver la direferencia. La primera muestra lo que tenemos hasta ahora y la segunda como se debería ver. 15. Para corregir este error tenemos que crear un nuevo archivo que se llame content.css y también necesitamos actualizar el archivo manifest.json. 16. En el nuevo archivo content.css agrega el siguiente código. Las clases css corrigen los estilos para que el visor se muestre correctamente.  17. Al fin, ya podemos actualizar todo por última vez y ahora todo se debería mostrar correctamente. Bueno linces, así es como nuestra extensión queda terminada y ahora podemos ver los posts de imágenes con zoom y con teclas para avanzar y retroceder y sin tener que hacer scroll. Y ya para terminar el último paso sería publicarlo en Chrome Store pero eso ya es otro asunto. Gracias por visitar mi post y si alguien quiere el código o la extensión comenten y lo subiré sin problema.  PD. Es mucho más fácil poder ver a Barbara con el visor y además le puedes hacer zoom .

Al terminar este post conocerán el proceso de como instalar Docker en una compuratora con sistemas operativo Linux basados en Ubuntu. Aquí hay una lista de requirimentos antes de empezar: - Tener una computadora con Linux basado en Ubuntu. - Tener privilegios de administrador. - Mucha paciencia. Un poco de teoría que nadie lee pero solo por sí acaso... En resumen "Docker es una herramienta que ayuda a empaquetar, distribuir y ejecutar aplicaciones dentro de contenedores". Si señores, eso es Docker. Ahora a más detalle; Docker tiene el mismo propósito que una máquina virtual (VM). Aislar una aplicación y sus dependencias dentro de un contenedor para que pueda ser ejecutado donde sea (ejem. Ejecutar Linux en una maquina virtual sin interferir en el sistema operativo huésped). Ambos tienen el mismo propósito pero su funcionamiento es diferente. Y claro las ventajas y desventajas que eso conlleva. En el caso de las máquinas virtuales, son emulaciones de una computadora real que se ejecutan sobre una computadora física (ejem. Uno de los más populares VirtualBox). Como pueden observar en la siguiente imagen una VM tiene su propio hardware virtual, sistema operativo y espacio para cada VM nueva. En contraste con Docker, este proveé una capa de abstracción en el espacio de usuarios a nivel de sistema operativo. Esto quiere decir que un contenedor comparte el mismo kernel con el sistema operativo de la computadora física tal como se puede observar en la siguiente imagen: ¿Entonces porqué Docker? Bueno, paar empezar es fácil de usar. Es mucho, mucho más rápido que una VM. Existe DockerHub donde hay cientos y cientos de imagenes de todo tipo de software listo para usarse. Funciona bajo el principio de modulos (puedes combinar contenedores como piezas de Lego) y puede ser escalado con facilidad. Hasta aquí esta corta introducción para Docker, pero si quieren aprender más sobre el tema entonces les recomiendo este artículo (en inglés). Basta de palabrería... ¿Cómo de#"#$%&/$ instalo Docker? 1. Para empezar debemos remover Docker ya que hay algunas distribuciones que ya vienen con Docker instalado por defecto así que no está demás actualizar a la versión más reciente: $ sudo apt-get remove docker docker-engine docker.io Para los que no tienen ninguna versión instalada, el comando anterior dirá que el paquete no se encuentra, es normal. 2. Ahora es momento de actualizar: $ sudo apt-get update 3. Y para los que tienen un sistema operativo en la versión Trusty 14.04 o anterior es necesario ejecutar el siguiente comando: $ sudo apt-get install      linux-image-extra-$(uname -r)      linux-image-extra-virtual Para los que tienen 16.04 o mayor no es necesario ya que el paquete viene instalado por defecto. 4. Actualizamos nuevamente: $ sudo apt-get update 5. También es necesario instalar unos paquetes adicionales para usar repositorios sobre HTTPS, entonces para ello ejecutamos el siguiente comando: $ sudo apt-get install      apt-transport-https      ca-certificates      curl      software-properties-common 6. Y luego agregamos la llave GPG oficial de Docker: $ curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo apt-key add - Al terminar debemos verificar la autenticidad de la llave que debe ser igual a esta: 9DC8 5822 9FC7 DD38 854A E2D8 8D81 803C 0EBF CD88 Entonces ejecutamos lo siguiente y comparamos ambos valores: $ sudo apt-key fingerprint 0EBFCD88 pub   4096R/0EBFCD88 2017-02-22       Key fingerprint = 9DC8 5822 9FC7 DD38 854A  E2D8 8D81 803C 0EBF CD88 uid                  Docker Release (CE deb) < [email protected] > sub   4096R/F273FCD8 2017-02-22 7. Ahora que sabemos que la llave es la oficial es momento de agregar el repositorio estable. El siguiente comando obtiene automaticamente el nombre código de la versión de ubuntu en la que esté basado su sitema operativo (ejem. Trusty, Xenial, etc.) y lo utiliza para agregar la versión adecuada de Docker. En algunos casos puede que no funcione automaticamente y si esto pasa lo que deben hacer es sustituir $(lsb_release -cs) manualmente por el nombre código de su sistema operativo. $ sudo add-apt-repository     "deb [arch=amd64] https://download.docker.com/linux/ubuntu     $(lsb_release -cs)     stable" Ese fue mi caso así que tuve que agregar el nombre manualmente de la siguiente manera: $ sudo add-apt-repository         "deb [arch=amd64] https://download.docker.com/linux/ubuntu         xenial         stable" 8. Ahora volvemos a actualizar $ sudo apt-get update 9. Y si todo salío bien ya podemos instalar Docker $ sudo apt-get install docker-ce Genial no tuve un solo error. ¿Ahora qué? Ahora necesitamos verificar la instalación. 1. Así que iniciamos un contenedor de prueba con el siguiente comando: $ sudo docker run hello-world Y les debe mostrar un texto como se muestra en la siguiente captura: Si tienen el mismo resultado entonces Docker ya quedó instalado. (Opcional) Post instalación Antes de continuar con este paso debes saber que es bajo tu propio riesgo y no es recomendado en ambientes donde la información es sensible. Para ejecutar Docker siempre se debe usar sudo lo cual puede ser un poco tedioso. La manera de sobrellevar esto es agregar nuestro usuario al grupo de Docker que por defecto tiene privilegios root. 1. Así que primero creamos el grupo $ sudo groupadd docker 2. Luego agregamos nuestro usuario al grupo $ sudo usermod -aG docker $USER 3. Cerramos e iniciamos sesión para aplicar los cambios. 4. Y ahora verificamos que podemos ejecutar un comando de Docker sin sudo. $ docker run hello-world Al fin... Y eso es todo. Ahora tienen Docker funcionando en su computadora. Si tienen algún problema pueden recurrir a la documentación oficial (en inglés) que voy a dejar como fuente de información ó pueden agregar comentarios y responderé tan rápido como pueda. Saludos