Introducción a ES6

Exportación de datos en PHP a documentos.

Hoy vamos a explicar como exportar datos de una web con base de datos a distintos formatos de documentos.
 
Tenemos que distinguir dos tipos:
  • PDF
  • Word y Excel
 
¿Porqué distinguimos de dos tipos?
Porque para imprimir en PDF necesitaremos una una librería externa a PHP, sin embargo .doc y .xls lo vamos a convertir en las cabeceras (header()).
 
Empecemos por explicar el escenario de trabajo.
Tenemos una web que administra una base de datos que guarda preguntas y respuestas.
 
Captura1
Queremos que el administrador tenga la opción de exportar la base de datos a documentos.
 
Empecemos viendo cómo vamos a exportar estos datos.
 
Primero vamos a centrarnos por lo más sencillo.
Para ambos casos de tipos de formatos vamos a necesitar una página la cual vamos a imprimir en un documento. La vamos a llamar impresion.php.
 
Captura2
 
Crearemos un nuevo script que se va a encargar de gestionar la exportación.
En este nuevo script, lo primero que debemos hacer es comprobar el tipo de extensión
 
Captura3
Como observareis, detectamos extensiones solamente en función de .doc y .xls, ya que el siguiente paso es detectar si es PDF por el tipo.
 
Ahora solamente nos centraremos en los .doc y .xls
 
Una vez que detectamos que no es PDF, escribimos las cabeceras correspondientes.
 
Captura5 (1)
Siendo la cabecera que se va a encargar de exportar los datos:
 Captura4
 
El atributo filename, va a ser el archivo que nos va a generar, que decidimos ponerle de nompre “preguntas” y le añadimos la extensión detectada anteriormente.
 
Una vez hecho el require del documento de impresión creado antes, vamos a imprimir en .doc o en .xls.
 
Veamos el resultado: 
 Captura6
 
 
Ahora pasamos a trabajar con el formato PDF, para ello necesitaremos la libreria DOMPDF, el cual nos lo descargaremos de GitHub y lo incluiremos en nuestro script.
 
Ahora dentro de la detección del formato PDF, realizamos lo siguiente.
 Captura7
 
Como vemos, lo primero que hacemos es incluir la libreria.
Creamos la clase Dompdf para poder acceder a sus métodos.
Lo primero, es necesario cargar el HTML a imprimir, es importante añadir la ruta completa, que en mi caso es una constante que contiene:
 
“http://localhost/sabioGC/util/”
 
Una vez cargamos el HTML, renderizamos el resultado y una vez renderizamos, generamos el PDF con el título que queramos y su extensión .pdf
 
Así de simple.
 
Veamos el resultado:
Captura8 
 
Sin más, espero que os sea de ayuda.
 
Emanuel Galván Fontalba – Web Developer.
 
 

 

Git – Bash. Tutorial.

Git-Logo-2Color-910x198
 
Vamos a hacer un breve resumen de como usar Git desde consola.
Explicaremos como usarlo a nivel individual como para hacer colaboraciones.
Sin más, espero que os sea útil. 
 
 
Creación del repositorio:
Lo vamos a crear desde GitHub:
usoDeGitEmanuelGalvanFontalba.pdf - Adobe Reader
Copiamos el enlace del repositorio:
 usoDeGitEmanuelGalvanFontalba.pdf - Adobe Reader (1)
Ahora desde la consola de Git, vamos a clonar el repositorio:
 usoDeGitEmanuelGalvanFontalba.pdf - Adobe Reader (2)
Despues de clonar, nos situamos dentro del proyecto clonado.
Ahora escribimos el código correspondiente y lo guardamos dentro de este repositorio.
 
Cuando acabemos hacemos un git status para ver si se a añadido al repositorio local con éxito:
usoDeGitEmanuelGalvanFontalba.pdf - Adobe Reader (4)
Ahora vamos a hacerle un add:
usoDeGitEmanuelGalvanFontalba.pdf - Adobe Reader (5)
Vemos de nuevo el git status y vemos como se han quedado en el stage área:
usoDeGitEmanuelGalvanFontalba.pdf - Adobe Reader (6)
Vamos a hacer nuestro primer commit:
usoDeGitEmanuelGalvanFontalba.pdf - Adobe Reader (7)
Volvemos a ver el git status y comprobamos que ya no están en el stage área.
Ahora vamos a hacer un push sobre el commit hecho, para subirlo a nuestro repositorio remoto:
usoDeGitEmanuelGalvanFontalba.pdf - Adobe Reader (9)
usoDeGitEmanuelGalvanFontalba.pdf - Adobe Reader (10)
Ahora hacemos lo mismo con el resto de versiones:
 
