Inelastica – Cultura Gráfica! -

Todos los que estamos en el ámbito del desarrollo web, tenemos necesidad de ir viendo lo que vamos haciendo, probando y ajustando algúnos pequeños detalles antes de publicar nuestro proyecto. A pesar que desde el Dreamweaver CS3 ya es bastante facil ir viendo lo que vas haciendo (WYSIWYG) siempre hay instrucciones de codigo que no muestra de buena manera el area de diseño de dreamweaver, otra de las soluciones que encontramos es crear en nuestro servidor (si lo tenemos disponible) una carpeta que se llame http://dominio.com/proyectos, v2, etc. Lo cual significa estar subiendo por medio de FTP .

Ahora veremos como instalar en nuestra computadora, un servidor local, para poder hacer pruebas de nuestros proyectos que incluyan scripts de php, bases de datos, etc.

Para hacer todo este tipo de pruebas vamos a instalar en nuestra propia computadora un servidor local, como el que está instalado en los servidor de internet. En este post lo explicaremos de una forma sencilla para todos aquellos que se enfocan más al diseño y creatividad en el desarrollo web, que por necesidad siempre tienen que tener esta herramienta a la mano.

Prime explicaremos que es lo que compone básicamente un servidor web (resumido):

1. Servidor http o web (Apache Server, IIS, etc)

2. Servidor de bases de datos (MySql, Sql Server, etc)

3. Servidor ftp (filezilla)

4. Servidor de correo.

porsupuesto los servidores de internet tienen muchas cosas mas instaladas, que no las mencionaremos ahorita. Para este tutorial solamente instalaremos los primeros dos componentes, que son los mas importantes y suficientes para ejecutar nuestras páginas html, php, js, etc. Utilizaremos una programa de software libre que se llama xampp y lo pueden descargar aqui:

Para este tutorial instalaremos xampp en una computadora con Windows Vista de 64 bits, él cual es el mismo proceso para cualquier windows desde XP con SP2. Ahora para  Mac y Linux de último explicare un par de pasos diferentes que hay que hacer. Con xampp practicamente prepararemos nuestra máquina para instalarle lo siguiente:

1. Servidor http: Apache Serverd 2.2.12

2. Servidor de bases de datos (MySql server)

3. y otras cosas como Php, PhpMyAdmin, Webalizer, etc.

Bueno, ahora si. Empezemos con el tutorial:

1. Damos doble click sobre el archivo ejectuable de xampp (asegurence de haber descargado el archivo .exe)

2. Seleccionamos el idioma para la instalacion, english, amenos que sepan áleman! :D

3. Para sistemas de 64 bits nos dara un advertencia. Solamente es que no puede instalar xampp en la carpeta hábitual para programas de 32bits (x86), pero ese no es problema lo instalaremos directamente en el disco duro.

4. La siguiente ventana nos pregunta en donde queresmos instalarlo, yo lo intalare en:

c:\xampp

5.  Luego nos preguntara que servicios inlcuidos dentro de xampp queres instalar, nos saldra una ventana parecida a esta:

Seleccionamos porsupuesto los ya mensionados:

1. Apache Server
2. MySql Server
3. Filezilla Server (este último es opcional, si soalmente eres desarrollador web no lo utilizaras).

luego de damos INSTALL y dejamos que el instalador haga su trabajo. Cuando finalize empezara a levantar los servicios.

Si te dice que ha ocurrido un mensaje de error de que el puerto 80 esta en uso, tendras que ver si no tienes instalaciones anteriores de apache server, o programas como Skype instalados en tu computadora.

En el escritorio nos colocó un icono de xampp le damos doble click para iniciar el control panel y veremos algo como esto:

Nos damos cuenta que nuestros servidores esta instalado correctamente y funcionando.

- Ya instalamos xampp Ahora probemos nuestro servidor, escribe en tu browser de eleccion lo siguiente:

http://localhost ó http://127.0.0.1

Si todo salio exitosamente te cargara una página de bienvenida de apache friends (xampp)

PROBANDO NUESTROS SITIOS

Para probar los sitios que hemos hechos, o iniciar uno y poder probarlos con nuestro servidor local debemos tener en cuenta los siguiente:

1. Los proyectos deben de estar guardados en la carpeta llamada “htdocs” dentro de la carpeta “xampp” de instalación.

C:\xampp\htdocs

Dentro de este directorio crearemos carpetas para guardar nuestros proyectos, para probar crearemos la carpeta “proyecto1″

C:\xampp\htdocs\proyecto1

creemos ahi un archivo llamado index.html con cualquier codigo html y escribamos en el browser:

http://localhost/proyecto1

Felicidades! ya cargaste tu proyecto como que si estubiera corriendo en un servidor web.

UTILIZAR EL SERVIDOR DE PRUEBA CON DREAMWEAVER CS4

Mucho de nosotros utilizamos dreamweave como herramienta para desarrollar, ahora veremos como configurarlos para que al pulsar “f12″, ejectue la página desde nuestro servidor local.

Elegimos en la barra de menú:  Sites – Manage Sites y nos abrira un ventana como esta:

Le damos New (para agregar un nuevo sito a dreamweaver)

En la categoria de Local Info, configuramos los siguientes parametros:

(Local root folder: hay que especificar la carpeta en la que se encuentra nuestro proyecto, recuerda que esta debe de estar dentro de nuestro servidor local c:/xampp/htdocs)

Luego elegimos la categoria Testing Server

y la configuramos de la manera siguiente:

- Server model: PHP MySQL

- Acces: Local/Network

- Testing server folder: c:/xampp/htdocs/proyecto1

- url prefix: http://localhost/proyecto1

Le damos ok, y ya prodemos ver en Files nuestro archivo index creado anteriormente. lo abrimos y presionamos “f12 para ejecutarlo y listo! Ya hemos configurado dreamweaver para que prueba la pagina desde nuestro servidor.

Espero les ayude este tutorial, esta bien sencillo! de eso se trata, tratare de ir ampliandolo más adelante, cualquier duda, comentario o correción por favor postenla.