Your cart is empty.
Keep shopping
Teach on Udemy
Turn what you know into an opportunity and reach millions around the world.
Learn MoreDesarrollo de sistemas web en PHP 7 POO, MySQL, Jquery Ajax
Rating: 4.5 out of 54.5(2,873 ratings)
7,648 students
Desarrollo de sistemas web en PHP 7 POO, MySQL, Jquery Ajax
Diseña sistemas web en PHP Orientado Objetos, MariaDB (MySql), Jquery Ajax, HTML5 CSS3 Bootstrap INCLUYE PROYECTO FINAL
Created byJuan Carlos Arcila Díaz
Last updated 9/2020
Spanish
What you'll learn
- Diseñar la base de datos de su propio proyecto utilizando la herramienta MySQL WorkBench.
- Configuración un servidor Apache PHP MariaDB (MySQL).
- Conectar su base de datos MYSQL desde PHP.
- Diseñar para su sistema una plantilla web HTML y formularios responsive.
- Realizar el mantenimiento de las tablas (independientes y relacionadas) de su base de datos.
- Utilizar Jquery para manejar eventos y emplear la tecnología Ajax.
- Utilizar DataTables para mostrar el listado de los registros de sus tablas paginados y realizar filtros.
- Gestión de usuarios y accesos al sistema según los permisos asignados.
- Diseño de reportes para exportar la información.
- Publicar su PROYECTO en la nube.
Explore related topics
Course content
17 sections • 86 lectures • 12h 59m total length
- Introducción3:22
Hola Soy Juan Carlos Arcila Díaz Ingeniero de Sistemas, te doy la bienvenida a este curso donde aprenderás a desarrollar sistemas web paso a paso utilizando el lenguaje de programación PHP y la programación orientada a Objetos, como gestor de base de datos utilizaremos MariaBD (Mysql), para el diseño y la administración de la base de datos utilizaremos las herramientas MysqlWorkbench y PhpMyadmin, utilizaremos HTML5 y CSS3 para el diseño de las páginas web que conformarán nuestro proyecto, pero para hacer más fácil nuestro diseño web trabajaremos con el framework Bootstrap, revisaremos la librería JQuery y la tecnología Ajax para hacer dinámico nuestro proyecto web.
- Archivos y recursos incluidos en el curso0:42
Todos los archivos y recursos incluidos en este curso serán compartidos con ustedes a medida que vaya avanzando el curso.
Entre los archivos y recursos tenemos:
- Diseño y script de base de datos.
- Código fuente.
- Plantillas web: AdminLTE y otras.
- Librerías js y archivos Css
- Instalación de XAMPP, servidor Apache PHP MariaDB (MySQL)6:08
En esta clase instalaremos y configuraremos Xampp.
Xampp
Xampp es un paquete de instalación (Software libre) que incluye:
- Servidor Web Apache.
- Gestor de base de datos MaríaDB (MySQL).
- Intérprete para lenguajes de script: PHP y Perl.
- Desde la versión 5.6.15 Xampp cambio la base de datos MySQL a MariaDB.
- Instalación de sublimeText 3, editor de código2:34
En esta clase descargaremos e instalaremos nuestro editor de código fuente SublimeText 3.
SublimeText3
- Es un editor de texto y código fuente.
- SublimeText 3 no es software libre pero se puede descargar y evaluar sin fecha de caducidad
- Instalación de MysqlWorkbench, Herramienta de diseño de BD3:12
En esta clase descargaremos e instalaremos MySqlWorkBench que es una Herramienta visual de diseño, administración y mantenimiento de base de datos.
MySqlWorkBench Ofrece dos ediciones diferentes: Open Source y Comercial.
- PHPMyAdmin: Base de datos MariaDB (Mysql), tablas, definir campos, relaciones7:22
En esta clase revisaremos el gestor de base de datos MariaDB (MySql), crearemos una base de datos como ejemplo, implementaremos tablas y campos teniendo en cuenta los diferentes tipos de dato.
MariaDB (MySQL)
- Sistema de gestión de base de datos derivado de MySQL.
- Introduce dos motores de almacenamiento:
- Aria que reemplaza a MyISAM y
- XtraDB que reemplaza a InnoDB
- Tiene alta compatibilidad con MySQL.
- MariaDB es un fork directo de MySQL que asegura que permanecerá una versión de este producto con licencia GPL.
- PHPMyAdmin: usuarios de base de datos1:59
En esta clase revisaremos como crear usuarios de base de datos en el gestor MariaDB utilizando el administrador de base de datos PhpMyAdmin.
PhpMyAdmin
Herramienta escrita en PHP con la intención de manejar la administración de MySQL a través de páginas web.
Actualmente se puede crear y eliminar Bases de Datos, crear, eliminar y alterar tablas, borrar, editar y añadir campos, ejecutar cualquier sentencia SQL, administrar claves en campos, administrar privilegios, exportar datos en varios formatos y está disponible en 72 idiomas. Se encuentra disponible bajo la licencia GPL Versión 2.
- PHPMyAdmin: Agregar, editar y eliminar registros3:18
En esta clase revisaremos como agregar, editar y eliminar registros de una base de datos en el gestor MariaDB utilizando el administrador de base de datos PhpMyAdmin.
- PHPMyAdmin: ejecutar Script SQL, Insert, update, delete, select5:27
En esta clase repasaremos el lenguaje SQL y ejecutaremos código en la base de datos para insertar, editar, eliminar, actualizar y listar registros en el gestor MariaDB utilizando el administrador de base de datos PhpMyAdmin.
Lenguaje de Manipulación de Datos (DML)
Sentencias DML:
- SENTENCIA INSERT (Insertar Registros): Permite agregar una nueva fila o registro a una tabla o vista.
- SENTENCIA UPDATE (Modificación y actualización de Datos): Permite modificar o actualizar un registro o un conjunto de registros de una Tabla o vista dependiendo de una condición.
- SENTENCIA DELETE (Eliminación de Registros de una tabla): Permite eliminar uno o varios registros de una tabla dependiendo de una condición.
- PHPMyAdmin: Crear y restaurar Copia de respaldo de base de datos2:58
En esta clase aprenderemos a obtener una copia de respaldo de nuestra base de datos MariaDb (MySql) y a restaurar esa copia de respaldo, utilizando el administrador de base de datos PhpMyAdmin.
Copia de respaldo - Backup
Una copia de seguridad, copia de respaldo en tecnologías de la información es una copia de los datos originales que se realiza con el fin de disponer de un medio para recuperarlos en caso de su pérdida.
Restaurar base de datos
El proceso de copia de seguridad se complementa con otro conocido como restauración de los datos (en inglés restore), que es la acción de leer y grabar en la ubicación original u otra alternativa los datos requeridos que han sido respaldados con anterioridad.
- MySQL Workbench: Diseño de base de datos relacional PROYECTO FINAL (I-II)15:58
En esta clase (I Parte) diseñaremos la base de datos de nuestro proyecto final, utilizaremos la herramienta MysqlWorkbench.
El proyecto final que desarrollaremos será un sistema de compras, ventas y almacén.
- MySQL Workbench: Diseño de base de datos relacional PROYECTO FINAL (II-II)13:36
En esta clase (II Parte) diseñaremos la base de datos de nuestro proyecto final, utilizaremos la herramienta MysqlWorkbench.
El proyecto final que desarrollaremos será un sistema de compras, ventas y almacén.
- MySQL Workbench: Exportar código SQL a MariaDB (MySQL)3:07
En esta clase detallaremos los pasos para poder exportar en formato SQL la base de datos diseñada en MysqlWorkBench y restaurarla en el gestor MariaDb (MySql) utilizando el administrador de base de datos PhpMyAdmin.
- Organizando el esquema del proyecto: Ajax, public, bd, config, modelos y vistas3:06
En esta clase organizaremos el esquema de nuestro proyecto, para agrupar todos los archivos en carpetas y mantener un orden, las carpetas que implementaremos serán las siguientes:
public: Hojas de estilo CSS, Archivos JavaScript JS, Imágenes, fuentes, librerías JS, plugins.
config: Archivos PHP de configuración general y conexión a la base de datos.
files: Archivos cargados en el sistema por el usuario: imágenes jpg png gif, pdf.
modelos: Archivos PHP con las instrucciones para insertar, editar, eliminar, listar y buscar registros de las diferentes tablas.
ajax: Archivos PHP que van a retornar valores a las peticiones ajax que las referencien.
vistas: Interfaces HTML, Archivos JavaScript de consultas dinámicas, reportes.
- Lenguaje de programación PHP - Generalidades8:33
En esta clase detallaremos los conceptos básicos del lenguaje de programación PHP y la programación Orientada a Objetos.
Lenguaje de programación PHP
Lenguaje de programación de uso general de código del lado del servidor.
Diseñado para el desarrollo web de contenido dinámico.
Programación Orientada a Objetos
La Programación Orientada a Objetos (POO u OOP por sus siglas en inglés), es un paradigma de programación.
Cómo tal, nos enseña un método -probado y estudiado- el cual se basa en las interacciones de objetos para resolver las necesidades de un sistema informático.
Clases: Las clases son los modelos sobre los cuáles se construirán nuestros objetos.
Propiedades: Son las características intrínsecas del objeto. Éstas, se representan a modo de variables, solo que técnicamente, pasan a denominarse propiedades.
Métodos: Los métodos son funciones, solo que técnicamente se denominan métodos, y representan acciones propias que puede realizar el objeto.
Objetos: Podemos decir que una clase, es el razonamiento abstracto de un objeto, mientras que el objeto, es su materialización.
- Valores globales de conexión2:57
En esta clase implementaremos dentro de la carpeta config un archivo PHP llamado global.php donde declararemos las constantes de conexión a la base de datos, constantes donde almacenaremos el ip del servidor de datos, el nombre de la base de la base de datos, el usuario de la base de datos, la codificación de caracteres y el nombre de nuestro proyecto.
- Clase conexión: Conexión de la base de datos MariaDB (MySQL) y PHP- Métodos8:02
En esta clase agregaremos la clase de PHP Conexión.php donde implementaremos las funcionalidades necesarias para conectar nuestro proyecto PHP con la base de datos MariaDB (MySQL), además agregaremos las funciones para ejecutar scripts en la base de datos MariDB desde nuestro proyecto web.
MySQLi La extensión MySQLi ( MySQL Improved) es un controlador de base de datos relacional utilizado en el lenguaje de programación PHP para proporcionar una interfaz con bases de datos MySQL.
- Plantilla AdminLTE: Bootstrap, fuente awesome, Jquery3:02
En esta clase trabajaremos con la plantilla AdminLTE para adecuarla a nuestro proyecto, trataremos solamente de conservar en esta plantilla los archivos que necesitaremos.
AdminLTE
Es una plantilla de administración y panel de control basada en Bootstrap, es open source.
RECUERDA: revisar los archivos adjuntos donde encontraras la plantilla AdminLTE ya trabajada y otra plantilla muy buena.
- Organizar la plantilla, menú, header y footer9:09
En esta clase organizaremos la plantilla y la dividiremos en tres partes: header.php, listado.php y footer.php.
header.php: en este archivo estará la referencia a las hojas de estilo comunes para todas las páginas o vistas que se vayan implementado, también aquí encontremos el menú con sus diferentes opciones.
footer.php: en este archivo estará la referencia a los archivos javascript necesarios para el funcionamiento correcto del sistema, además también incluiremos el pie de página que estarán incluido en todas las vistas. listado.php: en este archivo incluiremos al header.php y al footer.php, además contendrá el contenido visual (html y css) para el mantenimiento de las tablas. De este archivo nos basaremos para implementar las vistas y realizar el mantenimiento de todas las demás tablas, incluyendo algunas funcionalidades propias y archivos javascript.
- Modelo tabla independiente: Métodos insertar, editar, eliminar, listar y mostrar13:06
En esta clase implementaremos nuestro primer modelo Categoria.php y lo guardaremos en la carpeta modelos.
Este archivo Categoria.php será una clase PHP, donde incluiremos las funciones para insertar, editar, desactivar, activar, listar y mostrar las categorías; dentro de cada función haremos referencia a la función ejecutarConsulta de la clase Conexión.php enviándole como parámetro el código SQL que deseamos ejecutar.
- Funciones insertar, editar, eliminar, listar y mostrar; envio mediante Ajax15:04
En esta clase implementaremos nuestro archivo categoria.php dentro de la carpeta ajax.
En este archivo categoria.php incluiremos las funciones PHP insertar, editar, desactivar, activar, listar y mostrar que nos ayudarán hacer referencia a cada función específica del modelo permitiendo desde un archivo JavaScript enviar y recibir datos mediante la tecnología Ajax.
- Métodos Jquery y uso de Ajax para manejar las funciones de manera dinámica11:09
En esta clase implementaremos nuestro archivo categoria.js dentro de la carpeta vistas/scripts.
En este archivo JavaScript incluiremos algunas funcionalidades para hacer más dinámica la vista (archivo html) donde implementaremos la tabla para mostrar el listado de las categorías y el formulario para realizar el mantenimiento respectivo de las categorías como guardar, editar.
- Vista HTML y Bootstrap para mostrar la lista de registros paginados - Datatables11:24
En esta clase implementaremos una tabla HTML en la vista para poder mostrar el listado y paginación de todos los registros, para esto agregaremos los archivos JavaScripts y Css para poder trabajar con el plugin de JQuery datatables que nos ayudará a mostrar el listado de registros paginados, realizar búsquedas y exportar el listado a Excel, pdf.
¿Qué es DataTables?
DataTables es un plugin jQuery que puede proporcionar mucha funcionalidad a las tablas HTML.
Principales características
- Listado
- Paginación
- Clasificación
- Filtración Procesamiento del lado del servidor (ajax)
- Formulario HTML y Css (Bootstrap) para insertar registros en la tabla13:59
En esta clase diseñaremos nuestro formulario HTML donde incluiremos los objetos de formulario utilizando la etiqueta input con los atributos adecuados, donde los usuarios del sistema ingresarán los datos respectivos que se insertarán en la tabla de la base de datos respectiva.
- Formulario HTML y Css (Bootstrap) para editar registros en la tabla8:29
En esta clase modificaremos el archivo categoría.php de la carpeta Ajax donde agregaremos en el listado un botón que active la función mostrar del archivo categoría.js mostrando de esta manera los datos del registro a editar en las cajas de texto respectivas.
RECUERDA: Aquí comparto el enlace de descarga de mantenimiento de la tabla categoría terminado.
- Eliminación de registros de la tabla, uso de la librería Botbox12:28
En esta clase modificaremos el archivo categoría.php de la carpeta Ajax donde agregaremos en el listado dos botones que ejecuten la función desactivar y activar del archivo categoría.js, ambas funciones llamarán a un cuadro de dialogo de confirmación previa (utilizando la librería bootbox), si se confirma se activará o desactivará el registro según sea el caso.
También mostraremos como descargar e implementar la librería Bootbox.js
Bootbox
Bootbox.js es una pequeña librería de javascript que te permite crear dinámicamente dialogos en el explorador usando los modales de Bootstrap, sin tener que preocuparte por crearlos previamente con markup, modificarlos o remover cualquiera de los elementos DOM requeridos o eventos. Solo necesitas, aparte de Bootbox, la librería de bootstrap incluida previamente en tu proyecto.
RECUERDA: Aquí comparto el enlace de descarga de mantenimiento de la tabla categoría terminado y de la librería Bootbox.js.
- PROYECTO FINAL: Mantenimiento de tabla categoría1:37
Así debería de quedar terminado el mantenimiento de la tabla categoría después de realizar todas las funcionalidades.
Si tienes consultas y dudas escríbeme, puedes revisar también el proyecto hasta este video y comparar con tu código fuente.
RECUERDA: Aquí se comparte el enlace de descarga de todo el proyecto hasta el mantenimiento de la tabla categoría.
- Modelo tabla relacional: Métodos insertar, editar, eliminar, listar y mostrar13:22
En esta clase implementaremos nuestro modelo Articulo.php y lo guardaremos en la carpeta modelos.
Este archivo Articulo.php será una clase PHP, donde incluiremos las funciones para insertar, editar, desactivar, activar, listar y mostrar los registros de la tabla relacional artículo; dentro de cada función haremos referencia a la función ejecutarConsulta de la clase Conexión.php enviándole como parámetro el código SQL que deseamos ejecutar.
- Funciones para insertar, editar, eliminar, listar y mostrar; envio mediante Ajax10:46
En esta clase implementaremos nuestro archivo articulo.php dentro de la carpeta ajax.
En este archivo articulo.php incluiremos las funciones PHP insertar, editar, desactivar, activar, listar y mostrar los registros de la tabla relacional artículo; funciones que nos ayudarán hacer referencia a cada función específica del modelo permitiendo desde un archivo JavaScript enviar y recibir datos mediante la tecnología Ajax.
- Subir y guardar imagen en nuestro proyecto, mostrar las imágenes en la vista8:52
En esta clase implementaremos las funcionalidades necesarias para que el usuario pueda subir las imágenes referenciales de los artículos previamente seleccionadas desde la vista, las imágenes que serán cargadas al servidor se deben de validar previamente aceptando solo formatos de imágenes validas (JPG, PNG, JPEG, etc) para no exponer la seguridad de nuestro servidor.
- Métodos Jquery y uso de Ajax para manejar las funciones de manera dinámica9:26
En esta clase implementaremos nuestro archivo articulo.js dentro de la carpeta vistas/scripts.
En este archivo JavaScript incluiremos algunas funcionalidades para hacer más dinámica la vista (articulo.php de la carpeta vistas) y mejorar la experiencia de usuario.
- Vista HTML para mostrar la lista de registros paginados utilizando DataTables5:24
En esta clase implementaremos una tabla HTML en la vista articulo.php para poder mostrar el listado y paginación de todos los registros de la tabla artículo, continuamos trabajando con el plugin de JQuery Datatables que nos ayudará a mostrar el listado de registros paginados, realizar búsquedas y exportar el listado a Excel, pdf, CSV.
- Formulario HTML y Css (Bootstrap) para insertar registros en tabla relacional7:44
En esta clase diseñaremos nuestro formulario HTML donde incluiremos los objetos de formulario utilizando la etiqueta input con los atributos adecuados, donde los usuarios del sistema ingresarán los datos respectivos que se insertarán en la tabla Artículo de la base de datos.
- Mostrar y filtrar registros de tabla en un Objeto de formulario Select12:20
En esta clase implementaremos las funciones necesarias para poder mostrar todas las categorías activas como opciones en un objeto de formulario select donde el usuario podrá asignar los artículos a sus categorías respectivas.
Para poder realizar la búsqueda dentro del objeto select trabajaremos con el plugin Bootstrap-select.
Bootstrap-Select
Bootstrap-select es un plugin de jQuery que utiliza Dropdown.js de Bootstrap para diseñar y aportar funcionalidad adicional a elementos selects estándar.
- Formulario HTML y Css (Bootstrap) para editar registros en una tabla relacional9:08
En esta clase trabajaremos en las funcionalidades necesarias para poder realizar la actualización de los registros de la tabla artículo.
RECUERDA: Aquí comparto el enlace de descarga de mantenimiento de la tabla artículo terminado.
- Agregar la librería JsBarcode para trabajar con código de barras8:41
En esta clase agregaremos la librería JsBarcode para generar la imagen del código de barras de los artículos.
JsBarcode
JsBarcode es un generador de código de barras JavaScript.
El plugin utiliza Html5Canvas para dibujar los códigos de barras. Esta es una solución lista para usar, es open source.
Tipos soportados de códigos de barras :
- EAN (13)
- CODE128 (B o C)
- UPC-A
- CODE39
- ITF (Interleaved 2 de 5)
- ITF14
- Pharmacode
RECUERDA: Aquí comparto el enlace de descarga de mantenimiento de la tabla artículo terminado.
- Agregar funcionalidad para imprimir código de barras, librería jQuery Print Area4:56
En esta clase agregaremos la librería JQuery.PrintArea que nos permitirá imprimir una parte de nuestra página web, utilizaremos esta funcionalidad para imprimir los códigos de barras generados para nuestros artículos y poder incluirlos en nuestros artículos físicos.
JQuery.PrintArea
Imprime un área específica de la página. Mediante la configuración de json, el área impresa se abre en un pop-up o en un iframe oculto. Configuración mínima y fácil de usar.
RECUERDA: Aquí comparto el enlace de descarga de mantenimiento de la tabla artículo terminado.
- Sugerencias y mejoras del Proyecto Final (1)8:44
En este video mejoramos algunas funcionalidades del proyecto y detallamos algunas acciones que podemos realizar cada vez que tengamos algún error o incoveniente en el desarrollo del curso.
NO olvides de escribir tus dudas, consultas o sugerencias.
- PROYECTO FINAL: Crud Artículos2:39
Así debería de quedar terminado el mantenimiento de la tabla artículo después de realizar todas las funcionalidades.
Si tienes consultas y dudas escríbeme, puedes revisar también el proyecto hasta este video y comparar con tu código fuente.
RECUERDA: Aquí se comparte el enlace de descarga de todo el proyecto hasta el mantenimiento de la tabla artículo.
- PROYECTO FINAL: Mantenimiento proveedores – Modelo Persona8:50
En esta clase implementaremos nuestro modelo Persona.php y la guardaremos en la carpeta modelos.
Este archivo Persona.php será una clase PHP, donde incluiremos las funciones para insertar, editar, eliminar, listar y mostrar los registros de la tabla Persona, recordemos que los proveedores y clientes van a estar registrados en esta tabla persona pero se van a diferenciar por el campo tipo.
- PROYECTO FINAL: Mantenimiento proveedores – Insertar, editar, eliminar, listar10:06
En esta clase implementaremos nuestro archivo persona.php dentro de la carpeta ajax.
En este archivo persona.php incluiremos las funciones PHP insertar, editar, eliminar, listar y mostrar los registros de la tabla persona; funciones que nos ayudarán a hacer referencia a cada función específica del modelo permitiendo desde un archivo JavaScript enviar y recibir datos mediante la tecnología Ajax.
- PROYECTO FINAL: Mantenimiento proveedores – Funciones JavaScript, vistas6:48
En esta clase implementaremos nuestro archivo proveedor.js dentro de la carpeta vistas/scripts.
En este archivo JavaScript incluiremos algunas funcionalidades para hacer más dinámica la vista (proveedor.php de la carpeta vistas) y mejorar la experiencia de usuario.
- PROYECTO FINAL: Mantenimiento Proveedores9:24
Así debería de quedar terminado el mantenimiento de los proveedores después de realizar todas las funcionalidades.
Si tienes consultas y dudas escríbeme, puedes revisar también el proyecto hasta este video y comparar con tu código fuente.
RECUERDA: Aquí se comparte el enlace de descarga de todo el proyecto hasta el mantenimiento de proveedores.
Requirements
- Conocimientos básicos de HTML y PHP.
- NO es necesarios tener experiencia como programador ya que este curso te guiará desde cero.
Description
Un curso excelente si deseas desarrollar tus propios sistemas web de gestión de información desde cero.
Aprende a desarrollar sistemas de gestión de información utilizando el lenguaje de programación PHP y la programación orientada a Objetos, el gestor de base de datos MariaDB (MySql), para el diseño y la administración de la base de datos trabajaremos con las herramientas MysqlWorkbench y PhpMyadmin, utilizaremos HTML5 y CSS3 para el diseño de las páginas web que conformarán nuestro proyecto, pero para hacer más fácil nuestro diseño web trabajaremos con el framework Bootstrap, revisaremos la librería JQuery y la tecnología Ajax para hacer dinámico nuestro proyecto web.
Desarrollaremos como ejemplo un SISTEMA INFORMÁTICO desde cero para que te sirva como guía.
Diseñaremos la base de datos de nuestro proyecto utilizando MysqlWorkBench.
Trabajaremos con plantillas web.
Implementaremos la conexión y las funcionalidades necesarias para conectar la base de datos MariaDB(Mysql) con nuestro proyecto web.
Durante todo el curso aprenderás a realizar el mantenimiento CRUD de tablas independientes, tablas relacionales, tablas maestro detalle y la gestión de accesos de usuarios al sistema.
También realizaremos reportes en Excel, PDF e implementaremos gráficos estadísticos.
Al final de todo el proyecto te mostraremos como implementar tu proyecto en una red local o en un hosting en la nube.
INSCRIBETE YA y comparte este gran curso conmigo!
Who this course is for:
- Personas que quieren desarrollar sus sistemas informáticos en entorno web.
- Estudiantes que desean ingresar a la industria del desarrollo de sistemas informáticos web.