Como crear un CRUD con Laravel 10 y Bootstrap 5 – Parte 3

Demo

En la Parte 3 o la parte anterior llamada Como crear un CRUD con Laravel 10 y Bootstrap 5 – Parte 2, creamos nuestro controlador llamado ProductosController, este conrolador permite que enviemos los datos a nuestras vistas para poder ser gestionadas correctamente, asimismo recibe los datos que enviamos desde las vistas hacia la base de datos, por ejemplo cuando editamos un registro o producto, enviamos datos desde el formulario o vista editar (edit), en esta parte 2 continuamos con el tutorial Como crear un CRUD con Laravel 10 y Bootstrap 5, vamos con ello.

Partes

• Parte 1
• Parte 2
• Parte 3
• Parte 4
• Parte 5 (Final – Código Fuente GitHub) 

Antes de continuar, te invito a leer los siguientes artículos:

• Las Novedades más destacadas que trae Laravel 9 – Parte 1
• Como Crear un CRUD con Laravel 8 y Bootstrap 5 – Parte 1
• Como Usar Mongo DB en Laravel 8 + Listado de Datos – Parte 1
• Que es Laravel + Tu Primera Aplicación con Laravel
• Las Novedades más destacadas que trae Laravel 8 
• Nuevos Comandos Para Bases de Datos En Laravel 9
• Las Novedades más destacadas que trae Laravel 10
• Como crear un CRUD con Galería de Imágenes en Laravel 6.2 y Bootstrap 4 – Parte 1
• Como Trabajar con Query Scopes (Ámbitos de Consulta) en Laravel 7
• Cliente PHP de OpenAI Para Laravel
• Lee más artículos en la categoría Laravel

Asimismo te invito a escuchar el Podcast: “Consejos Para Tener Más Tiempo Para Programar” y “¿ Qué Es NoCode Development ?” (Anchor Podcast): 

Spotify:	Sound Cloud:	Apple Podcasts	Anchor Podcasts

Bien ahora continuemos con el Post: Como crear un CRUD con Laravel 10 y Bootstrap 5 – Parte 3. 

Voy a crear el modelo y la vista de nuestro formulario HTML con Bootstrap 5 para que el usuario pueda interactuar con el CRUD. 

Modelo

Para el sistema CRUD debo crear un modelo llamado, yo le daré el nombre Productos, tu le puedes poner el nombre que desees. Para crear el modelo voy a la consola de comandos y ejecuto el siguiente comando: 

Laravel me ha creado un archivo llamado Productos.php este archivo se encuentra en la carpeta app > Models > Productos.php

Abro el archivo Productos.php y primero coloco el nombre la tabla que voy a usar de la base de datos, un modelo en Laravel nos permite acceder a una tabla específica y para trabajar con cada tabla se debe de crear su propio Modelo.

Accedo a la tabla que voy a usar la cual se llama productos, asimismo selecciono todos los campos de esta tabla que voy a usar para mi CRUD:

Si Laravel no ha instanciado automáticamente el Trait Model, debemos de instanciarlos dentro de nuestro modelo para que pueda acceder a los métodos para Modelos de Eloquent en Laravel: 

Vistas

Para crear las vistas con Bootstrap 5 debo organizar mis archivos y carpetas, en el conjunto de archivos de Laravel hay un directorio llamado resources y dentro de este se encuentra el directorio llamado views que es en donde se debe de crear las vistas HTML en Laravel: 

Dentro de la carpeta views crearé una nueva carpeta llamada productos, y dentro de ella creare una carpeta llamada admin y dentro de ella colocaré las vistas para el sistema CRUD, aquí voy a crear 3 archivos PHP a los cuales los llamaré actualizar.blade.php, crear.blade.php, detalles.blade.php e index.blade.php

Asimismo dentro de mi carpeta productos voy a crear un nuevo directorio llamado frm que es como un nombre más corto de la palabra formulario, dentro de esta carpeta frm voy a crear un archivo llamado prt.blade.php (prt es como un nombre más corto de la palabra parte) en este archivo voy a crear el código HTML para el formulario que será usado para Crear y Editar un registro.

Nuestro directorio debe verse actualmente de la siguiente manera:

Puedes ver que los archivos tiene la extensión .blade esta extensión es el formato del motor de plantillas que usa Laravel para las vista de cualquier proyecto en general. El trabajo con el motor de plantillas blade le da más practicidad, dinamismo entre otras características al trabajo con vistas en Laravel.

Formulario

Las tareas Crear y Actualizar un registro en el Sistema CRUD van funcionar sobre un formulario HTML, vamos a crearlo mediante Bootstrap 5 y luego lo instanciamos o llamamos a las vistas correspondientes.

Abro el archivo que he creado llamado prt.blade.php en el voy a trabajar el Formulario.

Por criterio me puedo dar cuenta que este formulario va ser usado para 2 funciones en el CRUD que son Crear y Actualizar un registro, entonces puede que el usuario decida crear un registro nuevo, para esto necesita tener el formulario limpio y sin datos en su interior, en cambio si el usuario decide actualizar un registro, pues tiene que tener datos para editarlos en el formulario.

Entonces sabiendo esto debo de crear mis sentencias if – else para que cuando el usuario decida actualizar un registro, pues le mostramos los datos de un registro a actualizar en el formulario y si no pues le mostramos un formulario nuevo en limpio para ser llenado por un nuevo registro:

Entonces primero creo el formulario que mostrará los datos a actualizar, lo que hago es con la sentencia if consultar si la variable $productos->id no esta vacía y esta devolviendo el id del registro que quiero sctualizar, entonces como si esta devolviendo el id del registro, pues le llamo y muestro todos los datos del registro en el formulario para modificarlos: 

Puedes ver al final del contenido de la sentencia if en la parte donde se actualiza la imagen he creado un nueva sentencia if – else, mediante esta sentencia voy a verificar si el registro tiene una imagen o no: 

Luego de la sentencia principal if en donde mostramos el formulario para sctualizar un registro, sigue la sentencia else en donde mostaremos un formulario en blanco para crear un nuevo registro: 

A continuación el código completo del formulario junto con las sentencias if – else respectivas: 

Listo ya tenemos el formulario que usaremos en nuestro CRUD.

Hasta aquí hemos creado el modelo Productos, también hemos organizado los directorios para las vistas del sistema CRUD y creamos el formulario prt.blade.php que servirá para crear y actualizar un registro en la tabla productos de la base de datos. 

Ten Paciencia, lo que quiero es que conozcas bien como se crea este proyecto y no llenarte el capitulo de mucho contenido porque te puedes marear y no tendrás un óptimo aprendizaje. 

Nota (s)

• Los pasos mencionados en este tutorial pueden cambiar en un futuro, esto no depende de nosotros si no de la oraganización que da soporte a Laravel que suele cambiar el orden y las opciones de este framework en sus futuras versiones.
• No olvides que debemos usar la Tecnología para hacer cosas Buenas por el Mundo. 

 

Síguenos en nuestras Redes Sociales para que no te pierdas nuestros próximos contenidos.