Control de Versiones Git y Github (I)

Cuando nos encontramos desarrollando un proyecto nosotros tenemos una Versión, este es el estado en el que se encuentra el proyecto en un momento concreto. Un buen desarrollo de un proyecto debe poder recuperar versiones que hemos guardado anteriormente, para así poder prevenir errores futuros o permitirnos regresar a versiones anteriores. Con el Control de Versiones nosotros vamos registrando los cambios que hemos realizado en el proyecto. Sistemas de Control de Versiones estos son programas que nos facilitan esa gestión de versiones encargándose de administrar esas versiones. En el mundo de la informática se ha expandido mucho, pero también es aplicable a cualquier otra tarea.

Existen muchos sistemas de control de versiones entre los más conocidos tenemos a: CVS, Mercurial, Git. Aquí hablaré de Git el sistema de control de versiones distribuido. Aunque todos estos sistemas tienen una serie de características en común:

• Modos de almacenamiento de la información: archivos de texto, documentación...
• Posibilidad de cambios: añadir, borrar, renombrar...
• Registro Histórico.
• Crear Informes.

Existen dos tipos de control de versiones:

• Centralizados: tienen un repositorio centralizado de todo el código con un único administrador, esto facilita mucho las tareas administrativas pero reduce mucho la flexibilidad, ya que todas las decisiones importantes necesitan la aprobación del responsable. De este tipo sería: CVS.
• Distribuidos: en estos cada usuario tiene su propio repositorio, no es necesario tomar decisiones centralizadas, ya que los distintos repositorios pueden intercambiar y mezclar revisiones entre ellos. De este tipo es: Git.

Git fue diseñado especialmente por Linus Tolvarlds que buscó la eficiencia y la confiabilidad del mantenimiento de versiones de aplicaciones. Este sistema convierte cada uno de los clientes, cada uno de los ordenadores que esta participando en el proyecto en un auténtico espejo o mirror, que guarda todo el repositorio. Así que si cualquiera de los repositorios que forma parte del proyecto muere, estos sistemas que están colaborando entre ellos, nos pueden devolver la información. Su principal motivo radica, en que permite crear diferentes grupos de personas, trabajando de diferentes modos pero respetando la coordinación y siguiendo el trabajo de modo simultáneo. Git almacena y trata la información de una forma muy diferente al resto de sistemas centralizados, este crea panorámicas completas y no solo las diferencias entre versiones. Para explicarlo, Git piensa en los datos como fotos fijas de un mini sistema de archivos, dado que cuando salvemos un estado del proyecto en Git, este básicamente lo que hace es una imagen fija de como se ve todos los archivos del proyecto en ese momento y almacena una referencia a esa imagen.

Github es un servicio de hosting basado en la web para proyectos de desarrollo de software que utliza Git como sistema de control de versiones. Servicio en la nube, completamente integrado con Git, sin embargo, no es esta su única cualidad sino, además nos permite tener: cualidades de redes sociales como feeds, seguidores. También, información estadística y gráfica del proyecto.

¿Alguien no conoce Sublime Text?

Hoy en día si tenemos un poco de curiosidad por los distintos editores de código que existen, es difícil no encontrarse con Sublime Text, y no porque de una moda se tratase. Dado que en un par de horas podemos aprender multitud de sus funciones de un modo que no tenemos que ser profesionales, nos vale con tener algo de interés. Bien, pero: ¿Qué es Sublime Text?

Es un editor de texto y editor de código escrito en C++ y Phyton para los plugins. Su interfaz y menús son estándares por tanto no nos va a causar una gran impresión. Pero su facilidad de uso es sorprendente.

Una vez que lo instalamos y lo ejecutamos nos encontraremos con un una pantalla oscura donde si empezamos a escribir, estaríamos escribiendo en lo que se conoce como Plain Text esto lo podemos ver en la esquine inferior derecha. Si nos dirigimos a dicha zona y clickamos aparecen los lenguajes en los cuales podemos escribir nuestro código, muchísimos. Definiendo uno de ellos, el editor nos sangra nuestro código y distingue con colores las etiquetas, variables, funciones... Haciendo que el código quede mas estético. En la imagen de abajo podemos ver como es visualmente este editor y voy a comentar unas pocas de sus cualidades:

