Práctica de clase para comenzar a utilizar GitHub como herramienta para el desarrollo colaborativo, control de versiones y documentación del Proyecto Integrador de la asignatura.

Para poder dar enfásis a los contenidos de la documentación podemos utilizar los encabezados (Headings). Para marcar alguna sección o subsección estos se marcan utilizando el símbolo # ,entre menos repeticiones tenga mayor tamaño e importancia tendrá el texto.

Ejemplo:

####### Encabezado de Nivel 7 - Sólo 6 son los niveles permitidos, apartir de este el maquetado será ignorado.

Si desea marcar una separación más visual de contenidos podemos utilizarlos indicando tres caracteres de "-" continuos, en el maquetado.

EJEMPLO:

Esto es similar a un tag de

Son utilizados para presentar grandes secciones de texto que describen detalladamente las secciones de la documentación del proyecto.

EJEMPLO:

Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1. Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1. Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1. Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1.

Este texto pertenece al párrafo 2.Este texto pertenece al párrafo 2.Este texto pertenece al párrafo 2.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 2. Este texto pertenece al párrafo 2.Este texto pertenece al párrafo 2.Este texto pertenece al párrafo 2.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 2. Este texto pertenece al párrafo 2.Este texto pertenece al párrafo 2.Este texto pertenece al párrafo 2.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 2. Este texto pertenece al párrafo 2.Este texto pertenece al párrafo 2.Este texto pertenece al párrafo 2.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 1.Este texto pertenece al párrafo 2.

Lo que es una página utilizariamos usando la etiqueta < P >.

También podemos aplicar estilos básicos de alineación:

Este párrafo está alineado a la izquierda por defecto.Este párrafo está alineado a la izquierda por defecto.Este párrafo está alineado a la izquierda por defecto.Este párrafo está alineado a la izquierda por defecto.Este párrafo está alineado a la izquierda por defecto.Este párrafo está alineado a la izquierda por defecto.Este párrafo está alineado a la izquierda por defecto.Este párrafo está alineado a la izquierda por defecto.Este párrafo está alineado a la izquierda por defecto.Este párrafo está alineado a la izquierda por defecto.Este párrafo está alineado a la izquierda por defecto.Este párrafo está alineado a la izquierda por defecto.

Este párrafo esta alineado a la derecha utilizando la propiedad de alineación.Este párrafo esta alineado a la derecha utilizando la propiedad de alineación.Este párrafo esta alineado a la derecha utilizando la propiedad de alineación.Este párrafo esta alineado a la derecha utilizando la propiedad de alineación.Este párrafo esta alineado a la derecha utilizando la propiedad de alineación.Este párrafo esta alineado a la derecha utilizando la propiedad de alineación.Este párrafo esta alineado a la derecha utilizando la propiedad de alineación.Este párrafo esta alineado a la derecha utilizando la propiedad de alineación.

Este párrafo esta centrado usando la propiedad de alineación.Este párrafo esta centrado usando la propiedad de alineación.Este párrafo esta centrado usando la propiedad de alineación.Este párrafo esta centrado usando la propiedad de alineación.Este párrafo esta centrado usando la propiedad de alineación.Este párrafo esta centrado usando la propiedad de alineación.Este párrafo esta centrado usando la propiedad de alineación.Este párrafo esta centrado usando la propiedad de alineación.Este párrafo esta centrado usando la propiedad de alineación.Este párrafo esta centrado usando la propiedad de alineación.Este párrafo esta centrado usando la propiedad de alineación.Este párrafo esta centrado usando la propiedad de alineación.Este párrafo esta centrado usando la propiedad de alineación.Este párrafo esta centrado usando la propiedad de alineación.

Este párrafo estará justificado utilizando la propiedad de alineación.Este párrafo estará justificado utilizando la propiedad de alineación.Este párrafo estará justificado utilizando la propiedad de alineación.Este párrafo estará justificado utilizando la propiedad de alineación.Este párrafo estará justificado utilizando la propiedad de alineación.Este párrafo estará justificado utilizando la propiedad de alineación.Este párrafo estará justificado utilizando la propiedad de alineación.Este párrafo estará justificado utilizando la propiedad de alineación.Este párrafo estará justificado utilizando la propiedad de alineación.

