05 🧩 Vista Completa del Formulario de Ajustes del Sistema | Laravel 12 FullStack Ecommerce

Duración: 36 min
Módulo: 🚀 Configuración Inicial y Sistema de Administración 1-6 Lección 5 de 6
Anterior
04 ⚙️ Módulo de Ajustes del Sistema | Modelo, Migración, Controlador y Vista en Laravel 12 FullStack
Siguiente
06 ⚙️ Guardar y Actualizar los Ajustes del Sistema con Imágenes | Ecommerce Laravel 12 FullStack

Descripción

Lección 05: 🧩 Construyendo la Interfaz Completa del Módulo de Ajustes

Este capítulo crucial, presentado por Hilari Web, nos lleva al corazón del desarrollo front-end en nuestro Ecommerce con Laravel 12. Dejamos la lógica pura (Modelo, Migración, Controlador) para enfocarnos en la Vista del formulario de Ajustes del Sistema.

El objetivo es crear una interfaz amigable, funcional y profesional para la configuración global de la tienda.

✨ Ejes Temáticos y Habilidades Adquiridas

Esta clase magistral se enfoca en la implementación detallada de formularios complejos dentro de las vistas de Blade:

  • 🖼️ Diseño de la Estructura Base: Se inicia la lección montando la estructura visual del formulario dentro de un componente Card [00:34] de la plantilla, utilizando el sistema de grillas de Bootstrap (col-md-10 y col-md-2) para dividir el espacio entre campos de texto e imágenes [04:13].
  • ✏️ Campos de Texto Avanzados: Se implementan los Input Groups (input-group) para fusionar etiquetas y elementos visuales (como iconos) [06:32], mejorando la estética y la usabilidad de campos como Nombre y Descripción. Además, se emplea el método old() de Laravel para mantener la información de los campos tras un error de validación [14:34].
  • 🌍 Integración de Divisas (API Externa): La lección demuestra cómo consumir una API externa de divisas (monedas) a través del controlador [21:59], procesar la respuesta JSON y enviarla a la vista (compact), reemplazando el input simple por un elemento <select> dinámico [24:52].
  • 📸 Gestión de Archivos y Previsualización: Se implementan los campos para cargar el Logotipo y la Imagen del Login. Se introduce un script de JavaScript que permite la previsualización inmediata [29:10] de la imagen seleccionada por el usuario antes de ser subida, un toque de usabilidad esencial.
  • 💾 Botón de Acción: La lección culmina con la adición del botón "Guardar Cambios" [34:50] que activará el proceso de almacenamiento de datos en la base de datos a través del controlador.

Al completar esta lección, habrás dominado la construcción de formularios FullStack, conectando la lógica del controlador con la presentación dinámica de la vista.

$10.00
Iniciar sesión para inscribirse

Lecciones

