Instalación del XAMPP para Windows

1.- Introducción ¿Qué es XAMPP?

2.- Descarga del XAMPP

3.- Instalación para Windows del XAMPP

4.- Pequeño ejemplo de su uso

1.- Introducción ¿Qué es XAMPP?

[Wikipedia] “XAMPP es un servidor independiente de plataforma, software libre, que consiste principalmente en la base de datos MySQL, el servidor web Apache y los intérpretes para lenguajes de script: PHP y Perl. El nombre proviene del acrónimo de X (para cualquiera de los diferentes sistemas operativos),Apache, MySQL, PHP, Perl.”.

XAMPP es un “programa” que simula un servidor Apache en el propio PC para poder desarrollar páginas web en PHP utilizando bases de datos con MySQL y el lenguaje Perl. En este tutorial nos vamos a centrar simplemente en la instalación (en Windows) de este programa y en mostrar brevemente su uso con un sencillo ejemplo en PHP.

 

2.- Descarga del XAMPP

En primer lugar nos vamos a ir a la página de “http://www.apachefriends.org/en/xampp.html” para descargarnos el programa. Una vez estemos en esta página, nos descargamos el XAMPP para el sistema operativo que queramos (Linux, Windows, Mac OS X,…), en este caso para Windows:

Una vez pulsemos “XAMPP for windows” pasaremos a otra página que tendrá el siguiente aspecto y pulsaremos en “SourceForge” que nos llevará a una web de descarga para descargarnos el XAMPP:

Después nos enviará a una página de “sourceforce” para que nos descarguemos el programa. Pulsamos la versión del sistema operativo que nos queramos descargar, en este caso la de Windows:

Tras pulsar en el lugar indicado, te enviará a otra página para que definitivamente te puedas descargar el programa. En esa página, en la parte de arriba, aparecerá un enlace con la última versión del XAMPP disponible, así que le damos ahí para descargarnos la última versión que tendrá un tamaño de unos 60-65Mb. Si quisiésemos otra versión las buscaríamos en las diferentes carpetas que hay en la página:

Después de la descarga, deberíamos tener en la carpeta de descargas de nuestro PC un fichero “.exe” de la siguiente forma:

 

3.- Instalación para Windows del XAMPP

Una vez descargado el fichero de instalación, pulsamos en él para comenzar la instalación. Lo primero que debemos hacer es seleccionar el idioma de instalación. Elegimos en este caso el Inglés y le damos a “OK”:

Si después de esto nos sale alguna ventana de “alert” le damos siempre a “OK”. Después nos aparecerá la ventana de instalación del programa y le damos a OK:

Nos aparecerá una ventana para elegir el lugar en el cual instalaremos el XAMPP. Se recomienda guardarlo en el disco “C” que viene por defecto en la instalación, tal y como se muestra en la siguiente imagen. En principio se puede instalar en la partición que se quiera, pero por experiencia se ha de decir que instalándolo en otra partición ha dado algunos problemas a la hora de trabajar con este programa, así que se recomienda guardarlo en la ruta que viene por defecto:

Después de dar a “Next” nos aparecerá una serie de opciones de instalación. En este caso seleccionamos todas y procedemos a la instalación pulsando el botón “Install”. Las tres opciones de “Service Section” las podemos seleccionar para que al arrancar el XAMPP se nos inicien esas tres opciones, pero mejor las dejamos sin seleccionar para tener nosotros mayor control de la herramienta.

Tras realizar este paso comienza la instalación del programa que puede tardar unos minutos. En el proceso de instalación nos debe aparecer una ventana de este estilo:

Tras la instalación nos saldrán temporalmente algunas ventanas de línea de comandos que dejaremos ejecutarse. Tras la instalación, nos saldrá una ventana de fin de la instalación como la que mostramos a continuación:

Tras pulsar el botón de “Finish” nos saldrán unas ventanas de comandos que configurarán algunas características del servidor local en el ordenador. Estas ventanas tendrán el siguiente estilo y las dejaremos ejecutarse:

Tras la ejecución de estas ventanas de comandos nos aparecerá una ventana de fin de instalación del XAMPP como la siguiente:

 

