Ticker

6/recent/ticker-posts

CRUD con Laravel 8, MariaDB y Visual Studio Code - 1ra Parte: Configurar y crear la base de datos


En este articulo daré por inicio la elaboración paso a paso del ya clásico y conocido CRUD con Laravel 8, PHP 7.3.27 y MariaDB v10.4.18 con el IDE Visual Studio Code (VS Code); en esta primera parte veremos las configuraciones previas y creación de la base datos. Asimismo, aclarar que para este articulo se asume que ya estas familiarizado con la terminal de VS Code, Laravel (o php, que no es ni el 20% ya que Laravel es un contexto muy diferente al famoso código espagueti en mi opinión personal), MariaDB y Visual Studio Code.

1. Líneas de comando a utilizar desde el terminal de Visual Studio Code:

php artisan serve: Iniciar el server.


php git: Iniciar el repositorio git, con la finalidad de poder subir a GitHub.
git add .: Para agregar todo lo ficheros.
git commit -m "ingresar_comentario": Para guardar los cambios y generar la versión de dicho cambio.
git branch Create: Para crear la rama Create.

Recuerda que debes crear tu repositorio de trabajo, te recomiendo revisar el punto 1 y 2 del articulo Trabajando con Git.

2. Configuraciones previas:

2.1. Configurar la base de datos desde el archivo .env que se ubica en la raíz del proyecto o repositorio de trabajo. Ingresa los datos necesarios para la conexión a la base de datos, incluyendo el nombre la DB_DATABASE=test-laravel.

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=test-laravel
DB_USERNAME=root
DB_PASSWORD=

2.2. Modificar el Providers para trabajar con MariaDB, para lo cual debemos ubicar el archivo  AppServiceProvider.php "Providers\AppServiceProvider.php", en dicho archivo añadimos la librería "use Illuminate\Support\Facades\Schema;"

use Illuminate\Support\Facades\Schema;//Agregado como parte de la configuración inicial

3.3. Aún están en el mismo archivo AppServiceProvider.php, en la función boot debemos llamar al método estático Schema y pasarle el parámetro 191 con la finalidad de conectarnos a la base de datos de MariaDB.

    public function boot()
    {
        Schema::defaultStringLength(191);
    }

3. Creando la base de datos MariaDB:

3.1. Puedes crear desde phpMyAdmin, MySQL WorkbenchSQLyog u otro de tu preferencia - en mi caso uso SQLyog.
3.2. Crear la base de datos de nombre test-laravel por script o modo gráfica considerando el utf8_spanish_ci.

CREATE DATABASE `test-laravel` 
/*!40100 DEFAULT CHARACTER SET utf8 COLLATE utf8_spanish_ci */;
USE `test-laravel`;

4. Creando las tablas desde Laravel:

4.1. Desde el terminal de VS Code ingresamos el comando "php artisan make:migration create_roles_table". Se debe realizar los mismo pasos para la tabla employees o demás tablas que deseas crear.


4.2. Seguidamente nos ubicamos el directorio database\migrations de nuestro repositorio de trabajo. Se visualizarán 5 ficheros de los cuales 3 de ellos es generado por defecto.


4.3. Modificar el schema de las tablas creadas para lo cual abrimos los siguientes ficheros y agregamos los campos:

2021_04_30_173905_create_role_table.php

    public function up()
    {
        Schema::create('role'function (Blueprint $table) {
            $table->bigIncrements('id');
            $table->string('roles');
            $table->timestamps();
        });
    }

2021_04_30_174329_create_employee_table.php

    public function up()
    {
        Schema::create('employee'function (Blueprint $table) {
            $table->bigIncrements('id');
            $table->string('firstname');
            $table->string('lastname');
            $table->string('email');
            $table->integer('idrole');          
            $table->timestamps();
        });
    }

Les recomiendo revisar la documentación oficial de Laravel para entender y conocer acerca de Schema Builder.

4.4. Subimos los cambios hacia la base de datos haciendo uso del comando "php artisan migrate" desde el terminal de VS Code.


4.5. Finalmente validamos ingresando a SQLyog Enterprise para ver la creación de las tablas en nuestra base de datos test-laravel.



6. Creando la vista Layouts:

6.1. Creamos el directorio layouts dentro del directorio principal views.
6.2. Seguidamente creamos la vista layouts de nombre base.blade.php.
6.3. A continuación agregamos el código html (le podre el titulo de <title>Laravel | Demo 01 - CRUD</title>), y linkeamos  los CDNs de bootstrap/4.0.0 para los estilos y font-awesome/5.15.3 para los iconos. 

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width. initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Laravel | Demo 01 - CRUD</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" 
    integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" 
    crossorigin="anonymous">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
<head>
<body>
</body>
</html>

6.4. Para finalizar la creación de la vista layouts en el archivo  AppServiceProvider.php "Providers\AppServiceProvider.php" referenciamos a la librería de Bootstrap y agregamos la línea Paginator::useBootstrap(); en la función boot del mismo archivo - esto nos servirá para realizar el paginado en nuestra lista:

//Referenciar Pagination Bootstrap
use Illuminate\Pagination\Paginator


public function boot()
    {
        Schema::defaultStringLength(191);
        Paginator::useBootstrap();
    }

La vista layouts será referenciada o extendida en nuestras demás vista como crear, listar y actualizar.

Recordemos que Layout View es una página maestra, que define una apariencia común que será usada por otras vistas. 


Conclusiones:

En esta primera parte hacemos uso de algunos comando desde la terminal de VS Code y se ha realizado las configuraciones necesarias para la creación de la base datos y sus tablas respectivas, asimismo se a validado la creación de la tablas desde el SQLyog Enterprise.

Descarga la fuente desde:

Gratitud a Dios 😊 y gracias a todos ustedes por la acogida de este nuevo articulo, éxitos y bendiciones 🙏 y un gran abrazo a todos ✌...!!!

Publicar un comentario

0 Comentarios