Home MundoTec Software Código fuente Tutorial / pdf Minijuegos

2022

CODIGO FUENTE para conexión base de datos MySQL en PHP con archivos HTML y formato gráfico con CSS.

Esta vez desarrollaremos un código Fuente en PHP, CSS, y HTML, para conectarse a una base de datos MySQL desde el navegador web. Esto es muy útil para pasar de sitios web estáticos a dinámicos, ya que permite configurar bases de datos en sitios web, logrando almacenar datos por los usuarios, y procesar y almacenar datos por el propio código del sitio web.

Primero es necesario configurar la PC desarrollo para que pueda interpretar PHP, MySQL y otras aplicaciones. Esto lo logramos instalando la aplicación XAMPP en nuestra PC para Windows, Linux, o OS X. Esta aplicación instalará Apache, MySQL, e interpretes de PHP y Perl, y gran parte de su configuración. Una vez configurado e iniciado el server Apache, y MySQL, estaremos en condiciones de ejecutar código fuente PHP y HTML en nuestro "localhost" del navegador web que se ejecuta.
Para el ejemplo haremos un pequeño formulario de ingreso de nuevos usuarios y su registro a una base de datos. Primero generamos un form, en el ejemplo con un archivo llamado "registro.htm", en donde se indiquen los datos de registro del usuario, que se van a redirigir al archivo "registro.php" con el método "post", como el siguiente:

|<form action="registro.php" method="post">
|<table border="0">
|
| <tr>
| <td><label>Nombres</label></td>
| <td><input type="text" name="nombreuser" placeholder="Nombres" required/></td>
| </tr>
| <tr>
| <td><label>Apellidos</label></td>
| <td><input type="text" name="apellidosuser" placeholder="Apellidos" required/></td>
| </tr>
| <tr>
| <td><label>Correo electronico</label></td>
| <td><input type="text" name="emailuser" placeholder="example@mail.com" required/></td>
| </tr>
| <tr>
| <td><label>Contraseña</label></td>
| <td><input type="password" name="pass" placeholder="**********************" required/></td>
| </tr>
| <tr>
| <td><label>Repetir Contraseña</label></td>
| <td><input type="password" name="rpass" placeholder="**********************" required/></td>
| </tr>
| <tr>
| <td><label><input type="submit" value="Registrarme"></input></label></td>
| <td><label><input type="reset" value="Reestablecer"></input></label></td>
| </tr>
|
|</table>
|</form>

Hecho el formulario, es hora de crear la base de datos por medio de MySQL. Luego de instalar XAMPP e iniciar el servicio, se coloca "localhost/phpmyadmin" en la dirección de tu navegador web y si todo está bien configurado se iniciará el Administrador de bases de datos de MySQL. Por medio de esta interface gráfica creas las bases de datos y tablas necesarias para corresponder exactamente con los campos y tipo de datos que se muestran el el Form codificado mas arriba. En mi ejemplo, cree un "id" como Clave primaria "autoincrementable", para generar la identificación inequívoca de cada registro de usuario en la tabla, dando consistencia de datos en lo que es la teoría de estructura de datos de bases de datos. Yo le coloque el nombre "usuariosreg" y una tabla "datos" con una estructura de datos que respeta el form codificado según el ejemplo, como muestra las dos imágenes siguientes. En la primera verás la interface de phpMyAdmin, y la segunda, es un zoom en detalle la estructura de datos de la tabla "datos" en donde falta que muestre el atributo de "autoincrementable" del "id":

Esto replicará la estructura de bases de datos en forma local en la PC desarrollo, que luego tendrás que duplicar en el hosting que uses. Seguramente tendrás que reconfigurar algunos nombres de usuario y contraseñas de acceso romoto de bases de datos en el momento de configurar en el hosting. En forma local tendrás que manejar todos los archivos dentro de la carpeta "htdocs" configurada por XAMPP, y si lo haces sobre linux, tendrás que manejar permisos de usuario root para poder modificar esos archivos ya que están fuera de la Carpeta de Usuario de, por ejemplo la distribución Ubuntu, de Linux. También sará importante siempre llamar a "localhost" desde el navegador web que utilices, sea cual sea tu sistema operativo, para tener los permisos suficientes en los scripts que ejecutes.
Concluido esto, pasamos a los archivos PHP que generarán la conexión de la bases de datos y guardado de datos. En el ejemplo, serán dos archivos "registro.php" y "db.php". El primero toma los datos del form anterior y los registra, el segundo archivo genera la conexión a la base de datos. Es importante que la conexión se realice en un archivo a parte para tener codificación estructurada y modular, y se pueda acceder desde cualquier lugar de la aplicación. Luego por medio de consultas SQL se realizan todas las operaciones posibles en la bases de datos de consultas y edición, hasta cambios en la estructura y creación de bases de datos.

Archivo "registro.php":

|<?php
|
| include_once('db.php');
|
| //obtenemos los valores del formulario
| $nombres = $_POST['nombreuser'];
| $apellidos = $_POST['apellidosuser'];
| $email = $_POST['emailuser'];
| $pass = $_POST['pass'];
| $rpass = $_POST['rpass'];
|
| //se confirma la contraseña
| if ($pass != $rpass) {
| die('Las contraseñas ingresadas no coinciden. Verificar.<br><br><a href="registro.htm">Volver</a>');
| }
| //se encripta la contraseña
| $contrasenaUser = md5($pass);
|
| $conectar = usuariosregconn();
|
| $consultasql = "INSERT INTO datos (nombres, apellidos, email, password)
| VALUES ('$nombres','$apellidos','$email','$contrasenaUser')";
| $resultado = mysqli_query($conectar, $consultasql)
| or trigger_error("Consulta registracion SQL fallo - Error: ".mysqli_error($conectar), E_USER_ERROR);
|
|
| echo "los datos registrados son: <br>";
| echo "$nombres, $apellidos, $email";
|
|?>

Archivo "db.php":

|<?php
|
| function usuariosregconn(){
|
| // Variables
| $hostname = "localhost";
| $usuariodb = "root";
| $passdb = "";
| $dbname = "usuariosreg";
|
| //conexion con la base de datos y el servidor
| $conexion = mysqli_connect($hostname, $usuariodb, $passdb, $dbname);
| return $conexion;
|
| }
|
|?>

Con todo eso y la correcta codificación y ejecución de estos archivos se producira la conexión y edición de la base de datos. A continuación podrás descargar, en un archivo comprimido, los archivos "registro.htm", "registro.php", y "db.php", incluido un "style.css" que le da formato al archivo "htm" para mejor presentación, que vos mismo podrás probar y desarrollar. ¿Qué tal, pudiste conectar tu primera base de datos en PHP?

Descargar CODIGO FUENTE conexión base de datos con PHP MySQL HTML y CSS