Sitio Web local con PHP/MySQL en Dreamweaver

Hace ya bastante tiempo preparé un tutorial en Primera Web para configurar un sitio Web con Dreamweaver sencillo, es decir, un sitio Web con HTML que no requería de un servidor, pues ha llegado el momento de configurar un sitio con para trabajar con PHP y MySQL, gracias a la pregunta de Arturo Paúl.
Solo advierto que estoy usando la versión CS3 de Dreamweaver, en la versión CS5  (que no he conseguido aún ya que CS3 es suficiente para mi) el procedimiento es algo diferente, además me centro en la instalación y configuración en el SO Windows.

Los Servidores

Lo primero es que ya debes haber instalado los servidores para PHP y MySQL, las tres opciones más usadas desde mi punto de vista son:

1. AppServer 2,5: En donde la carpeta del servidor por defecto está en C:\appserv\www
2. Xampp: En donde la carpeta del servidor, si mal no recuerdo, está en C:\appserv\htdocs
3. Wamp: AL igual que en AppServer está en C:\appserv\www

Los tres incluyen el servidor Apache, PHP, MySQL y phpMyAdmin.
Para instalar AppServer revisa este tutorial, si prefieres trabajar con Wampp lo tienes en la primera parte de este video:

Instalando WampServer y Joomla

O para trabajar con Xampp este otro video:

Instalando servicios de Xampp

La Base de Datos en MySQL

Indistintamente a la herramienta que hayas instalado, necesitamos una base de datos en MySQL, tomaremos para este ejercicio la BD diseñada en este otro artículo:

• Nombre de la base de datos: agenda
  En la imagen aparece como “mi_agenda”, nos quedamos con el nombre usado en la descripción “agenda”.
• Nombre de tabla: personas
• Nombre de los campos: idpersona, nombres, apellidos, alias, fecha_nacimiento.

No olvidemos agregar algunos datos a la tabla, y estamos listos para comenzar a configurar nuestro sitio con Dreamweaver CS3.

Configurando Dreamweaver

No entraré a comentar las ventajas de configurar un sitio en Dreamweaver (eso lo aclaré en este otro post) así que iniciamos Dreamweaver CS3 que presenta la siguiente vista en modo diseñador:

En la zona inferior a la derecha tenemos el panel de Archivos desde donde podremos ver nuestros sitos configurados, por ejemplo tengo uno llamado “ejemplosphp”  (si está en modo de desarrollador este panel se mostrará al lado derecho, eso solo afecta a la distribución de los paneles y no a la funcionalidad del sitio):

Empecemos, menú “Sitio”, clic en “Administrar sitios…”:

Tenemos la ventana “Administrar sitios” desde donde podremos configurar nuevos sitios, editar o eliminar o duplicar los existentes entre otras opciones, allí vemos un sitio que previamente he añadido. Lo que deseamos es crear uno nuevo, clic en el botón “Nuevo…”, clic en la opción “Sitio…”:

Notemos a la derecha, hay dos categorías que nos interesan en este tutorial, la primera es “Datos locales” que ya está seleccionada, debemos agregar al menos los siguientes datos:

1. Nombre del sitio: El “alias” con que identificaremos a nuestro sitio, le pondré el nombre “Mi agenda”.
2. Carpeta raíz local: Es la carpeta en tu unidad en donde guardaremos los archivos de nuestros sitio, al inicio aclaramos este punto, como estoy trabajando con Wampp he creado la carpeta “C:\wamp\www\agenda”.
3. Dirección HTTP: La dirección Web que usaremos para cargar los archivos de esta carpeta raíz local, en mi caso es “http://localhost/agenda”.
   En el caso que hayas usado un puerto diferente al 80 se debe colocar luego del nombre del servidor separándolos con dos puntos, por ejemplo, si estoy usando el puerto 9090, entonces la dirección HTTP será: http://localhost:9090/agenda

Ahora pasemos a la segunda categoría que es “Servidor de prueba”:

1. Modelo de servidor: Selecciona “PHP MySQL”
2. Acceso: Local/Red
3. Carpeta de servidor: Puesto que estamos en modo local ya debería aparecer nuestra previa carpeta raíz local “C:\wamp\www\agenda\”, en caso contrario la agregamos.
4. Prefijo de URL: Puesto que estamos en modo local aquí colocamos nuestra previa dirección HTTP, incluyendo el número de puerto si es diferente al puerto 80.

Establecidos los datos en estas categorías es suficiente por ahora para tener un sitio funcional, damos clic en “Aceptar” y volvemos al anterior cuadro de diálogo:

Damos clic en “Listo” para terminar de agregar nuestro nuevo sitio:

Ahora sobre esta carpeta de tu sitio Web clic con el botón derecho, clic en “Agregar archivo”:

Se agrega el archivo “untitle.php”, escribe inmediatamente para cambiar el nombre por “datos.php”, intro para guardar y otra vez intro para abrirlo (también lo abrimos con doble clic), en el archivo abierto, en la vista de código agregamos lo siguiente:

Guardamos los cambios (Ctrl + S), presionamos la tecla F12 y obtendremos los datos guardados en la tabla “personas”:

Sobre la explicación de las funciones para trabajar con MySQL usada en este ejemplo revisa el artículo PHP y MySQL: Conectando por funciones, o si lo que deseas es aprender a usar el asistente revisa este otro artículo Dreamweaver: Usando el asistente para recuperar datos.
No duden en compartirlo y dejar sus comentarios, trataré de contestar sus preguntas lo antes posible y no olviden visitar mi página de Facebook aquí o en Google+ acá