Manual para Crear Un Sitio Web Con PHP Desde Cero
Manual para Crear Un Sitio Web Con PHP Desde Cero
Manual para Crear Un Sitio Web Con PHP Desde Cero
“UNIANDES”
El nombre de nuestra base de datos será Videoteca. Crearemos nuestra base de datos dando al
enlace que pone “Bases de datos”, que está abajo, en nuestra página de
http://localhost/phpmyadmin/ como podemos ver en esta imagen:
UNIVERSIDAD REGIONAL AUTONOMA DE LOS ANDES
“UNIANDES”
Ahora se nos abrirá una nueva ventana, donde abajo del todo veremos “Crear una base de datos”,
en ella escribiremos el nombre de nuestra nueva base de datos, en este caso: Videoteca.
En el apartado anterior hemos aprendido a crear una base de datos MySQL, y he creado una, a la
cual la he llamado “Videoteca”. Ahora el siguiente paso sería crear las tablas y los campos que
nos hagan falta para posteriormente meter los datos, y eso es precisamente lo que vamos a
aprender en este tutorial.
Existen varias formas y programas diferentes para crear una tabla en una base de datos MySQL,
pero lo voy a hacer desde phpMyAdmin, el motivo de hacerlo desde phpMyAdmin y no de otra
forma es porque comúnmente, en todos los servidores ya sean caseros o de un hosting privados
siempre suele tener un phpMyAdmin a mano.
En primer lugar vamos a nuestro phpMyAdmin y seleccionamos la base de datos que hemos
creado anteriormente (Videoteca) como vemos en la siguiente imagen:
Ahora se cargara la base de datos y nos saldrá un mensaje que pone “no se han encontrado tablas
en la base de datos” y más abajo veremos un pequeño formulario para crear nuestra primera
tabla.
En nombre pondremos película y en número de campos pondremos 3.
Ahora damos a continuar y se nos cargara la página para crear los campos, en este caso serán los
3 que hemos puesto antes.
Veremos que tendremos que rellenar varios datos, pero no tenemos que preocuparnos, ya que
explicaremos uno a uno lo que significa.
Ahora que ya más o menos he explicado para qué es cada cosa voy a deciros que debemos de
poner en cada uno de los 3 campos:
Campo 1
Nombre: id_pelicula
Tipo: INT
Nulo: Not Null
Extra: Auto_increment
Y marcamos la llave de Primaria
Campo 2
Nombre: pelicula
Tipo: VARCHAR
Longitud: 30
Nulo: Not Null
Campo 3
Nombre: Director
Tipo: VARCHAR
Longitud: 30
Nulo: Not Null
Ahora damos a Grabar y ya tendemos nuestra base de datos "Videoteca" con la tabla "películas"
con la que podremos empezar a trabajar.
UNIVERSIDAD REGIONAL AUTONOMA DE LOS ANDES
“UNIANDES”
CREACION DE UN SITIO WEB
Para crear un sitio web se debe acceder a Dreamweaver, posteriormente presionar en la opción
“Sitio de Dreamweaver”.
En la pantalla que se muestra a continuación se debe asignar el nombre del Sitio Web y
presionar el botón Siguiente.
Seleccionar la opción “Si deseo utilizar una tecnología de servidor” y marcar el nombre de la
tecnología del servidor que se va a utilizar y presionar siguiente.
UNIVERSIDAD REGIONAL AUTONOMA DE LOS ANDES
“UNIANDES”
Posterior en la pantalla que se nos presentara seleccionar la opción deseada y buscar la carpeta
en donde se almacenaran los archivos y presionar Siguiente.
En la parte izquierda de la siguiente pantalla se puede visualizar nuestro sitio que fue creado.
Para crear una conexión con MySQL hacemos uso de la función mysql_connect y luego
definimos la base de datos que vamos a utilizar por medio de la función mysql_select_db.
En la primera línea hemos creado la conexión a un servidor local y luego hemos seleccionado la
base de datos 'demo' la cual utilizaremos para consultar datos según nuestras necesidades.
EXPLICANDO LA CONEXIÓN
Donde se tienen:
server: es la dirección IP o el nombre del servidor de base de datos.
username: nombre usuario para acceder a MySQL.
password: clave de acceso a MySQL.
UNIVERSIDAD REGIONAL AUTONOMA DE LOS ANDES
“UNIANDES”
CERRANDO LA CONEXIÓN
Una vez creada la conexión y hecho las consultas necesarias a nuestra base de datos, es necesario
cerrar esa conexión de esta forma liberamos recursos del servidor y mejoramos el rendimiento de
nuestra aplicación.
1. mysql_close($conexion);
Para cerrar la conexión hemos utilizado la función mysql_close que recibe como parámetro el
identificador de la conexión.
Recomendaciones
Aquí vamos a ver cómo crear el formulario básico, (insertar campos y botones en el formulario y
validarlos), pero no la parte de tratamiento de los datos, ya que para ello se necesitan nociones de
programación, ya sea en SQL, en JavaScript o en otro lenguaje de programación, y esto no entra
en los objetivos de esta lección.
Un formulario está formado, entre otras cosas, por etiquetas, campos de texto, menús
desplegables, y botones.
ELEMENTOS DE FORMULARIO
Los elementos de formulario pueden insertarse en una página a través del menú Insertar, opción
Objetos de formulario. A través de esta opción se puede acceder a la lista de todos los objetos de
formulario que pueden ser insertados en la página. Vamos a ver uno por uno algunos de los
distintos elementos que pueden formar parte de un formulario, así como algunas de sus
propiedades.
Campo de texto y Área de texto: Permiten añadir un cuadro de texto. El Campo de texto solo
permite escribir una línea al usuario, mientras que el Área de texto permite escribir varias. Se
puede pasar de Campo de texto a Área de texto a través del inspector de propiedades. También
es posible definirlo como Contraseña. A continuación tienes un ejemplo de cada uno de estos
tres tipos.
A través del inspector de propiedades es posible asignar también el ancho del cuadro de texto, el
número máximo de líneas o caracteres, y el valor inicial del cuadro.
Botón: Es el botón tradicional. El botón puede tener asignadas tres opciones: Enviar formulario,
Restablecer formulario (borrar todos los campos del formulario), o Ninguna (para poder
asignarle un comportamiento diferente de los dos anteriores).
UNIVERSIDAD REGIONAL AUTONOMA DE LOS ANDES
“UNIANDES”
También es posible cambiar el texto del botón, a través del campo Etiqueta del inspector de
propiedades.
Botón de opción: Es un pequeño botón redondo que puede activarse o desactivarse. Si hay
varios del mismo formulario, solo puede haber uno activado. Cuando se activa uno,
automáticamente se desactivan los demás.
Lista/Menú: Una lista o menú es un elemento de formulario que lleva asociada una lista de
opciones. Los elementos se añaden a través de botón Valores de lista del inspector de
propiedades. Cuando se trata de un menú, solo es posible elegir uno de los elementos, pero si se
trata de una lista, a través de Selecciones puede permitirse que se seleccionen varios
simultáneamente.
Etiqueta: Se utiliza para ponerle nombres al resto de elementos de formulario, para que el
usuario pueda saber qué datos ha de introducir en cada uno de ellos.
CREAR FORMULARIOS
Puedes crear formularios a través del menú Insertar, opción Formulario. Una vez creado un
formulario, este aparecerá en la ventana de Dreamweaver como un recuadro formado por líneas
rojas discontinuas, similar al de la imagen de siguiente.
UNIVERSIDAD REGIONAL AUTONOMA DE LOS ANDES
“UNIANDES”
Dentro de dicho formulario se podrán insertar los elementos de formulario, que como ya sabes
puedes insertarlos a través del menú Insertar, opción Objetos de formulario.
Es muy recomendable utilizar tablas para organizar los elementos de los formularios. Utilizando
tablas se consigue una mejor distribución de los elementos del formulario, lo que facilita su
comprensión y mejora su apariencia.
VALIDAR FORMULARIOS
La validación de formularios sirve para hacer que Javascript valide el formulario antes de que se
envié el formulario, para que en el caso de que hayan campos del formulario que sean
obligatorios, tengan que rellenarse antes de poder enviarse.
Para validar un formulario hay que abrir el panel de Comportamientos. Este panel se puede abrir
a través del menú Ventana, opción Comportamientos, o pulsando Mayús+F3.
En el este panel hay que desplegar el botón pulsando sobre él, y en Mostrar eventos para elegir
una versión de las actuales de entre la lista de navegadores. Por ejemplo, puedes elegir el
navegador IE 6.0. Después de esto, hay que volver a desplegar el botón, y pulsar sobre la opción
Validar formulario.
UNIVERSIDAD REGIONAL AUTONOMA DE LOS ANDES
“UNIANDES”
Entonces se mostrará una ventana como la siguiente, donde aparecen todos los elementos del
formulario.
Puede seleccionarse uno por uno cada elemento del formulario, pudiendo especificar los
requisitos que ha de cumplir. Puede establecerse como campo a rellenar obligatoriamente, y si su
contenido ha de ser numérico, una dirección de correo electrónico, etc.
CREAR PÁGINAS
Ahora que ya tenemos nuestro sitio creado vamos a entrar en DW, dándole clic en PHP.
Y se presentara una pantalla donde se podrá visualizar el área de trabajo con todas sus barras.
UNIVERSIDAD REGIONAL AUTONOMA DE LOS ANDES
“UNIANDES”
Para guardar nuestra página hacemos clic en la Pestaña Archivo de la barra de herramientas
luego presionar en Guardar Como
Se podrá observar que aparecerá una pantalla en donde se deberá poner el nombre de la página,
el tipo de archivo y la ubicación donde será guardara la página.
En el área de trabajo podremos insertar: formularios, tablas, imágenes, botones, texto etc. con las
diferentes opciones de las pestañas de la barra de menú.
UNIVERSIDAD REGIONAL AUTONOMA DE LOS ANDES
“UNIANDES”
Posterior damos clic en Hipervínculo que se encuentra en la pestaña Común de la barra del
menú.
UNIVERSIDAD REGIONAL AUTONOMA DE LOS ANDES
“UNIANDES”
Daremos clic en la carpeta que sale en el cuadro de texto, con el fin de seleccionar el archivo con
que queremos vincular y después presionar Aceptar.
Para visualizar como está quedando nuestra página, presionamos F12 para verla mediante el
explorador.
Seleccionamos la caja de texto en la cual vamos a validar los datos que se digiten.
UNIVERSIDAD REGIONAL AUTONOMA DE LOS ANDES
“UNIANDES”
Una vez seleccionada la opción anterior se activaran las propiedades del Campo de Texto de
Spry, en donde se deberá escoger y activar las diferentes opciones de acuerdo a nuestra
necesidad.
UNIVERSIDAD REGIONAL AUTONOMA DE LOS ANDES
“UNIANDES”
INSERTAR DATOS
El formulario no debe cumplir ningún requisito especial, únicamente el atributo action debe
apuntar al script que procesará la información.
<?php
// Primero comprobamos que ningún campo esté vacío y que todos los campos existan.
if(isset($_POST['titulo']) && !empty($_POST['titulo']) &&
isset($_POST['contenido']) && !empty($_POST['contenido'])) {
Esta es la forma más sencilla de insertar datos en una base de datos MySQL y en la mayoría de
casos, seguirá este esquema. Se puede mejorar alguna cosa, como por ejemplo asegurarse de que
UNIVERSIDAD REGIONAL AUTONOMA DE LOS ANDES
“UNIANDES”
las comillas que se inserten vienen "escapadas", es decir, de esta forma (') para evitar problemas
con MySQL.
ACTUALIZAR DATOS
Este código nos sirve para seleccionar los datos del formulario para luego poderlos modificar en
la base de datos de mysql desde un formulario en php.
<?php
$cn=mysql_connect("localhost","user","clave")or die("Error conexion MySQL");
$db=mysql_select_db("tabla",$cn)or die("No existe BD");
$query=mysql_query("SELECT 1 FROM calendario WHERE 1 AND `date` LIKE
CURDATE()")or die("Error consulta");
$n=mysql_num_rows($query);
if($n)
{
while($campo=mysql_fetch_array($query))
{
echo "<FORM METHOD=POST ACTION='graba.php'>";
echo "---------------------------";
echo "<br>Visitante: <INPUT TYPE='hidden' NAME='visitante'
VALUE='".$campo['visitante']."'>".$campo['visitante'];
echo "<br>Carreras Visitante: <INPUT TYPE='text' NAME='carrerasv'
VALUE='".$campo['carrerasv']."'>";
echo "<br>Home Club: <INPUT TYPE='hidden' NAME='homeclub'
VALUE='".$campo['homeclub']."'>".$campo['homeclub'];
echo "<br>Carreras Home Club: <INPUT TYPE='text' NAME='carrerashc'
VALUE='".$campo['carrerashc']."'>";
echo "<br><INPUT TYPE='submit' value='Grabar'> <br>";
echo "---------------------------<br>";
echo "</FORM>";
}
}
else
{
}
?>
Una vez seleccionados los datos procedemos actualizar los datos con la siguiente sentencia de
mysql.
<?php
$carrerasv=$_POST['carrerasv'];
UNIVERSIDAD REGIONAL AUTONOMA DE LOS ANDES
“UNIANDES”
$carrerashc=$_POST['carrerashc'];
//////////////
$cn=mysql_connect("localhost","user","clave")or die("Error conexion MySQL");
$db=mysql_select_db("tabla",$cn)or die("No existe BD");
$query=mysql_query("UPDATE calendario SET carrerasv='$carrerasv',carrerashc='$carrerashc'
WHERE 1 AND `date` LIKE CURDATE() AND `id`='$id'");
if($query)
{
echo "Actualizacion OK ! ";
}
else
{
echo " No hubo actualizacion";
}
?>
ELIMINAR DATOS
Con la siguiente sentencia nos ayuda a eliminar datos
<?php
tu_conexion(); //nombre de la conexión para opder acceder a los datos
$consulta = "DELETE FROM tu_tabla WHERE id = ('$cadena')";
$resultado = mysql_query($consulta);
echo "Los datos ha sido eliminados.";
?>