1. Pestaña donde encontramos los códigos.
2. Minimapa: es una previsualización de la estructura del código, resulta bastante útil para cuando trabajamos con códigos muy largos y poder movernos con soltura.
3. Multi Cursor: podemos crear multitud de cursores manteniendo pulsado Ctrl+cursor así podemos modificar al mismo tiempo diferentes líneas de código. Además con Ctrl+más y Ctrl+menos podemos aumentar o reducir el tamaño del código.
4. Open Files: esta ventana es opcional pero resulta verdaderamente útil cuando pretendemos movernos por diferentes tipos de código que se encuentren en carpetas diferentes. Para tenerla debemos ir a: View-->Side Bar-->Show Open Files.

Además tenemos otros modos, por ejemplo:

• El modo libre de distracciones pulsando Shift+F11.
• En Tools-->Snippets, tendremos todos los snippets que pertenecerían al código que nosotros tenemos el cursor colocado. Esto es muy útil cuando utilizamos el modo tagTigger en el cual por ejemplo, si definimos en Plain Text, código HTML y escribimos en la primera línea html y pulsamos tabulador nos escribe la estructura del código HTML.

¿Qué son las Cookies?

Todo el mundo tiene la incómoda situación de entrar en una página web y que nos salte el mensaje, para aceptar las cookies. Pero sabemos lo qué son realmente estos elementos, muchos seguro que los aceptaremos sin percatarnos ni siquiera de informarnos lo más mínimo, pero no estemos en continua lucha contra ellas, las cookies son sólo datos, y por tanto no pueden hacer nada contra nuestro pc.

Las cookies son datos, que se guardan en pequeños archivos de texto, en nuestro pc. Estas surgieron para paliar el problema sobre como recordar la información sobre un usuario. Dado que cuando un servidor web enviaba una página web a nuestro navegador, la conexión se cerraba, y el servidor olvidaba todo sobre el usuario. Por tanto su propósito es permitir que se almacene nuestra información en una página web, en estos casos:

• Cuando un usuario visita una página web, su nombre puede ser guardado en una cookie.
• La próxima vez que el usuario visite la página, la cookie va a recordar su nombre.
• Se pueden utilizar, para realizar seguimientos de usuarios a lo largo de un sitio web. Este seguimiento se utiliza para mantener unas estadísticas de uso.

Para entender su funcionamiento debemos conocer como se almacenan. Las cookies se guardan en nombre-valor:

1. username:Aprendiz Cookie;
2. document.cookie=

   username=Aprendiz Cookie;expires=Thu, 28 Dec 2014 12:00:00 UTC

   ;
3. document.cookie=

   username =;expires=Thu, 01 Jan 1970 00:00:00 UTC

   ;

Para resumir en el primer caso tenemos como se escribiría en nombre-valor, en el segundo podría ser un código de una cookie normal y por último, en el tercer punto podemos utilizar este código para eliminar una cookie, donde tenemos que tener en cuenta que para eliminarla el campo de username debe estar vacío. Debido a que si tú creas una nueva cookie, las viejas cookies no se sobreescriben, estas se añaden a document.cookie.

Perdiendo el miedo a la Consola de Windows.

Hoy en día, trabajar utilizando la consola de un ordenador se esta quedando cada vez más en desuso, desde que se implantaron las interfaces y el ratón, nos encontramos más cómodo "clikando" por las diferentes partes de la pantalla. Y no es que este mal esto, pero sí por lo menos cambiar nuestra opinión sobre la utilización de una consola (en este caso de Windows), para que deje esa impresión de ser un mundo oscuro, oscuro como su color de fondo. Por tanto, vamos a conocer algunos comandos básicos.

Comandos básicos:

• dir --> Directory, abre el directorio, por así decirlo nos muestra en consola los diferentes archivos que tiene dentro el directorio donde nos encontramos.
• dir /oe --> modifica la lista de archivos y los ordena en función de su extensión.
• dir /od --> modifica la lista de archivos y los ordena en función de la fecha.
• dir /s --> muestra los archivos del directorio especificado y todos sus subdirectorios.
•  cd [nombre] --> permite cambiar de un directorio a otro, por ejemplo podemos utilizar cd desktop para ir al escritorio.
• cd.. --> subimos al directorio del que hemos venido.
• cd/ --> vamos hasta el disco duro por ejemplo C:\
• mkdir [nombre] --> crea un directorio nuevo.
• rmdir [nombre] --> remueve o borra el directorio.
• tree --> árbol de carpetas y subcarpetas.
• tree /f [carpeta]
• type <nombre.txt> --> nos abre el archivo .txt que le especifiquemos.
• print <fichero> --> imprime el archivo de texto.
• rename <nombre-actual> <nombre-nuevo> --> cambia el nombre de un fichero.
• del <archivo> --> borra uno o varios archivos.
• del /p <archivo> --> pide confirmación antes de eliminar cada archivo.
• del /f <archivo> --> fuerza la eliminación de los archivos de sólo lectura.
• edit <archivo (solo texto)> --> se nos abre el editor de texto del MSDOS con el archivo fichero.txt . Por ejemplo: edit prueba.txt (suponiendo que estamos ya en el directorio donde se encuentra el archivo prueba.txt).
• calc --> nos abre la calculadora.
• mspaint --> nos abre el paint.
• cls --> limpia la pantalla de la consola.
• help [algún comando] --> nos da por pantalla de la consola una definición del comando, con sus instrucciones.
• exit --> cierra la consola.