4.- Pequeño ejemplo de su uso

Una vez instalado, le damos a la pestaña de “XAMPP Control Panel” para comenzar a utilizar el programa. En este caso vamos a realizar un sencillo ejemplo para ver el funcionamiento de este servidor local por tanto al iniciar el programa solo necesitaremos que esté activada la pestaña del “Apache” como se muestra en la siguiente imagen. Si también estuviesen activadas las pestañas de “MySql” y “FiliZilla” las dejaríamos activadas ya que lo único que nos indica es que podremos trabajar con bases de datos y con el FTP.

Una vez que tenemos el servidor activado ya podremos trabajar con él. Como se ha dicho el XAMPP lo que nos permite es “simular” un servidor, por tanto debemos irnos a la carpeta correspondiente donde guardaremos los diferentes ficheros que tendríamos en el servidor para poder visualizarlos. En este caso deberíamos guardar los ficheros de la web que desarrollemos en la carpeta “htdocs” que en este caso es el equivalente a la carpeta “public_html” de un servidor “real”. Esta carpeta “htdocs” se encuentra dentro de la carpeta “xampp”. Si habéis realizado la instalación tal y como se ha hecho en este tutorial el contenido de la carpeta “htdocs” se encuentra en esta ruta: “C:xampphtdocs”.

Como podéis ver en la carpeta “htdocs” se encuentran una serie de ficheros y carpetas que se incluyen de forma predeterminada tras la instalación. Como se ha dicho esta carpeta hace las funciones de la carpeta “public_html” de un servidor real por tanto podéis borrar todos esos archivos. Para poder visualizar una página web, en el servidor siempre tiene que estar el fichero “index.html” o en el caso que nos interesa el fichero “index.php”. Esto es importantísimo ya que siempre que se accede a una web, se accede en realidad al fichero “index.php” (esta última explicación no es del todo correcta, pero se explica así para que quede claro por qué tiene que haber siempre un fichero con ese nombre).

El porqué es necesario instalarse un servidor local, es debido a que hoy en día muchísimas páginas web son dinámicas y uno de los lenguajes de diseño de páginas web es el lenguaje PHP, que es un lenguaje interpretado que se encuentra en el lado del servidor, de ahí la necesidad de instalar el XAMPP para poder trabajar con este lenguaje. No es el fin de este tutorial explicar una arquitectura web, por tanto no entramos más en detalle en explicar esto último.

Ahora pasamos a realizar una sencilla página en PHP y ver como la podemos visualizar en el navegador. Para ello realizamos este sencillo ejemplo en PHP de página web en el que mostramos algunos String con un “echo” y utilizamos la sentencia “for” para mostrar una secuencia de número. Este contenido lo guardamos en un fichero con nombre “index.php” en la carpeta “htdocs” mencionada anteriormente.

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Ejemplo de Jarroba.com</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
	<h2>Esto es un ejemplo sencillo que prueba la instalación del XAMPP</h2>
	<?php echo"holaaaa" ?>
	<br>
	<h4>Ejemplo con un "for"</h4>
	<?php
		for ( $i = 1 ; $i <= 10 ; $i ++) {
			echo "<p style="color:#FF0000;font-family: Verdana, Arial, Helvetica, sans-serif;">";
			echo"numero: ";
			print $i ;
			echo"</p>";
		}
	?>
</body>
</html>

Para poder ver como quedaría la página web que estamos creando, nos vamos a un navegador y ponemos la siguiente URL: “http://localhost/” de esta forma visualizaremos la página web que estamos desarrollando. En este ejemplo visualizaríamos la siguiente página en el navegador “Chrome”:

Y si por ejemplo estamos realizando varios proyectos de páginas web y los queremos organizar en carpetas, podremos crear sin ningún problema varias carpetas dentro de la carpeta “htdocs” y para poder visualizarlo en el navegador tendríamos que poner la url: “http://localhost/nombre_de_la_carpeta” estando siempre dentro de esa carpeta el fichero “index.php” que “lance” esa web.

Por último a la hora de cerrar el programa es importante pulsar en el botón “Exit” para que se cierre el programa ya que si no estaría ejecutándose “en cubierto”: