Your cart is empty.
Keep shopping
Teach on Udemy
Turn what you know into an opportunity and reach millions around the world.
Learn MoreCrea una tienda virtual con PHP y MySQL con el patrón MVC
Rating: 4.6 out of 54.6(196 ratings)
4,033 students
Crea una tienda virtual con PHP y MySQL con el patrón MVC
Conecta la aplicación a Paypal.
Created byFrancisco Javier Arce Anguiano
Last updated 4/2024
Spanish
What you'll learn
- Creará la maqueta de la tienda virtual responsiva por medio del Bootstrap 4.
- Desarrollar el front-end del usuario hasta cerrar la venta.
- Conectar el carrito de compras con Paypal.
- Utilizará el editor CKeditor.
- Creará GoogleChart para realizar la gráfica de ventas.
- Utilizará el patrón de diseño MVC.
Explore related topics
Course content
11 sections • 133 lectures • 21h 21m total length
- Bienvenida al curso3:46
Una aplicación que es muy recurrente en Internet es el desarrollo de una Tienda Virtual. Nos sirve para utilizar lenguajes del lado del cliente, como JavaScript y lenguajes del lado del servidor como PHP, así como conectarlo con bases de datos, en este caso como MySQL, herramientas que son las más utilizadas en la Web. En este curso construiremos las páginas web por medio de Bootstrap. lo cual nos permitirá tener una aplicación responsiva.
Partiremos desde una página completamente en blanco hasta concluir la parte del usuario (front-end) y la parte del administrador (back-end). Los objetivos del presente curso son:
Desarrollar la maqueta responsiva de la tienda virtual con Bootstrap
Conectar la maqueta con una base de datos
Crear el registro del usuarios, su firma en el sistema y el cambio de la clave de acceso
Construir el carrito de compras y el ciclo de la venta
Crear la parte administrativa o back-end de la aplicación
Este curso intermedio, por lo que usted debe tener las bases de programación en Bootstrap, PHP, JavaScript y MySQL, aunque no debe de ser experto en ellos. Es una buena oportunidad para poner en práctica sus conocimientos. Usted debe de contar con una instalación de Apache-PHP-MySQL, como XAMPP, MAMP p WAMP.
Al final del curso contarás con todos los archivos del curso y los esquemas de la base de datos.
- Antes de empezar el curso...8:04
Antes de empezar veremos la forma de preguntar para acortar los tiempos de respuesta y el software necesario para tomar el curso.
- Plugins para SublimeText y PHP (opcional)6:34
Entrar a packagecontrol.io
Abrir la consola (view > show console).
Copiar el código en la consola y ejecutarlo.
Cerrar y abrir sublime text.
[Ctrl]-[shift]-[p] o tools > command palette
Escribimos
Install packages > sublime lint > detecta problemas de sintaxis.
Install packages > phpcs
- Documentar con el estándar PHPDoc5:24
PHPDocs es una adaptación de JavaDocs para documentar la programación en PHP.
- Definiciones preliminales sobre el patrón de diseño MVC8:07
El patrón de diseño (de software) MVC se encarga de separar la “lógica de negocio” de la “interfaz de usuario” y es el más utilizado en aplicaciones web, ya que facilita la funcionalidad, mantenibilidad, y escalabilidad del sistema.
- Crear las carpetas para el patrón MVC11:09
MVC divide las aplicaciones en tres niveles de abstracción:
Modelo: es la lógica de negocios. Es decir las clases y métodos que se comunican directamente con la base de datos.
Vista: es la encargada de mostrar la información al usuario, con de forma gráfica y legible.
Controlador: el intermediario entre la vista y el modelo, se encarga de controlar las interacciones del usuario en la vista, pide los datos al modelo y los devuelve de nuevo a la vista para que esta los muestre al usuario. Es decir las llamadas a clases y métodos, y los datos recibidos de formularios.
- Crear la base de datos para el sistema de eCommerce13:46
El funcionamiento básico del patrón MVC, puede resumirse en:
El usuario realiza una petición.
El controlador captura la petición.
Hace la llamada al modelo correspondiente.
El modelo será el encargado de interactuar con la base de datos.
El controlador recibe la información y la envía a la vista.
La vista muestra la información.
- Crear los archivos .htaccess11:25
El patrón de diseño (de software) MVC se encarga de separar la “lógica de negocio” de la “interfaz de usuario” y es el más utilizado en aplicaciones web, ya que facilita la funcionalidad, mantenibilidad, y escalabilidad del sistema.
- Crear la clase de control10:28
MVC divide las aplicaciones en tres niveles de abstracción:
Modelo: es la lógica de negocios. Es decir las clases y métodos que se comunican directamente con la base de datos.
Vista: es la encargada de mostrar la información al usuario, con de forma gráfica y legible.
Controlador: el intermediario entre la vista y el modelo, se encarga de controlar las interacciones del usuario en la vista, pide los datos al modelo y los devuelve de nuevo a la vista para que esta los muestre al usuario. Es decir las llamadas a clases y métodos, y los datos recibidos de formularios.
- Crear la primer clase controlador13:47
El funcionamiento básico del patrón MVC, puede resumirse en:
El usuario realiza una petición.
El controlador captura la petición.
Hace la llamada al modelo correspondiente.
El modelo será el encargado de interactuar con la base de datos.
El controlador recibe la información y la envía a la vista.
La vista muestra la información.
- Crear una clase base para las clases controladoras8:12
El patrón de diseño (de software) MVC se encarga de separar la “lógica de negocio” de la “interfaz de usuario” y es el más utilizado en aplicaciones web, ya que facilita la funcionalidad, mantenibilidad, y escalabilidad del sistema.
- Llamar al método enviado en la URL7:23
MVC divide las aplicaciones en tres niveles de abstracción:
Modelo: es la lógica de negocios. Es decir las clases y métodos que se comunican directamente con la base de datos.
Vista: es la encargada de mostrar la información al usuario, con de forma gráfica y legible.
Controlador: el intermediario entre la vista y el modelo, se encarga de controlar las interacciones del usuario en la vista, pide los datos al modelo y los devuelve de nuevo a la vista para que esta los muestre al usuario. Es decir las llamadas a clases y métodos, y los datos recibidos de formularios.
- Recuperar los parámetros enviados desde la URL8:44
El funcionamiento básico del patrón MVC, puede resumirse en:
El usuario realiza una petición.
El controlador captura la petición.
Hace la llamada al modelo correspondiente.
El modelo será el encargado de interactuar con la base de datos.
El controlador recibe la información y la envía a la vista.
La vista muestra la información.
- Crear las clases del Modelo y de la vista.9:09
El patrón de diseño (de software) MVC se encarga de separar la “lógica de negocio” de la “interfaz de usuario” y es el más utilizado en aplicaciones web, ya que facilita la funcionalidad, mantenibilidad, y escalabilidad del sistema.
- Introducción a los procesos y clases involucradas en el Login al sistema2:23
El proceso de entrada tendrá los procesos de recuérdame, cambiar la clave de acceso y olvido de la clave, donde mandaremos un correo al usuario para que cambie su clave de acceso.
- Crear la vista del login con Bootstrap 49:54
Bootstrap es una de las herramientas más utilizadas para crear los layout o formato, multiplataforma y responsiva.
- Crear el formulario del login con Bootstrap 410:21
Crearemos un formulario en base a Bootstrap 4 para la entrada o login a nuestro sistema,
- Crear otras vistas desde la vista creada en el login7:28
A partir de una vista, comenzaremos a crear otras vistas, práctica que realizaremos en varias ocasiones a lo largo del curso.
- Crear la vista del registro del usuario al sistema de eCommerce11:41
En esta clase armaremos un formulario para que el usuario se registre en nuestra aplicación. Aunque en este curso venderemos productos virtuales, pero podemos cambiarlo a la venta de productos físicos sin mayor problema.
- Crear una constante para la RUTA del sistema8:46
Crearemos una constante para mantener la ruta de nuestras rutas de los recursos a lo largo del desarrollo de la aplicación.
- Validar los datos del formulario de registro de usuario9:11
Un punto fundamental de cualquier sistema es la validación de los datos, ya que es nuestra "linea de defensa" para asegurarnos el correcto funcionamiento del mismo. Recuerda que "basura entra, basura sale" o G.I.G.O.
- Manejo de errores de la validación del registro de usuario12:27
Tan importante como validar los datos del usuario es comunicarle los errores. En esta clase programaremos la forma de hacerlo.
- Insertar los datos y encriptar la clave de acceso, primera parte9:55
En esta clase insertaremos los datos del usuario y encriptaremos su clave de acceso para que no lo podamos "hackearla" incluso aunque la veamos en la base de datos.
- Insertar los datos y encriptar la clave de acceso, segunda parte8:26
En esta clase concluiremos el proceso de inserción y encriptación de la clave de acceso.
- Crear una vista genérica para enviar un mensaje al usuario12:50
En esta clase construiremos una vista genérica que nos servirán para enviar mensajes de diferentes tipos para comunicarnos con el usuario.
- Iniciar el proceso de olvido de la clave de acceso14:54
En esta clase iniciaremos el proceso de "olvido", cuando al usuario se le olvida su clave y le enviaremos un correo electrónico para que cambie la misma.
- Enviar un correo electrónico para el cambio de la clave de acceso12:37
En esa clase realizaremos el envío del correo electrónico al usuario para que cambie la clave de acceso.
- La vista para el cambio de la clave de acceso11:38
En esta clase realizaremos la vista para que el usuario cambie su clave de acceso.
- Crear un campo oculto para el identificador del usuario8:12
Un punto importante es contener un campo oculto con el identificador del usuario para efectuar las validaciones.
- Actualización de la nueva clave de acceso8:17
En esta clase realizaremos la vista para la captura de la nueva clave de acceso del usuario.
- El proceso de validar la clave de acceso10:53
En esta clase realizaremos el proceso de validación de la nueva clave de acceso del usuario.
- Concluir la validación del usuario y su clave de acceso9:30
En esta clase concluiremos la validación del usuario y su clave de acceso.
- Crear las clases de acceso a la tienda6:49
En esta clase crearemos las clases de acceso del usuario a la tienda virtual.
- Crear la rutina para recordar los datos con Cookies10:05
En esta clase crearemos la rutina para recordar los datos por medio de las galletas o cookies.
- Crear la clase de la sesión10:47
En esta clase crearemos la clase para el manejo de las sesiones a lo largo de la aplicación.
- Introducción a los procesos administrativos2:22
Crear el controlador administrativo
Crear el controlador de inicio administrativo
Crear el controlador de usuarios administrativos
- Iniciar el módulo administrativo8:30
Crear el controlador administrativo
Crear el controlador de inicio administrativo
Crear el controlador de usuarios administrativos
- Crear la tabla para los usuarios administrativos11:45
id
nombre
correo
clave
status
baja
login_dt
baja_dt
creado_dt
modificado_dt
- Iniciar el CRUD para los usuarios administrativos9:40
CRUD: Create, Read, Update, Delete
- Verifica los datos del usuario administrativo10:01
En esta clase verificaremos los datos del formulario de registro para el usuario administrativo.
- Encriptar la clave de acceso del usuario administrativo8:49
En esta clase encriptaremos también la clave de acceso del usuario administrativo.
- Validar los datos del usuario administrativo8:59
En esta clase validaremos los datos del usuario administrativo.
- Crear el login para el módulo administrativo19:49
En esta clase crearemos el login para el usuario administrativo.
- Crear una sesión de usuario para el módulo administrativo4:10
En esta clase realizaremos la sesión del usuario administrativo.
- Mostrar la información de la tabla de usuarios administrativo y desplegarlos10:56
En esta clase mostraremos la información de la tabla de usuarios administrativo y desplegarlos
- Crear la vista para modificar los registros de usuarios administrativos8:29
En esta clase crearemos la vista para modificar los registros de usuarios administrativos
- Crear una tabla para almacenar llaves de uso múltiple10:27
En esta clase crearemos una tabla para almacenar llaves de uso múltiple
- Desplegar los datos y enviarlos al controlador8:12
En esta clase Desplegar los datos y enviarlos al controlador.
- Validar los datos del formularios antes de insertarlos11:32
En esta clase validaremos los datos del formularios antes de insertarlos.
- Crear el proceso de modificación de los datos en la tabla8:26
En esta clase crearemos el proceso de modificación de los datos en la tabla.
- Crear la vista de advertencia antes de la baja lógica10:29
En esta clase crearemos la vista de advertencia antes de la baja lógica.
- Ejecutar la baja lógica del registro12:10
En esta clase ejecutaremos la baja lógica del registro.
- Introducción al manejo de los productos desde el administrador4:59
En esta clase veremos la introducción al manejo de los productos desde el administrador
- Crear las clases básicas del Modelo, vista y controlador de los productos7:38
En esta clase crearemos las clases básicas del Modelo, vista y controlador de los productos
- Crear la vista de la carátula de los productos8:31
Crear las clases básicas del Modelo, vista y controlador de los productosEn
- Crear la vista de alta del producto13:14
En esta clase crearemos la vista de alta del producto
- Alternar los campos dependiendo el tipo de productos11:11
En esta clase alternaremos los campos dependiendo del tipo de producto, libro o curso.
- Validar un rango numérico8:53
En esta clase validaremos un rango numérico.
- Manejo de las imágenes y las fechas9:22
En esta clase manejaremos las imágenes y las fechas del producto.
- Manejo de catálogos y validación de las cajas de verificación8:33
En esta clase crearemos y manejaremos los catálogos y validaremos las cajas de verificación.
- Añadir el editor CKeditor a nuestro formulario6:17
En esta clase añadiremos el editor CKeditor a nuestros formularios.
- Recibir los datos de la vista al controlador9:10
En esta clase recibiremos los datos de la vista al controlador.
- Validar cadenas del formulario13:43
En esta clase validaremos las cadenas del formulario.
- Validar los campos numéricos del formulario10:06
En esta clase validaremos los campos numéricos del formulario.
- Validar la fecha del formulario9:48
En esta clase validaremos las fechas del formulario.
- Validación de las cajas de verificación10:24
En esta clase validaremos las cajas de verificación de nuestro formulario.
- Subir una imagen de la computadora del usuario al servidor10:05
En esta clase subiremos una imagen de la computadora del usuario al servidor.
- Validar la imagen y optimizarla13:44
En esta clase validaremos la imagen y la optimizaremos.
- Validar que el archivo que suba el usuario sea una imagen14:54
En esta clase validaremos que el archivo que suba el usuario sea una imagen de tipo jpg o png .
- La librería GD en versiones 8+3:04
A partir de la versión 8.0 debemos de activar la librería GD para manipular las imágenes con PHP. Anteriormente venía activada :(
- Insertar los valores validados en la tabla correspondiente10:17
En esta clase insertaremos los valores validados en la tabla de productos.
- Manejo de errores en la Alta del producto13:07
En esta clase manejaremos los errores en el alta del producto.
- Desplegar los productos de la tabla en la vista de carátula11:02
En esta clase desplegaremos los productos en una tabla en la vista.
- Añadir un campo oculto con el número de identificador del producto en la vista12:34
En esta clase añadiremos un campo oculto en el formulario de los productos.
- Crear la vista para modificar los datos del producto8:10
En esta clase crearemos la vista para modificar los datos de la vista del producto
- Modificar el registro del producto en la tabla de la base de datos10:12
En esta clase
- Crear una vista de advertencia antes de hacer la baja lógica de un producto14:57
En esta clase crearemos una vista de advertencia antes de hacer la baja lógica de un producto
- Realizar la baja lógica del producto9:25
En esta clase realizaremos la baja lógica del producto
- Crear el menú para las opciones de la tienda virtual11:40
En esta clase crearemos el menú para las opciones de la tienda virtual
- Crear el proceso de salida o logout del sistema5:09
En esta clase crearemos el proceso de salida o logout del sistema
- Desplegar los productos más vendidos en la caratula de la tienda15:09
En esta clase desplegaremos los productos más vendidos en la caratula de la tienda
- Envío de la información para desplegar el producto seleccionado7:11
En esta clase enviaremos la información para desplegar el producto seleccionado
- Crear la vista del producto a desplegar7:39
En esta clase crearemos la vista del producto a desplegar.
- Desplegar la información de los productos según su tipo14:18
En esta clase desplegaremos la información de los productos según su tipo.
- Dar de alta cursos en línea, otro tipo de producto9:17
En esta clase daremos de alta cursos en línea, otro tipo de producto
- Crear una sección de productos nuevos en la carátula de la tienda9:36
En esta clase crearemos una sección de productos nuevos en la carátula de la tienda
- Crear la vista para los cursos en línea11:53
En esta clase crearemos la vista para los cursos en línea
- Crear la vista para los libros7:07
En esta clase crearemos la vista para los libros.
- Crear la vista para la opción "sobre mi"6:37
En esta clase crearemos la vista para la opción "sobre mi"
- Crear la vista para el "contacto"10:42
En esta clase crearemos la vista para el "contacto"
- Enviar un correo electrónico de la vista del contacto16:23
En esta clase enviaremos un correo electrónico de la vista del contacto
- Crear la vista para buscar productos8:13
En esta clase
- Desplegar los productos buscados11:36
En esta clase crearemos la vista para buscar productos
- Los conceptos generales para la creación del carrito de compras7:06
En esta clase revisaremos los conceptos generales para la creación del carrito de compras
- Crear las clases para el manejo del carrito de compras11:01
En esta clase
- Añade un registro al carrito9:40
En esta clase crearemos las clases para el manejo del carrito de compras
- Crear la vista del carrito de compras, primera parte13:04
En esta clase crearemos la vista del carrito de compras, primera parte
- Crear la vista del carrito de compras, segunda parte11:52
En esta clase crearemos la vista del carrito de compras, segunda parte
- Crear una tabla en la vista para desplegar los totales del carrito de compras11:44
En esta clase crearemos una tabla en la vista para desplegar los totales del carrito de compras
- Leer los registro del carrito de la base de datos y desplegarlos10:39
En esta clase leeremos los registro del carrito de la base de datos y desplegarlos
- Actualiza el carrito de compras11:50
En esta clase actualizaremos el carrito de compras
- Crear un botón para visualizar el carrito de compras14:49
En esta clase crearemos un botón para visualizar el carrito de compras
- Borrar un producto del carrito de compras6:41
En esta clase borraremos un producto del carrito de compras
- Crear la vista para el checkout del proceso de cierre12:47
En esta clase crearemos la vista para el checkout del proceso de cierre
- Crear una vista para verificar los datos de envío del proceso de compra6:44
En esta clase crearemos una vista para verificar los datos de envío del proceso de compra
- Crear la vista para seleccionar la forma de pago de la compra7:50
En esta clase crearemos la vista para seleccionar la forma de pago de la compra
- Crear una vista para verificar los datos de envío antes del cierre de la compra11:52
En esta clase crearemos una vista para verificar los datos de envío antes del cierre de la compra
- Crear una vista para agradecer la compra una vez cerrada la venta16:05
En esta clase crearemos una vista para agradecer la compra una vez cerrada la venta
- Crear una vista para las ventas desde el administrador11:10
En esta clase haremos los siguientes pasos:
Modificar el algoritmo de cierraCarrito()
Modificar la clase Sesion()
Crear el método ventas() en el controlador Carrito()
Crear el método ventas() en el modelo carritoModelo()
Modificar el menú administrativo en encabezado.php
- Leer los registros del las ventas efectuadas10:51
En esta clase efectuaremos los siguientes pasos:
Modificar el algoritmo de cierraCarrito()
Modificar la clase Sesion()
Crear el método ventas() en el controlador Carrito()
Crear el método ventas() en el modelo carritoModelo()
Modificar el menú administrativo en encabezado.php
Crear la vista de ventas método cierraCarrito()
- Crear la vista de ventas en el administrador7:23
En esta clase realizaremos los siguientes pasos:
Modificar el algoritmo de cierraCarrito()
Modificar la clase Sesion()
Crear el método ventas() en el controlador Carrito()
Crear el método ventas() en el modelo carritoModelo()
Modificar el menú administrativo en encabezado.php
Crear la vista de ventas
- Activar el botón de vista del detalle de la venta7:53
El esta clase realizaremos los siguientes pasos:
Crear un método detalle() en el controlador Carrito().
Recibir la fecha y el identificador del usuario.
Buscar por fecha, identificador el carrito ya cerrado.
Crear la vista y regresar a la vista de ventas.
- Leer los datos para generar la gráfica de ventas5:41
Crear un método grafica() en el controlador Carrito().
Crear un método ventasxdia() en el modelo carritoModelo().
Crear y llamar la vista admonVentasGraficaVista.php
Crear la gráfica
- Crear la estructura MVC para desplegar la gráfica10:57
Crear un método grafica() en el controlador Carrito().
Crear un método ventasxdia() en el modelo carritoModelo().
Crear y llamar la vista admonVentasGraficaVista.php
Crear la gráfica
- Crear la gráfica de ventas por día13:26
En esta clase crearemos la gráfica de ventas por día
- Cambiar el aspecto de la gráfica con las opciones7:09
En esta clase cambiaremos el aspecto de la gráfica con las opciones
- Crear la cuenta de Paypal y su botón5:32
En esta clase crearemos la cuenta de Paypal y el botón para lanzar el pago con este sistema de pago.
- Respaldar la base de datos: tablas9:22
Realizaremos un proceso de respaldo de cada una de las tablas en un archivo SQL que pueda ser importado más tarde en una base de datos MySQL.
- Respaldar la base de datos: obtener los campos12:14
Necesitamos saber los números de campos o columnas de la tabla, así como el número de registros de la tabla.
- Respaldar la base de datos: create table y estructura de ciclos10:28
Para respaldar la información utilizaremos la sentencia INSERT de varios registros.
Usaremos grupos de 100 registros.
- Respaldar la base de datos: crear las sentencias Insert9:02
Para respaldar la información utilizaremos la sentencia INSERT de varios registros.
Usaremos grupos de 100 registros.
- Respaldar la base de datos: cerrar el archivo8:04
Crearemos los enunciados finales para cerrar el archivo.
- Respaldar la base de datos: mensaje de finalización10:25
Haremos un mensaje de finalización y prueba de nuestros archivos.
- favicon3:23
Añadiremos un favicon al sistema.
- Herramientas de visualización y constantes9:48
Crear una clase Auxiliar.
Crear una constante para la encriptación.
- Guía de instalación19:20
Contar con su servidor y dominio
Crear la base de datos
Importar la estructura de la base de datos
Actualizar las claves en los archivos (mySQLdb.php)
Compactar los archivos
Subir los programas.
Verificar los permisos de archivos y carpetas
Actualizar las rutas en la constante, el archivo CSS y JavaScript (si procede)
Actualizar los archivos .htaccess (muy importante).
- Seleccionar un color de una página web con colorZilla3:08
- Herramientas para encontrar colores armónicos10:21
Herramientas para encontrar colores armónicos
- Páginas para descargar fuentes e íconos6:59
Páginas para descargar fuentes e íconos
- Crear gradientes de forma sencilla por medio de dos herramientas10:14
Crear gradientes de forma sencilla por medio de dos herramientas
Requirements
- Conocimientos básicos de PHP y PHP orientado a objetos.
- Conocimientos básicos de HTML, CSS y JavaScript.
- Conocimientos básicos de Bootstrap (no indispensable).
Description
Una aplicación que es muy recurrente en Internet es el desarrollo de una Tienda Virtual. Nos sirve para utilizar lenguajes del lado del cliente, como JavaScript y lenguajes del lado del servidor como PHP, así como conectarlo con bases de datos, en este caso como MySQL, herramientas que son las más utilizadas en la Web. En este curso construiremos las páginas web por medio de Bootstrap 4. lo cual nos permitirá tener una aplicación responsiva.
Partiremos desde una página completamente en blanco hasta concluir la parte del usuario (front-end) y la parte del administrador (back-end). Los objetivos del presente curso son:
Desarrollar la maqueta responsiva de la tienda virtual con Bootstrap 4
Conectar la maqueta con una base de datos
Conectar la aplicación a Paypal.
Construir el carrito de compras y el ciclo de la venta
Construir la aplicación bajo el patrón de diseño MVC.
Este curso intermedio, por lo que usted debe tener las bases de programación en Bootstrap 4, PHP 7, JavaScript y MySQL, aunque no debe de ser experto en ellos. Es una buena oportunidad para poner en práctica sus conocimientos. Usted debe de contar con una instalación de Apache-PHP-MySQL, como XAMPP, MAMP p WAMP.
Al final del curso contarás con todos los archivos del curso y los esquemas de la base de datos.
Who this course is for:
- Desarrolladores web con conocimientos de PHP y MySQL