Como crear un CRUD con Laravel 5.8 y Bootstrap 4 – Parte 2
6 minuto(s)En esta página:
Demo
En este capitulo continuaremos con la segunda parte del tutorial anterior llamado Como crear un CRUD con Laravel 5.8 y Bootstrap 4 – Parte 1, vamos a crear el modelo, los métodos y otras configuraciones necesarias para que nuestra aplicación pueda funcionar correctamente, vamos con este Post.
Vamos a empezar creando el controlador con los métodos correspondientes para cada operación.
Controlador
Como nuestro Sistema CRUD va tener cuatro operaciones que son Create, Read, Update y Delete, estas operaciones junto con sus procesos en el código debemos de crearlos en un Controlador, en mi consola de comandos voy a crear un controlador llamado JugosController ejecutando el siguiente comando
|
1 2 3 4 5 |
php artisan make:controller JugosController Controller created successfully. |
Se nos ha creado un nuevo archivo llamado JugosController.php en la ubicación app > Http > Controllers > JugosController.php
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 |
/miaplicacionlaravel ├── /app ├── /Http ├── /Controllers ├── JugosController.php // Abre este Archivo ├── /bootstrap ├── /config ├── /database ├── /public ├── /resources ├── /routes ├── /storage ├── /tests ├── /vendor ├── .editorconfig ├── .env ├── .env.example ├── .gitattributes ├── .gitignore ├── .styleci.yml ├── artisan ├── composer.json ├── composer.lock ├── package.json ├── phpunit.xml ├── server.php ├── webpack.mix.js ├── yarn.lock |
Abre el archivo JugosController.php, dentro de el empezaremos instanciando el namespace y los traits que usaremos para nuestrs métodos dentro del controlador que son Session, Redirect, Requests, Controller, Validator, DB, Input y Storage, asimismo estoy llamando a mi modelo Jugos.
Por último el método ItemCreateRequest e ItemUpdateRequest que son 2 archivos que vamos a crearlos más adelante y nos servirán para validar los datos que enviamos en los formularios de Crear y Editar registros a la Base de Datos
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
namespace App\Http\Controllers; use Illuminate\Http\Request; use App\Jugos; use Session; use Redirect; use App\Http\Requests; use App\Http\Controllers\Controller; use App\Http\Requests\ItemCreateRequest; use App\Http\Requests\ItemUpdateRequest; use Illuminate\Support\Facades\Validator; use DB; use Input; use Storage; class JugosController extends Controller { ... |
El primer método que definiré en mi controlador lo llamaré crear() que servira para Crear los jugos o registros en mi tabla jugos este método procesará los datos que envie mediante un formulario HTML de Bootstrap 4 más adelante
Crear (Create)
Dentro de mi método crear() instancio la vista HTML crear.blade.php que se encuentra en resources > view > admin > jugos > crear.blade.php al modelo Jugos que hace llamado a la tabla jugos de la Base de Datos
|
1 2 3 4 5 6 7 8 9 |
// Crear un Registro (Create) public function crear() { $jugos = Jugos::all(); return view('admin.jugos.crear', compact('jugos')); } |
Después del método crear() voy a definir otro método llamado store() en donde se va a procesar los datos que recibo desde la vista HTML crear.blade.php que cuenta con un formulario para Crear un nuevo registro o jugo, este método store() recibe los datos que son enviados desde este formulario y los inserta en la tabla jugos de mi Base de Datos.
En el código he colocado comentarios para explicar que tarea realiza dicha parte del código
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
// Proceso de Creación de un Registro public function store(ItemCreateRequest $request) { // Instancio al modelo Jugos que hace llamado a la tabla 'jugos' de la Base de Datos $jugos = new Jugos; // Recibo todos los datos del formulario de la vista 'crear.blade.php' $jugos->nombre = $request->nombre; $jugos->precio = $request->precio; $jugos->stock = $request->stock; // Almacenos la imagen en la carpeta publica especifica, esto lo veremos más adelante $jugos->img = $request->file('img')->store('/'); // Inserto todos los datos en mi tabla 'jugos' $jugos->save(); // Hago una redirección a la vista principal con un mensaje return redirect('admin/jugos')->with('message','Guardado Satisfactoriamente !'); } |
Puedes ver que le estoy pasando el request ItemCreateRequest que validará los datos antes de ser enviados al servidor, este request lo veremos más adelante
Leer (Read)
Ahora voy a crear el método index() el cual lo usaré para leer todos los registros de mi tabla jugos de mi Base de Datos, estos registros los colocaré en una tabla HTML de Bootstrap 4 más adelante
|
1 2 3 4 5 6 7 8 9 |
// Leer Registros (Read) public function index() { $jugos = Jugos::all(); return view('admin.jugos.index', compact('jugos')); } |
En la variable $jugos realizo un llamado a todos los registros o jugos de mi tabla jugos, luego los envío a la vista index.blade.php que se encuentra en resources > view > admin > jugos > index.blade.php
Actualizar (Update)
Acá crearé el método actualizar($id) que llamará a la vista actualizar.blade.php que se encuentra en resources > view > admin > jugos > actualizar.blade.php
|
1 2 3 4 5 6 7 8 9 |
// Actualizar un registro (Update) public function actualizar($id) { $jugos = Jugos::find($id); return view('admin/jugos.actualizar',['jugos'=>$jugos]); } |
Puedes ver que dentro del método actualizar($id) le estoy pasando el valor $id, este valor será el id del registro asignado en la tabla jugos, cada registro cuenta con un id único y nuestro método actualizar debe saber que registro se va actualizar.
Ahora crearé el método update() que procesará los datos que son enviados desde un formulario HTML que se encontrará en la vista actualizar.blade.php este formulario HTML lo crearé con Bootstrap 4 más adelante.
En el código he colocado comentarios para explicar que tarea realiza dicha parte del código
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
// Proceso de Actualización de un Registro (Update) public function update(ItemUpdateRequest $request, $id) { // Recibo todos los datos desde el formulario Actualizar $jugos = Jugos::find($id); $jugos->nombre = $request->nombre; $jugos->precio = $request->precio; $jugos->stock = $request->stock; // Recibo la imagen desde el formulario Actualizar if ($request->hasFile('img')) { $jugos->img = $request->file('img')->store('/'); } // Actualizo los datos en la tabla 'jugos' $jugos->save(); // Muestro un mensaje y redirecciono a la vista principal Session::flash('message', 'Editado Satisfactoriamente !'); return Redirect::to('admin/jugos'); } |
Dentro del método update() he colocado el request ItemUpdateRequest el cual veremos más adelante, también la variable $id, este es el id del registro de la tabla jugos de la Base de Datos que Laravel debe de actualizar
Eliminar (Delete)
Para eliminar un registro de la Base de Datos voy a crear el método eliminar()
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
// Eliminar un Registro public function eliminar($id) { // Indicamos el 'id' del registro que se va Eliminar $jugos = Jugos::find($id); // Elimino la imagen de la carpeta 'uploads', esto lo veremos más adelante $imagen = explode(",", $jugos->img); Storage::delete($imagen); // Elimino el registro de la tabla 'jugos' Jugos::destroy($id); // Muestro un mensaje y redirecciono a la vista principal Session::flash('message', 'Eliminado Satisfactoriamente !'); return Redirect::to('admin/jugos'); } |
Con esto ya tenemos los métodos necesarios para que funcione nuestro CRUD sin problemas, estos son para el lado del servidor (Back-end)
Tanto en el método para Actualizar como en el método para Eliminar pasamos la variable o dato $id, para que tengas una idea de este dato la siguiente imagen de la tabla jugos de la Base de Datos en donde cada registro tiene un id único
Laravel necesita saber cual es el id del registro de la tabla jugos que debe gestionar.
Entorno para la Imagen
Voy a crear una carpeta con el nombre uploads en donde Laravel gestionará las imágenes para cada registro o jugo, esta carpeta es necesaria para los métodos Crear, Actualizar y Eliminar de mi sistema CRUD.
Esta carpeta la voy a crear en la carpeta public ya que debe ser pública para poder usarla en mi sistema CRUD, la ubicación exacta en donde debo crear la carpeta uploads es en public > uploads
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 |
/miaplicacionlaravel ├── /app ├── /bootstrap ├── /config ├── /database ├── /public ├── /uploads // Crea esta carpeta para las imágenes ├── /resources ├── /routes ├── /storage ├── /tests ├── /vendor ├── .editorconfig ├── .env ├── .env.example ├── .gitattributes ├── .gitignore ├── .styleci.yml ├── artisan ├── composer.json ├── composer.lock ├── package.json ├── phpunit.xml ├── server.php ├── webpack.mix.js ├── yarn.lock |
Para que Laravel tenga conocimiento que usaré la carpeta uploads para gestionar los archivos de mi CRUD, lo debo de configurar en el archivo de configuración para los archivos llamado filesystems.php que se encuentra en config > filesystems.php
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 |
/miaplicacionlaravel ├── /app ├── /bootstrap ├── /config ├── filesystems.php // Abre este Archivo ├── /database ├── /public ├── /resources ├── /routes ├── /storage ├── /tests ├── /vendor ├── .editorconfig ├── .env ├── .env.example ├── .gitattributes ├── .gitignore ├── .styleci.yml ├── artisan ├── composer.json ├── composer.lock ├── package.json ├── phpunit.xml ├── server.php ├── webpack.mix.js ├── yarn.lock |
Abre el archivo filesystems.php y ve a la línea para configurar el disco local en disks -> local -> root
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 |
'disks' => [ 'local' => [ 'driver' => 'local', 'root' => public_path('uploads'), // Defino la carpeta 'uploads' para los archivos ], 'public' => [ 'driver' => 'local', 'root' => storage_path('app/public'), 'url' => env('APP_URL').'/storage', 'visibility' => 'public', ], 's3' => [ 'driver' => 's3', 'key' => env('AWS_ACCESS_KEY_ID'), 'secret' => env('AWS_SECRET_ACCESS_KEY'), 'region' => env('AWS_DEFAULT_REGION'), 'bucket' => env('AWS_BUCKET'), 'url' => env('AWS_URL'), ], ], |
Por último si crees que tiene problemas con la carpeta uploads, puede que tengas que darle permisos para poder Leer y Escribir archivos en ella.
Si estas en un servidor de Pago, ve al gestor de archivos y directorios de tu servidor, ubica la carpeta uploads y dale el permiso necesario sin arriesgar la seguridad de tu servidor, le puedes dar el permiso 755
Notas
- Hasta aquí hemos creado nuestro Controlador JugosController.php con los métodos necesarios para realizar las operaciones de nuestro CRUD.
- Los Pasos y opciones mencionadas en este capitulo del tutorial pueden cambiar, esto no depende de nosotros, si no de las empresas que dan soporte a estas herramientas como Laravel y Bootstrap, que suelen cambiar sus opciones de despliegue y configuración en futuras versiones.
Síguenos en nuestras Redes Sociales para que no te pierdas nuestros próximos contenidos.
- Laravel Tutoriales
- 26-07-2019
- 05-12-2019
- Crear un Post - Eventos Devs - Foro
Seguimos trabajando las 24 horas del día para brindarte la mejor experiencia en la comunidad.
Hemos corregido el problema y ahora la web no muestra esa barra horizontal y se ve en su tamaño natural.
Seguimos trabajando las 24 horas del día, para mejorar la comunidad.
Seguimos trabajando las 24 horas y 365 días del año para mejorar tu experiencia en la comunidad.
Seguimos trabajando para brindarte le mejor experiencia en Nube Colectiva.
