Como Crear un Sistema de Notificaciones (Frontend) con Laravel 8 y MySQL – Parte 2

4 minuto(s)

En esta página:

En la Parte anterior llamada Como Crear un Sistema de Notificaciones (Frontend) con Laravel 8 y MySQL – Parte 1 creamos un nuevo proyecto con Laravel 8, realizamos la conexión a la base de datos y creamos las migraciones de 2 tablas llamadas jugos y postres, en esta Parte 2 vamos a crear una tabla para almacenar las notificaciones de nuestro sistema de notificaciones, vamos con ello.

Partes

Parte 1
Parte 2
Parte 3

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

Asimismo te invito a escuchar el Podcast: “Donde buscar ayuda sobre Programación”:

Spotify	SoundCloud	Apple Podcasts

Bien ahora continuemos con el Post: Como Crear un Sistema de Notificaciones (Frontend) con Laravel 8 y MySQL – Parte 2.

Para tener una mejor organización de las notificaciones, las vamos a almacenar en una tabla de nuestra base de datos, Laravel nos provee una manera rápida de hacerlo, esto lo veremos a continuación.

Tabla Notificaciones

Cuando se crea un nuevo registro en nuestra tabla jugos o postres, automáticamente creamos y almacenamos una notificación en la base de datos, para almacenar estas notificaciones vamos a crear una tabla, Laravel cuenta con un comando que nos crear una tabla con el formato y los campos adecuados, vamos a nuestra consola de comandos y ejecutamos el siguiente comando.


php artisan notifications:table 

Migration created successfully!

php artisan notifications:table

Migration created successfully!

Luego de ejecutar el comando anterior, Laravel nos ha creado un archivo de migración llamado 2021_01_10_112937_create_notifications_table.php, cuando tu creas este archivo, Laravel le pone de nombre la fecha y hora en que fue creado el archivo, entonces a ti te lo puede crear con otro nombre según la fecha y hora en que lo hayas creado.


/sistema-notificaciones-eventos-mysql-bd
├── /app
├── /bootstrap
├── /config
├── /database 
    ├── /database 
        ├── /migrations 
            ├── 2014_10_12_000000_create_users_table.php  
            ├── 2014_10_12_100000_create_password_resets_table.php 
            ├── 2019_08_19_000000_create_failed_jobs_table.php 
            ├── 2020_09_20_202007_create_jugos_table.php  
            ├── 2020_09_20_202311_create_postres_table.php  
            ├── 2021_05_06_174136_create_notifications_table.php // Archivo de migración de la tabla 'notifications' 
├── /public
├── /resources
├── /routes
├── /storage
├── /tests
├── /vendor
├──  .editorconfig
├──  .env 
├──  .env.example
├──  .styleci.yml
├──  artisan
├──  composer.json
├──  composer.lock
├──  package.json
├──  phpunit.xml
├──  server.php
├──  webpack.mix.js

/sistema-notificaciones-eventos-mysql-bd

├── /app

├── /bootstrap

├── /config

├── /database

├── /migrations

├── 2014_10_12_000000_create_users_table.php

├── 2014_10_12_100000_create_password_resets_table.php

├── 2019_08_19_000000_create_failed_jobs_table.php

├── 2020_09_20_202007_create_jugos_table.php

├── 2020_09_20_202311_create_postres_table.php

├── 2021_05_06_174136_create_notifications_table.php // Archivo de migración de la tabla 'notifications'

├── /public

├── /resources

├── /routes

├── /storage

├── /tests

├── /vendor

├── .editorconfig

├── .env

├── .env.example

├── .styleci.yml

├── artisan

├── composer.json

├── composer.lock

├── package.json

├── phpunit.xml

├── server.php

├── webpack.mix.js

Si abrimos el archivo 2021_05_06_174136_create_notifications_table.php podemos ver en su interior el contenido que tendrá nuestra tabla para almacenar las notificaciones.


<?php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

class CreateNotificationsTable extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        Schema::create('notifications', function (Blueprint $table) {
            $table->uuid('id')->primary();
            $table->string('type');
            $table->morphs('notifiable');
            $table->text('data');
            $table->timestamp('read_at')->nullable();
            $table->timestamps();
        });
    }

    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::dropIfExists('notifications');
    }
}

<?php

use Illuminate\Database\Migrations\Migration;

use Illuminate\Database\Schema\Blueprint;

use Illuminate\Support\Facades\Schema;

class CreateNotificationsTable extends Migration

{

/**

* Run the migrations.

* @return void

public function up()

{

Schema::create('notifications', function (Blueprint $table) {

$table->uuid('id')->primary();

$table->string('type');

$table->morphs('notifiable');

$table->text('data');

$table->timestamp('read_at')->nullable();

$table->timestamps();

});

}

/**

* Reverse the migrations.

* @return void

public function down()

{

Schema::dropIfExists('notifications');

}

En el código anterior podemos ver en la función up() los campos que este archivo de migración nos va crear en la base de datos, estos campos Laravel los ha creado automáticamente, es el formato necesario que Laravel nos pide y te recomiendo dejarlo tal cual como esta. Si quieres personalizar los campos de tu notificación, esto lo podrás hacer en la columna “data” que veremos mas adelante.

Bueno ahora ejecutamos el siguiente comando para realizar la migración y crear una tabla para las notificaciones.


php artisan migrate 

Migrating: 2021_05_06_174136_create_notifications_table
Migrated:  2021_05_06_174136_create_notifications_table (779.65ms)

php artisan migrate

Migrating: 2021_05_06_174136_create_notifications_table

Migrated: 2021_05_06_174136_create_notifications_table (779.65ms)

Luego de ejecutar el comando anterior se me ha creado una tabla llamada notifications en mi base de datos, si voy a PHPMyAdmin puedo ver que se ha creado esta tabla con sus respectivos campos o columnas.

Entonces tal como mencione anteriormente, cada ves que se creamos un nuevo producto en la base de datos, ya sea en la tabla jugos o postres, automáticamente vamos a crear y almacenar una notificación en esta tabla notifications que acabamos de crear.

Una vez que almacenamos una notificación, podemos utilizarla como deseemos, lo que yo haré será mostrar una notificación en la parte superior del sitio web, esto lo veremos en otro capitulo.

Bien hasta aquí llegamos con la Parte 2 en donde creamos la tabla notifications con un comando nativo de Laravel.

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)

En la Parte 3 vamos a crear nuestro archivo de notificaciones y haremos una prueba para verificar si se pueden insertar datos en la tabla notifications.
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.