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.
 
 

 

FTP activo Vs. FTP pasivo

Breve artículo para explicar las diferencias básicas entre los modos FTP activos y pasivos.

MODO ACTIVO
Se trata del habitual por defecto. Este modo crea dos conexiones diferentes. La primera para la transmisión de comandos desde cualquier puerto de nuestro ordenador, inferior al 1024 hacia el puerto 21 del servidor. Con esta conexión, y con el comando #port, se informa al servidor del puerto de nuestra máquina que va a escuchar los datos del servidor.

Así, para descargar un fichero, el servidor es quien inicia la transferencia de los datos, desde su puerto 20 al puerto que se le ha sido indicado. Es por eso que se le llama modo activo.

MODO PASIVO
En cambio, en pasivo es el cliente quien va a iniciar la conexión con el servidor. Lo primero se abre una conexión de control desde un puerto de la maquina local al puerto 21 del servidor. Ahora el cliente pide al servidor un puerto abierto. Una vez recibida la respuesta, es el cliente quien establece una conexión con el servidor a través del puerto que se le ha enviado.


Como conclusión, podemos decir que en el modo pasivo las conexiones se establecen por el cliente, mientras en en activo se establecen por la maquina que envía los datos.



Junto con Rafael Miranda Ibañez

Editores de páginas web.

pasos-a-seguir-para-crear-pagina-web
 
Antes de nada vamos a definir claramente que es un editor de páginas web.
Un editor de páginas web es una aplicación diseñada con el fin de facilitar la creación y edición de documentos HTML o XHTML.

¿Cómo nos facilita esto? 

Una de las formas es usando fragmentos de código, que nos va a ahorrar muchísimo tiempo a la hora de escribir nuestras marcas.
Cuando vamos a crear nuestras páginas webs, lo más habitual es encontrarnos código repetido “mil veces”. Para ahorrarnos escribirlos a mano, aparecen los fragmentos de código o snippets, que no son más que un “trozo” de código, el cual reusaremos a lo largo de nuestro marcado.

Con estas herramientas nos ahorraremos tiempo y varios quebraderos de cabeza. 
 
Vamos a clasificarlos en dos grupos. Los específicos para Windows y los que se usan en Linux o son multiplataforma.
 
Editores Windows
 
CoffeeCup HTML Editor:
 
Las principales características del CoffeeCup HTML Editor son sus asistentes (inserción de imágenes, enlaces, menús HTML, etc.) tratando a los elementos HTML como objetos con sus propiedades, resaltado de sintaxis (HTML, CSSPHP…) , editor visual (WYSIWYG), y poco más. Ha quedado un tanto desfasado, aunque sigue siendo muy válido como editor HTML.
 
Su precio es de 69 dolares.
 
 
 
Adobe Dreamweaver:
 
Es muy similar a CoffeeCup aunque con mayores prestaciones, aunque también es mucho más caro.
 
En la última versión dispone de un mejorado soporte de CSS, que junto a su autocompletado de atributos CSS (ideal para los que empiezan) lo convierte quizás en uno de los editores más cómodos para trabajar con CSS.
 
Al igual que CoffeeCup, sus asistentes harán gran parte del trabajo para los más novatos, aunque de poca utilidad para los más avanzados. Incluye lo que han llamado Spry, una librería de widgets y efectos mediante Javascript.
 
Su precio es de 24,59€ al MES.
 
 
 
Linux / Multiplataforma                                            
Amaya:
 
Está desarrollado por la W3C (World Wide Web Consortium), la asociación que se encarga de construir los estándares web.
 
Es un navegador y un editor web, cuya peculiaridad es que permite editar directamente cualquier página web que se visualice, y que permite editar SVG y MathML, para codificar e integrar junto con HTML. Es bastante rudimentario  y carece de asistentes.
 
Su software es libre.
 
URL: Amaya
 
 
Aptana:
 
Este editor está basado en Eclipse, e incluso puede usarse como plugin en éste. Su asistente de código (HTML, CSS y Javascript) es único, mostrando documentación en línea de todos y cada uno de los elementos, como en qué navegadores está soportada una función de Javascript o un atributo CSS.
 
Además muestra información en línea sobre las funciones Javascript propias. Viene con depurador de Javascript. Es el editor web más completo del mercado y además es libre (gratuito y con código fuente abierto).
 
Software libre.
 
URL: Aptana
 
 
Zend Studio:
 
Más que un editor web, es todo un entorno de desarrollo para PHP. Tiene auto completado de código HTML (no para Javascript y CSS) además de para PHP, y no es posible editar en modo WYSIWYG, aunque el resaltado de sintaxis les podría valer a los desarrolladores más expertos.
 
Su punto fuerte está en su editor y depurador PHP. Su soporte para gestionar bases de datos (MySQL, MS SQL Server, Oracle, PostgreSQL, …), lo convierte en uno de los mejores entornos de desarrollo web para PHP existente.
 
Su precio es de 89 dolares, aunque dispone de una versión de prueba.
 
BlueGriffon:

 

Este editor WYSIWYG utiliza por debajo el motor de renderizado de Firefox para visualizar las páginas a medida que las vamos editando. 
 
Cuenta con ayudas a la escritura de código y ofrece incluso la posibilidad de probar en tiempo real transformaciones 3D de CSS3 sin abandonar el editor. 
 
Es gratuito, código abierto y multiplataforma (Windows, Mac y Linux) y está disponible en Español entre otros muchos idiomas.
 

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