usoDeGitEmanuelGalvanFontalba.pdf - Adobe Reader (11)

TUTORIAL DE JAVA (1): Consejos y comentarios.

Antes de seguir leyendo, debes de leerte uno de los post anteriores donde explico como instalar JDK.


Consejos previos:

Antes de empezar a programar, debemos de conocer una serie de conceptos y consejos para conseguir un buen programa y código.


Lo primero que debemos plantearnos es si nuestro programa va a ser privativo o lo vamos a compartir con otros programadores.


Si decidimos que el programa va a ser privativo y no queremos que nadie lo entienda, debemos de ofuscar el código, es decir, el nombre de las variables, métodos, campos, estados, excepciones, etc, no deben de ser claros. Ejemplo:


int x; (variable que va a ser la edad)

public void metodo1(int x); (método que aumentará la edad en +1)


Tampoco se debería comentar el código ni tabular el código.


Si por el contrario decimos que el código lo vamos a compartir con otros programadores o el caso de que no nos importe que sea legible, el código ha de ser claro y conciso.


El nombre de las variables, métodos, campos, estados, etc han de estar bien escritos:


int edad;

public void cumpleanios(int edad);


En este caso el código ha de estar bien comentado y correctamente tabulado.


Conociendo el entorno de java:


– Comentarios:

Para comentar el código, debemos ver el tipo de comentario que queremos hacer.


El primero que vamos a definir es el comentario en linea (//), el comentario no puede superar una línea. Se suele usar para comentar cosas que te quedan por hacer en el código o por hacer una breve aclaración de alguna línea de código.




public void cumpleanios(int edad){
    ++edad; // incrementar en uno la edad

}


Ahora pasemos a definir el comentario en bloque(/* comentario */), el comentario suele ser grande y para no hacer varios comentarios en linea, pasamos a hacer un solo comentario pero en bloque. Suele usarse para grandes comentarios dentro del código.


public void cumpleanios(int edad){

    /* En este comentario vamos a definir este método

    comentario comentario comentario comentario

    comentario comentario comentario comentario

    comentario comentario comentario comentario */

    ++edad;

}


El siguiente comentario que vamos a definir se suele usar para hacer un comentario formal e ilustrativo de nuestro código, haciendo de resumen de éste. Este comentario va a ser javadoc (/** comentario*/)


/**

* Programa de ejemplo para comentario javadoc

*

* @autor Emanuel Galván Fontalba

* @version 1.0

*/

public class Ejemplo(){
    public static void main(String [] args){

      //codigo

      //codigo

      //codigo

    }

}


Éste comentario requerirá generarlo más adelante y se genera un documento en HTML, el cual se puede visualizar más adelante.


-Conceptos generales:


Bloque de código:

Todo lo que va en un bloque de código, irá entre llaves ({ código }).


Cerrar lineas de código:

Líneas de código que no definen un bloque de código, se cerrará con punto y coma ( ; ).


Reglas generales de sintaxis:


-En el nombre de las variables, la primera letra es en minúscula.

-En el nombre de las clases, la primera letra es en mayúscula.

-En el nombre de métodos, la primera letra es minúscula.




Tras esta pequeña introducción pasamos a programar y establecer los comentarios correctamente:


/**

* Programa que muestra por pantalla “Hola mundo”

*

* @autor Emanuel Galván Fontalba

* @version 1.0

*/

public class HolaMundo(){ //Bloque de código
    public static void main(String [] args){
      System.out.println(“Hola mundo!!”); // Muestra por pantalla en consola

    }

}



Todo esto lo ejecutamos correctamente como se indica en la entrada donde comentamos como instalar JDK.

Documentación Javadoc de Oracle: Enlace

Comienzo de lenguaje de marcas con HTML

 

introduccion html
Vamos a hacer una breve introducción primero a que es el HTML.
 
Bien, pues HTML es un lenguaje de marcas. Y os preguntareis, ¿qué es un lenguaje de marcas?
Pues el lenguaje de marcas es una forma de codificar un documento que incorpora etiquetas o marcas que contienen información adicional acerca de la estructura. El más extendido es el HTML.
Dentro de los lenguajes de marcas tenemos varias clases.
  • Marcado de presentación: Nos va a indicar el formato del texto.
  • Marcado por procedimiento: Está enfocado hacia la presentación del texto.
  • Marcado descriptivo: Utiliza etiquetas para describir elementos del texto pero sin decirnos como es representado.


¿En cual de estas clases encontramos el HTML?
Pues lo vamos a situar en el marcado de presentación, ya que este lenguaje nos va a servir para definir el contenido y formato de una página web, como textos, imágenes, hiperenlaces, etc…
 
¿Qué significa HTML?
Del ingles HyperText Markup Language  que en español se refiere a lenguaje de marcas de hipertexto.
 
¿Qué necesito para empezar con HTML?
Fácil. Ganas, Bloc de notas, navegador y ¡a currar!



¡EMPECEMOS!
 
Lo primero que debemos hacer es investigar para que sirve cada instrucción, yo os adjunto una página web en la cual podéis mirar varias cositas. AQUI
 
Primero vamos a escribir lo siguiente en el bloc de notas:
<html>
 
 
 
</html>
 
Aquí dentro irá todo el código que queremos escribir. Con esto le decimos al navegador que vamos a escribir en HTML y él nos entenderá.
 
Lo siguiente es definir el cuerpo que lo vamos a hacer con la siguiente instrucción: <body>
¿Como se nos queda? Tal que así:
 
<html>
          <body>
 
 
 
         </body>
</html>
 
¿Bien?
Pues continuemos…
Para crear párrafos vamos a usar el comando <p> y para mostrar texto en negrita <b>
Vamos a ver como queda nuestro primer ejemplo.
 
<html>
       <body>
              <p><b>soy un parrafo y estoy en negrita</b></p>
       </body>
</html>
 
Despues de esto clicamos en Guardar como y ponemos la extensión .html:
ejemplo1.html
 
Y veremos que se nos guarda como si abrieses una página del navegador. Doble click y ya está el primer resultado.
¡Muy bien!
Ya sabemos algo básico. Vamos a avanzar.
 
Ahora vamos a tratar algo en el encabezado de la página web.
Para decirle al navegador que queremos tratar con el encabezado usaremos el comando <head>
y queremos ponerle titulo a nuestra página, pues usamos <title>
¿Cómo nos quedaria?
 
 

<html>
  <head>
    <title>Lenguaje de marcas</title>
  </head>
       <body>
              <p><b>soy un parrafo y estoy en negrita</b></p>
       </body>
</html>


¡Estupendo!
Vamos a pasar a cambiar la forma del texto a itálica, pues nuestro comando seria <i>.
Aunque… tambien quiero linkear mi blog atraves de un hiperenlace, pues… 
<a href=”URL DEL BLOG”>NOMBRE</a>
Por supuesto todo esto va dentro del cuerpo.
Vamos a verlo en la práctica:

<html>
  <head>
    <title>Lenguaje de marcas</title>
  </head>
       <body>

              <p><b>soy un parrafo y estoy en negrita</b></p>
              <p><i>esto es italica</i></p>
              <P>
              <a href=”http://rinconmain.blogspot.com.es/”>BLOG</a>               </p>

       </body>
</html>


Vamos a guardarlo de la misma forma que antes y a ver que tal queda.


 
¿Vamos a por un poco más? ¡Venga!
No todos los textos tienen que ser negros y del mismo tamaño.
Para eso vamos a ver ahora como modificar las fuentes con el comando <font>
Aunque este es un tanto especial… vamos a seguir aumentando el comando.
Quieres cambiar el tamaño. pues usamos <font size=”nº”>
Este número va a variar del 1 al 7, tu decides que tamaño quieres.
También podemos modificar el color… <font color=”COLOR”>
Elige el color que tu quieras pero eso si, escribelo en ingles.
Vamos a ver unos ejemplos:

 <p><font size=”5″> esto es grande </font></p>

 <p><font size=”1″> esto es pequeño </font></p>

 <p><font color=”red”> esto es rojo </font></p>


¿Fácil?
Tambien podemos modificar el tamaño y el color en una misma sentencia:

<font size=”8″ color=”blue”> esto es azul y muuuy grande </font>


Ahora todo esto vamos a implementarlo en nuestro código, a ver que tal queda.



<html>
  <head>
    <title>Lenguaje de marcas</title>
  </head>
       <body>

              <p><b>soy un parrafo y estoy en negrita</b></p>

              <p><i>esto es italica</i></p>

              <P>
              <a href=”http://rinconmain.blogspot.com.es/”>BLOG</a>               </p>
              <p><font size=”5″> esto es grande </font></p>

              <p><font size=”1″> esto es pequeño </font></p>

              <p><font color=”red”> esto es rojo </font></p>

<p>
<font size=”8″ color=”blue”> esto es azul y muuuy grande </font>
</p>

       </body>
</html>

Ahora vamos a guardarlo y a ver que tal nos queda.


 
 
¡Estupendo!
 
Pues esto es todo, espero que os haya sido de gran utilidad.
Un saludo.
Fuente: Propia