Comandos "un poco más" difíciles:

• copy <ruta de origen del fichero> <ruta de destino del fichero> --> copia el fichero origen al fichero destino. Por ejemplo: copy C:\Users\Desktop\prueba.txt  C:\Users\Desktop\UnaPrueba .
• move <ruta de origen del fichero> <ruta de destino del fichero> --> mueve ficheros de un directorio a otro. 
• [/Y] --> Si pusiéramos después de move , este moverá el fichero o ficheros sin preguntar la confirmación de reemplazo a otros archivos que se puedan llamar de la misma forma. 
• xcopy origen [destino] --> parecido a copy pero aquí se copia un directorio entero con subdirectorios y ficheros incluidos.
• xcopy /p origen [destino] --> pide confirmación de si o no antes de copiar cada archivo.
• xcopy /v origen [destino] --> verifica si el archivo se ha copiado correctamente.

Atributos de los ficheros

• attrib <fichero> <+/-> </h/s/a/r> --> visualiza o modifica los atributos de un fichero determinado. Con + establecemos un atributo a un fichero y con - lo borramos. Si no damos ningún parámetro lo que hacemos es visualizar los atributos.
• /h --> Oculto.
• /s --> De sistema.
• /a --> De archivo, para saber si un determinado fichero ha sido o no modificado.
• /r --> De sólo lectura, protege la escritura y el borrado de un fichero.

Algo Básico de HTML y CSS.

El otro día un colega, me pedía información sobre como cambiar el estilo de unos links cuando estaba aprendiendo HTML. Lo que quiero con esta entrada es dar unas nociones muy básicas sobre el CSS (Cascading Style Sheets), sobre esto hay cientos de libros, además de vídeo tutoriales pero lo que busco es exponer los pasos mas simples.

Las hojas de estilo reciben la extensión .css todo esto esta reglado por el W3C (World Wide Web Consortium). El CSS es un lenguaje usado para definir la presentación de un documento escrito en HTML. Por tanto, conocemos que en HTML se utilizan etiquetas y vamos crear un archivo que se llame ejemplo.html, con una estructura muy simple puede ser esta:

<html>

<head> 
<!-- Es el primer elemento que lee el navegador y, por ello, es el mejor lugar para insertar sitaxis script. -->
<tile>Ejemplo</title>
<!--Colocamos el link para la hoja de estilos que crearemos-->
<link rel="stylesheet" type="text/css" href="styles.css">
</head>

<body>
   <!--Cuerpo del código-->
   <h1>  <a class="orang" href="#">Enlace para enlazar</a> </h1>
   
   <!--Añadimos un break,como un salto de línea, es el comando de abajo-->
   <br/>

</body>

</html>

Una vez que tenemos esto, se puede disponer a darle un estilo que quede bien, por tanto nos podemos crear un archivo tal que styles.css, donde vamos a definir los estilos, por ejemplo el estilo del cuerpo y de la etiqueta h1, tal que así:

body{
  font-family: sans-serif; 
  font-weight: 100;
  background: #ccc;
}
h1{
  text-align: center;
  color: #666;
  text-shadow: 0px 2px #fff;
}

Pero claro esto es lo más básico como se haría para solucionar el problema, de darle un estilo a los link, abajo lo vemos:

a{
margin: 1px 0;
float: left;
clear: left;
text-decoration: none;      /**Quitamos la barra del link*/
}
.orang{
color: orange;              /** Cambiamos a color naranja*/
padding: 0 0 0 18px;
border-bottom: thin dashed; /** Esto nos da el discontinuo*/

}

Como resultado tenemos:

Compilar Java desde la Consola de Windows

Hoy en unas de mis innumerables búsquedas por Youtube, encontré un vídeo bastante interesante, que me llamó especialmente la atención por su título: "¿Están aprendiendo "MAL", a programar?" Da una versión muy clara de lo que creo que ocurre hoy día y es la dependencia en un entorno de desarrollo concreto, por ejemplo en mi caso Eclipse. 