Si el texto que deseamos enfatizar se encuentra de un párrafo , podemos utilizar algunos trucos para ubicarlos en la documentacíón.

Para poder poner el texto en negrita , este deberá ser encerrado entre dobles * *

EJEMPLO:

Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto

Algunas veces es necesario resaltar algunas secciones o textos en cursiva para que el lector detecte el texto importante, dentro del maquetado con el estándar Markdown lo podemos realizar ubicando el texto entre * (asteriscos).

Ejemplo:

Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto

De igual manera podemos unir ambos estilos Negrita y Cursiva para resaltar los textos que consideremos importantes dentro de la documentación de nuestros proyectos de software, utilizando un triple * (asterisco).

EJEMPLO:

Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto en Negrita y Cursiva Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto

Algubas veces necesitaremos subrayar texto dentro de la documentación, para ello, si bien Markdown no tiene un atajo o codificación rápida podemos utilizar el estilo estándar de HTML usando el tag y cerrando con

EJEMPLO:

Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto SubrayadoTexto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto

Estos elementos son utilizados para realizar instrucciones especificas para la instalación.Configuración y/o inicialización o mostrar secciones de código fuente. Se maqueta iniciando el texto con un símbolo de mayor que (>)

EJEMPLO: Para listar las carpetas y archivos desde una terminal de sistema operativo windows debemos ingresar el comando:

c:/dir

Despues oprimimos la tecla "Enter". También podemos ingresar textos multitarea.

EJEMPLO:

Aqui se ingresa un conjunto de instrucciones para explicar al usuario, como instalar el software que hemos diseñado.

Y si deseamos incluir viñetas para enlistar pasos podemos utilizar el caracter - dentro del texto a documentar.

EJEMPLO: Pasos para instalar la Base de Datos:

• Descargar MySQL Server del sitio Oficial
• Instalar el Sistema Gestor de Bases de Datos, definiendo el puerto y contraseña para el usuario. root
• Descargamos el archivo de respaldo de la Base de datos (.sql)
• Restauramos la Base de Datos usando el comando mysql

C:/Program Files/MySQL/MySQL Server 8.0/bin/mysql

EJEMPLO: Para crear tu primer repositorio en GitHub deberás: 5. Contar con cuenta en GitHub.

1. Dar click en el boton: Nuevo Repositorio
2. Asignar un Nombre a tu repositorio, por ejemplo: practica03-3a
3. Asignarle un nivel de privacidad entre

• Publico: Si quieres que esté disponible para todos los usuarios.
• Privado: Si deseas que solo a quien tu decidas puedan y colaborar con tu proyecto.

5. Definir si habrá exclusiones de archivos de descripción lamado : README.md
6. Definir si habrá eclusiones de archivbos a través del archivo: .gitignore
7. Guardar los cambios.

Si queremos usar un orden que comience en número especifico debemos utilizar código HTML,usando los tags <ol> y <li> :

EJEMPLO:

5. Quinto
6. Sexto
7. Séptimo

Las ligas son utilizadas para vincular elementos o referencias del proyecto dentro del mismo repositorio o fuera de el. Y se maquetan utilizando los corchetes [ ], inmediatamente despues pondremos la liga de referencia entre parentesis ( )

EJEMPLO: Mi buscador favorito es: Google

Pero si deseamos poner solo las ligas directas o un correo electronico podemos utilizar los simbolos < >

EJEMPLO:

Documentación creada por: Alumna Citlalli Pérez Dionicio

[email protected]

http://www.utxicotepec.edu.mx

Si la documentación lo requiere podemos presentar información en formato de tablas con filas y columnas, para maquetarlas podemos utilizar el carácter | para delimitar las columnas y - para delimitar las filas.

EJEMPLO:

En caso de necesitar la fusión de celdas con columnas usaremos la propiedad colspan del tag <td> y en el caso de necesitar la fusión de filas utilizaremos la propiedad rowspan

EJEMPLO:

Dado que en el ejmeplo pasado usando solo markdown no se puede realizar la fusión de filas debamos utilizar el estandar HTML,usando los tags: <th> para los encabezados y <tr> para las filas y para las celdas, y en ellos utilizar la propiedad de colspan y rowspan.

EJEMPLO:

Logo de las playeras de los inspectores:



Logo del icono de perfil:



Logo del icono de bitacora: