Más allá de lo que ves

martes, 10 de abril de 2018

Git ¿Como clonar carpetas concretas?

Te ha pasado que accedes a un repositorio en github donde hay un ejemplo de lo que andas buscando pero resulta que en el repositorio hay volcadas muchas carpetas de diferentes proyectos pero que a ti tan solo te interesan algunas de ellas? Si es así Sparse Checkout es tu opción en git.

Esta característica te permitirá clonar solo aquellas carpetas que te puedan interesar del repositorio.
Vamos a verlo con un sencillo ejemplo. Supongamos que del siguiente repositorio en github https://github.com/fjmontesinos/jhipster.git tan solo deseas clonar la carpeta prueba-sparse-checkout que como puedes comprobar tan solo tiene un fichero de texto sin código alguno a modo de prueba.

Tan solo debes seguir los siguientes sencillos pasos:

  1. Crea un carpeta y accede a ella.
$ mkdir miproyecto
$ cd miproyecto
  1. Inicializa un repositorio git en la carpeta.

$ git init

  1. Activa sparse-checkout en el repositorio.

$ git config core.sparsecheckout true

  1. Indícale a git la carpeta o carpetas que desas clonar de forma exclusiva, para el caso del ejemplo: prueba-sparse-checkout

$ echo prueba-sparse-checkout >> .git/info/sparse-checkout

  1. Añade el repositorio remoto a git

$ git remote -f origin https://github.com/fjmontesinos/jhipster.git

  1. Haz un pull del proyecto y ejecuta un ls, comprobarás que tan solo se ha clonado la carpeta indicada

$ git pull origin master
$ ls -la
total 16
drwxrwxr-x 4 javiermontesinos javiermontesinos 4096 abr 10 05:49 .
drwxrwxr-x 8 javiermontesinos javiermontesinos 4096 abr 10 05:59 ..
drwxrwxr-x 8 javiermontesinos javiermontesinos 4096 abr 10 05:49 .git
drwxrwxr-x 2 javiermontesinos javiermontesinos 4096 abr 10 05:49 prueba-sparce-checkout

domingo, 26 de marzo de 2017

Debug Angular 2 Visual Studio Code

Finalizado el Quickstart de Angular 2 utilizando Vistual Studio Code, lo siguiente que me he planteado es ¿como puedo hacer debug de la aplicación que he "creado"?

En la propia página de Visual Studio Code se puede encontrar información detallada de como configurar/ejecutar este debug Debugging Visual Studio Code. Para ello es necesario instalar la extensión Debugger for Chrome de Visual Studio Code.

Una vez tengas instalada la extensión y hayas reiniciado el editor, siguiendo los pasos que se indican en la página de la extensión verás como añadir al fichero launch.json la configuración necesaria.

Puedes definir dos formas de ejecutar tu Debug en Chrome: launch y attach, la primera te lanzará una nueva instancia de Chrome y la segunda correrá sobre la que puedas tener abierta. Por simplicidad he optado por la primera.

Breakpoint ignored because generated code not found (source map problem?)


Si ya funciona tu debug en Chrome pero los puntos de interrupción no se alcanzan en la ejecución y cuando pones un punto de interrupción en tu código Typescript te aparece un mensaje del tipo: Breakpoint ignored because generated code not found (source map problem?)  tan solo debes tener en cuenta que debes configurar correctamente el launch del Debugger en Chrome.

En mi caso tan solo ha sido necesario configurar correctamente el atributo webRoot haciendo que apunte al root de los ficheros de la aplicación. webRoot apunta a la carpeta raíz del proyecto y mis ficheros están en la carpeta src/app así pues tan solo he tenido que configurar este atributo correctamente y el debug ha funcionado sin problemas como podéis ver en la captura:

"webRoot": "${workspaceRoot}/src/app"


Ejemplo del código de mi fichero launch.json:

    "version": "0.2.0",
    "configurations": [
        {
            "type": "chrome",
            "request": "launch",
            "name": "Debug en Chrome",
            "url": "http://localhost:3000",
            "webRoot": "${workspaceRoot}/src/app"
        }
    ]

domingo, 5 de marzo de 2017

QuickStar de Angular 2 con Visual Studio Code

Ya acostumbrado al uso de Sublime Text e intentando aprender Angular 2 me he topado con Visual Studio Code un editor de Microsoft que es open source y multiplataforma. Sí, has leído bien, de Microsoft, open source y multiplataforma.

Lo he utilizado para seguir el QuickStart de Angular 2 y la impresión que me ha causado el editor es buenísima!!!! (la impresión que me ha causado angular es objeto de otra entrada, Maravilloso!!!!) Visual Studio Code es rápido, flexible con extensiones, intellisense, debug, git integrado, consola... Todo el fuente que he ido generando lo puedes consultar en Github

He realizado la instalación sobre elementary OS, sistema operativo basado en linux, pero lo puedes descargar también para Mac y como no para Windows. Desde consola lo puedes lanzar con: $ code fichero.txt

Puedes descargarlo en este enlace; Descargar Visual Studio Code

En este enlace puedes consultar la multitud de extensiones disponibles para personalizarlo, Extensiones Visual Studio Code.



viernes, 3 de marzo de 2017

Plunker - Crea, comparte y colabora tus ideas para desarrollos web

Cuanto tiempo sin escribir en el blog, voy a poner una entrada corta sobre una plataforma que me ha parecido simplemente mágica.

Tienes un ejemplo de código que quieres compartir en tu blog y te gustaría poder mostrar en la propia entrada todo el código en acción, para que tus lectores puedan tanto leer y modificar el código como ver el resultado ejecutado? Plunker te ofrece una forma sencilla de realizar esto de forma que utilizando la opción embebida de el plunker concreto que hayas creado podrás incluirlo en tu blog utilizando un simple iframe.

En esta entrada he incluido un sencillo ejemplo para que podéis comprobar lo que os comento. En este caso he utilizado una plantilla ya existente en Plunker para probar su uso.

Ejemplo en accción:
 

viernes, 16 de octubre de 2015

Thunderbird - Emojis en tus correos

¿Quieres añadir a tus correos en Thunderbird Emojis (emoticons de WhatsApp por ejemplo)? Con el plugin Emoji Menu de Thunderbird podrás hacerlo de forma muy sencilla.

Añade el plugin a tu Thunderbird y podrás incluir emojis en tus correos como se muestra en la siguiente imagen. Sencillo ¿no?