Entornos de desarrollo hay multitud y muchos de nosotros conocemos y nos manejamos entre varios, pero pocas veces hemos utilizado la consola de Windows para compilar un código, lo que me hace pensar que si careciéramos de estos entornos, ¿podríamos manejarnos bien? 

La principal ventaja de estos entornos es la comodidad, nosotros podemos conseguir fácilmente uno de estos entornos y empezar a escribir código casi al momento, además de compilarlo en un instante y tener un editor que nos de donde están los fallos, todo muy cómodo. He aquí mi motivo para escribir esta entrada, si no tenemos un entorno, ¿cómo lo hacemos? Para ello debemos conocer unos pocos comandos muy fáciles de utilizar:

• Primero, debemos ejecutar la consola pulsando (Símbolo de Windows)+R, donde aparecerá Ejecutar con el comando cmd escrito, le damos a aceptar.
• Segundo, debemos posicionarnos en la carpeta donde esta el archivo que queremos compilar, para ello vamos a utilizar dos comandos: dir y cd "nombre". Con el primero abrimos los que hay dentro de la ruta donde estamos. Con el segundo buscamos la carpeta, tal que así:

• Con esto aparecen los archivos que hay dentro, en mi caso Ejemplo.class, Ejemplo.java y prueba.txt . El primero de ellos nos lo genera el comando javac Ejemplo.java , es decir, este nos genera la clase (.class) que archivo que nosotros queremos compilar en este caso Ejemplo.java. Esto lo hacemos dado que javac nos convierte nuestro código en código reconocible por la máquina virtual de JAVA. Una vez hecho esto escribimos en la consola java Ejemplo (muy importante NO poner aquí el .java) y tendremos nuestro código ejecutado.

• Por último para borrar lo que tenemos en la consola podemos utilizar el comando cls y tener la consola limpia.

Un ejemplo, puede ser teniendo un código en el cual le introducimos los números y nos muestra la matriz.

Framework --> AngularJS

AngularJS es un framework, pero antes de ponernos con el, me asalta la pregunta: ¿Que es un framework?

Este concepto se emplea en muchos ámbitos del desarrollo de sistemas de software y se aplica a multitud de áreas. Por así decirlo, se puede considerar como una aplicación genérica incompleta y configurable a la que podemos añadirle las últimas piezas para construir una aplicación concreta.

Lo que persigue un framework es: 

1. Acelerar el proceso de desarrollo.
2. Reutilizar código ya existente.
3. Promover buenas prácticas de desarrollo como el uso de patrones.

Por tanto, existen multitud de framework orientados a las más diversas tareas que podemos imaginar, pero qué es lo que me llamo más la atención de Angular, que esta orientado a la gestión de lo que se conoce como aplicaciones web de una sola página. Englobado en lo que conocemos hoy día como front-end  la parte del software que interactúa con el usuario, por ejemplo recolectando los datos de entrada de este. Donde su principal ventaja frente a otros radica en que nosotros vamos a trabajar con una sola página, donde con cada cambio que hagamos vamos a actualizar el elemento cambiado de la página y no toda la página. ¡Parece interesante!

¡El comienzo!

Navegando por la web, me tope con uno de estos famosos Framework que tanto podemos escuchar hoy en día por la web. Su nombre es: "AngularJS" seguro que muchos lo conocen. Y me anime a probarlo por sus maravillosas críticas que leí tanto en la web correspondiente como en Youtube.

Es poco el tiempo que llevo usándolo (concretamente un par de días), pero me ha gustado. Y me ha parecido una buena opción poder aprender más de el, mi aprendizaje no es que sea del todo rápido, pero gano con la constancia y con algunos conocimientos en Java, y alguna que otra prueba con Html y Css. Muchos verán que no es suficientes, pero como yo digo por algo se empieza. 

No quiero dármelas de ser un "superentendido" en la materia, pero sí un entusiasta en todo lo que relaciona la tecnología y el código. Este mundo avanza tan rápido que quedamos desactualizados en el mismo momento en el que empezamos a aprender un nuevo programa. 

Por tanto quiero empezar lo que yo lo llamo un cuardenillo de notas, donde voy a publicar las partes que más trabajo me han llevado a realizar búsquedas y búsquedas en todo este vasto mundo que es Internet. No es que quiera convertir este bolg es un tutorial, sino en un sitio donde recurrir para encontrar una explicación clara hacia este tema que he expuesto de AngularJS, o por ejemplo algunas partes interesantes de Java o Html/Css.

Pst: Si alguien encuentra por causalidad este blog (:-p) y esta interesado en AngularJS este es el link de su web oficial --> https://angularjs.org