🚀 Configuración Inicial y Sistema de Administración 1-6
Lección 1. 01 🚀 Inicio del Curso Ecommerce con Laravel 12 FullStack | ¡Hola Mundo y Configuración Inicial! 18 min
Lección 2. 02 🔐 Autenticación Login y Registro de Usuarios | Ecommerce con Laravel 12 FullStack Profesional 17 min
Lección 3. 03 🎨 Instalación y Personalización del Menú con Plantilla Mazer | Ecommerce Laravel 12 FullStack 29 min
Lección 4. 04 ⚙️ Módulo de Ajustes del Sistema | Modelo, Migración, Controlador y Vista en Laravel 12 FullStack 30 min
Lección 5. 05 🧩 Vista Completa del Formulario de Ajustes del Sistema | Laravel 12 FullStack Ecommerce 36 min
Lección 6. 06 ⚙️ Guardar y Actualizar los Ajustes del Sistema con Imágenes | Ecommerce Laravel 12 FullStack 42 min
🛡️ Roles, Permisos y Gestión de Usuarios (Spatie) 7-16
Lección 1. 07 🔐 Instalación y Configuración de Laravel Spatie Roles y Permisos | Ecommerce Laravel 12 FullStack 12 min
Lección 2. 08 🧩 Creación y Registro de Roles | Controlador, Rutas y Formulario | Ecommerce Laravel 12 FullStack 19 min
Lección 3. 09 📋 Listado y Paginación de Roles | Spatie Roles & Permisos | Ecommerce Laravel 12 FullStack 25 min
Lección 4. 10 ⚙️ CRUD Completo de Roles | Spatie Roles & Permisos | Ecommerce Laravel 12 FullStack 25 min
Lección 5. 11 💬 Instalación y Configuración de SweetAlert2 | Alertas Dinámicas en el Sistema Ecommerce Laravel 15 min
Lección 6. 12 🔐 Ajustes en el Login y Seeder de Usuarios | Sistema Ecommerce Laravel 12 FullStack 40 min
Lección 7. 13 👥 Nuevo Módulo de Usuarios | Listado y Creación de Usuarios | Ecommerce Laravel 12 FullStack 18 min
Lección 8. 14 🔍 Buscador y Detalle de Usuarios (Acción Show) | Ecommerce Laravel 12 FullStack 32 min
Lección 9. 15 🗑️ SOFT DELETES: Editar y Eliminar Usuarios en Laravel 12 | CRUD Completo E-commerce FullStack 21 min
Lección 10. 16 ♻️ RESTAURAR Usuarios Eliminados | Papelera de Reciclaje (Trashing) en Laravel 12 CRUD FullStack 15 min
📦 Módulos Esenciales (Categorías y Productos) 17-24
Lección 1. 17 🛍️ MÓDULO CATEGORÍAS: Modelo, Migración y Listado | Laravel 12 Ecommerce CRUD FullStack 20 min
Lección 2. 18 ✍️ CREAR CATEGORÍAS (Formulario y Store) y Ver Detalle (Show) | Laravel 12 CRUD E-commerce 19 min
Lección 3. 19 🔥 CRUD COMPLETO de Categorías: Editar, Actualizar y Eliminar + Mejora al Dashboard | Laravel 12 21 min
Lección 4. 20 📦 MÓDULO PRODUCTOS: Modelos y Relaciones (One-to-Many Imágenes) | Laravel 12 E-commerce 20 min
Lección 5. 21 🎨 Creando la Vista del Formulario de Nuevo Producto | Diseño y Estilos en Laravel 12 FullStack 30 min
Lección 6. 22 💾 STORE Productos y Vista Detalle (Show) | Validación y Almacenamiento en Laravel 12 E-commerce 21 min
Lección 7. 23 🖼️ GALERÍA de Productos: Subida y Eliminación de Imágenes | File Upload en Laravel 12 E-commerce 30 min
Lección 8. 24 💥 CRUD COMPLETO Productos: Editar, Eliminar y Limpieza Total de Imágenes | Laravel 12 E-commerce 18 min
🛒 Tienda Online (Frontend Shop) y Funcionalidades 25-33
Lección 1. 25 🎨 INTEGRACIÓN DE PLANTILLA SHOP | Diseño Profesional para la Tienda Online | Laravel E-commerce 20 min
Lección 2. 26 🛒 PRODUCTOS DINÁMICOS: Carga desde BD y Visualización en la Tienda | Laravel 12 E-commerce 27 min
Lección 3. 27 📚 Paginación Frontend y DETALLE de Producto | Mostrar Galería de Fotos en la Tienda | Laravel 12 22 min
Lección 4. 28 🛒 Vista Show Dinámica del Producto | Descripción y Datos Relacionados | Laravel 12 15 min
Lección 5. 29 🔐 LOGIN y AUTENTICACIÓN de Clientes | Implementando el Sistema en la Tienda Online | Laravel 12 29 min
Lección 6. 30 📝 CREAR CUENTA de Cliente | Formulario, Validación y Almacenamiento de Usuarios | Laravel 12 25 min
Lección 7. 31 🚫 ERROR 404 Personalizado | Diseñando la Página de No Encontrado (Admin y Shop) | Laravel 12 16 min
Lección 8. 32 🔍 BUSCADOR de Productos | Lógica de Filtro y Queries Dinámicas en Laravel 12 E-commerce 17 min
Lección 9. 33 ⭐ MÓDULO FAVORITOS (Wishlist): Migración, Modelos y Relación Many-to-Many | Laravel 12 E-commerce 45 min
💳 Carrito, Checkout y Pasarela de Pagos 34-42
Lección 1. 34 🛒 INICIO MÓDULO CARRITO | Migración, Modelo y Acción Add to Cart | Laravel 12 E-commerce 37 min
Lección 2. 35 🛒 VISTA DEL CARRITO | Resumen, Subtotal y Total Dinámico para el Usuario | Laravel 12 E-commerce 24 min
Lección 3. 36 🧹 GESTIÓN TOTAL del Carrito | Actualizar Cantidad, Eliminar Producto y Vaciar Carrito | Laravel 22 min
Lección 4. 37 💳 PASARELA DE PAGOS PayPal | Integración y Lógica de Checkout en Laravel 12 E-commerce 27 min
Lección 5. 38 ✅ PAGO COMPLETADO y REGISTRO de Pedido | Lógica Final de Venta con PayPal y Laravel 12 11 min
Lección 6. 39 📦 MÓDULO ÓRDENES: Estructura de BD, Modelos y Relación de Detalles (Order Items) | Laravel 12 31 min
Lección 7. 40 ✅ Finalizando la Venta: Guardando Detalles de Orden y Actualizando el Stock de Productos 17 min
Lección 8. 41 🏆 CONFIRMACIÓN de Pedido: Diseño de la Vista Compra Exitosa y Detalles de la Orden | Laravel 12 16 min
Lección 9. 42 📧 CORREO de Confirmación de Pedido | Creando la Plantilla Mailable y Envío PostPago en Laravel 12 24 min
⚙️ Gestión de Órdenes, Perfiles y Características Avanzadas 43-61
Lección 1. 43 📊 LISTADO DE PEDIDOS (Órdenes) en el Admin Panel | Vista General de Ventas | Laravel 12 20 min
Lección 2. 44 📝 DETALLE de la Orden | Productos, Envío y Gestión de Pedido para Envío al Cliente | Laravel 12 27 min
Lección 3. 45 ⚙️ PROCESAMIENTO de la Orden | Cambio de Estado, Notas de Gestión y Fulfillment del Pedido 21 min
Lección 4. 46 🚚 NOTIFICACIÓN de Envío al Cliente | Automatización de Email al Cambiar Estado en el Admin 17 min
Lección 5. 47 🔗 BUSCADOR AVANZADO: Filtrando Tablas Relacionadas con WHERE HAS y Joins en Laravel 12 10 min
Lección 6. 48 🌐 Traduciendo Errores de Validación de Laravel a Español | Carpeta lang/es en Laravel 12 7 min
Lección 7. 49 📈 DASHBOARD Creando Widgets con Estadísticas de Pedidos y Ventas | Laravel 12 E-commerce 14 min
Lección 8. 50 👤 DASHBOARD del CLIENTE: Vista Mi Cuenta, Menú y Listado de Pedidos Frontend | Laravel 12 14 min
Lección 9. 51 👤 DASHBOARD del CLIENTE: Cargar Detalles de la Orden, Seguimiento | Laravel 12 25 min
Lección 10. 52 ⚙️ AJUSTES de Cuenta: Vista Perfil y Seguridad (Cambio de Nombre/Email y Contraseña) | Laravel 12 18 min
Lección 11. 53 🔒 LÓGICA CRUD de Perfil: Actualizar Nombre/Email y Cambiar Contraseña Segura | Laravel 12 18 min
Lección 12. 54 🛡️ Roles y Permisos: Creación de Roles y Seeder de Permisos con Spatie | Laravel 12 E-commerce 13 min
Lección 13. 55 🔗 Sincronización de Permisos: Asignando Todos los Privilegios al Rol SUPER ADMIN | Laravel Spatie 17 min
Lección 14. 56 📊 Interfaz de Permisos: Agrupando Permisos por Módulo y Marcando los Asignados (Spatie UI) 12 min
Lección 15. 57 🔄 Sincronización de Permisos a cada Rol: Lógica de Guardado con sync() en Spatie | Laravel 12 13 min
Lección 16. 58 🛑 Manejo de Errores: Personalizando la Página 403 (Acceso Denegado) con Laravel y Spatie 12 min
Lección 17. 59 🔑 Seguridad de UI: Ocultando y Mostrando Componentes con la Directiva @can de Laravel Blade 15 min
Lección 18. 60 👤 Diseño de Perfil: Creando la Vista de Ajustes de Cuenta y Mostrar Datos de Usuario | Laravel 14 min
Lección 19. 61 🔐 Cambio de Contraseña Segura: Implementando el Formulario de Verificación de Contraseña Actual 22 min
📊 Análisis de Datos, Despliegue y Conclusión 62-68
Lección 1. 62 📈 Dashboard con Gráficos: Instalación de ApexCharts y Primer Gráfico de Muestra | Laravel 12 9 min
Lección 2. 63 📊 Analytics: Generando Gráfico de Usuarios Registrados Mensualmente con DB Raw y ApexCharts 12 min
Lección 3. 64 💰 Gráfico de Ventas Mensuales: Calculando el SUM(total) de Órdenes y Usando un Gráfico de Barras 12 min
Lección 4. 65 🥧 Gráfico de Pastel: Visualizando la Distribución de Pedidos (Nuevos vs. Enviados) con ApexCharts 9 min
Lección 5. 66 🎯 Gráfico de Barra Radial: Visualizando el Progreso de Metas (KPIs) con ApexCharts 15 min
Lección 6. 67 💾 Backup y Control de Versiones: Subiendo el Proyecto Completo a GitHub | Laravel E-commerce 12 min
Lección 7. 68 🎉 ¡FIN DEL CURSO! Review Final del Sistema de E-commerce con Laravel (Módulos Completos) 12 min

Apoya este proyecto

Si te gusta nuestro contenido, ¡apóyanos con una donación!

Donar por Airtm Donar por Binance

¡Gracias por tu apoyo! ❤️

Volver al curso