Tabla de Contenido
Temario
Lecciones por cada unidad de estudio con videos sobre el proceso de desarrollo y textos explicativos del código.
Puesta en escena
1. Presentación
Presentación del Curso, temario, vista de código y demostración.
2. Base de datos
Diseño de la Base de datos además de la posibles relaciones de uno a varios para optimizar las consultas en la Base de Datos: Categorias, Empresas, Users
3. Instalación de Laravel y React JS
Pasos para la Instalación de Laravel 10 y React JS 18, integración para un funcionamiento óptimo, además de vincular Bootstrap para aplicar diseño CSS
API Rest | BackEnd
4. Modelos y relaciones
Implementación de Modelos como User, Categoria y Empresa además de las relaciones de integridad referencial. Migración para obtener las tablas en MYSQL
5. Rutas y Controladores
Implementación de las Rutas protegidas y públicas para la API Rest y la creación de los Controladores vinculados a las rutas
6. Roles de Usuarios admin | client
Creación de Roles de Usuarios: admin y client con la instalación y configuración del paquete Spatie Laravel-permission para la autenticación en Laravel
7. Registro de usuarios
Implementación de la funcionalidad para permitir el Registro de usuarios controlando el rol, codificación y testing. Uso de la extensión ThunderClient
8. Login de usuarios
Método Login de usuarios en la Api Rest, acceso a los usuarios mediante la gestión de tokens con el paquete Sanctum de Laravel.
9. Logout de usuarios
Implementación del método Logout para destruir el token del usuario autenticado, y asi desconectar al usuario de la aplicación web.
10. CRUD User
Implementación de los métodos index, show y update para gestionar la tabla de user
11. CRUD Categoría
Implementación del CRUD: index, store, show, update y destroy en controlador CategoriaController para el modelo Categorías
12. CRUD Empresa
Implementación de los métodos CRUD index, store, show, update y destroy para el modelo Empresa en el EmpresaController
Autenticación en React Js
13. Rutas y Layouts
Definiendo Rutas y Layouts en React JS para organizar las vistas del Rol Admin y las vistas del Rol Client; además de gestionar las rutas protegidas
14. AuthUser - Token
Implementación de las funciones para gestionar los tokens con sessionstorage en Javascript, tanto para guardar el token, el user y rol
15. Registro de usuarios
Registro de un usuario con el Rol Admin y Client en React JS
16. Login de usuarios
Login de un usuario con el Rol Admin y Client en React JS
17. Logout de usuarios
Logout de un usuario con el Rol Admin y Client en React JS
Rol Admin | User
18. PanelAdmin
Implementación de un panel de administración sencilla para el usuario con el rol admin
19. UserAll mostrar usuarios
Implementación del componente para mostrar todos los usuarios con el rol client que se han registrado en el directorio de empresas
20. UserUpdate Aprobación del usuario
Implementar el componente UserUpdate para actualizar algunos datos del usuario como la aprobación del registro en la plataforma web.
Rol Admin | Categoria
21. CategoriaAll mostrar categorias
Implementación del componente CategoriaAll para mostrar todas las categorías, además de los enlaces para crear, editar y eliminar una categoría
22. CategoriaStore Agregar una categoría
Implementación del componente CategoriaStore que permita agregar una nueva categoría por parte del Rol admin
23. CategoriaUpdate Actualizar Categoría
Implementación del componente CategoriaUpdate que permita actualizar algunos datos y/o imagen de Categoría
24. CategoriaDelete Borrar categoría
Implementación del componente CategoriaDelete que permita borrar una categoria de la base de datos diremp
Rol Admin | Empresa
25. EmpresaAll mostrar empresas
Implementación del Componente EmpresaAll para mostrar todos los registros de la tabla empresas de la base de datos.
26. EmpresaUpdate aprobar empresa
Implementación del componente EmpresaUpdate para aprobar el registro de una empresa por parte del rol admin.
Rol Client | Empresa
27. Panel Client
Panel de administración para el rol client para gestionar sus privilegios en el directorio de empresas.
28. EmpresaAll mostrar empresas
Implementación del componente EmpresaAll para mostrar todos los registros de las empresas que estén relacionadas con el usuario que tiene el rol client
29. EmpresaStore Agregar empresa
Implementación del componente EmpresaStore que permita agregar una nueva empresa al usuario con el rol client.
30. EmpresaUpdate Actualizar Empresa
Desarrollo del componente EmpresaUpdate que permita al rol client actualizar los datos de sus empresas y estos se almacenen en la BD.
Páginas públicas
31. Rutas y Mockups
Definimos las rutas públicas en React JS como en la Api Rest y los diseños en mockups de las interfaces de nuestra aplicación web
32. Página Home
Diseño e implementación de la página principal que será la portada de nuestra aplicación web.
33. Componente Search
Implementación del componente Search para obtener las empresas según un texto ingresado
34. Componente Modal
Diseño e implementación de una ventana modal dinámica en React JS
35. Página Categorías
Diseño e implementación de la sección categorias donde mostraremos todas las categorías creadas por el rol admin
36. Página Categoría
Diseño e implementación de la sección Categoría para mostrar los datos de dicha categoría además de las empresas relacionadas con la categoría.
Extras
38. Diseño con Bootstrap
Estamos en la etapa final donde vamos a agregar un poco de diseño a nuestro aplicación web usando el frameworks Bootstrap.
Descripción del curso
Es un curso avanzado en el cual vamos a desarrollar una aplicación web fullstack 100% práctica que permita gestionar un directorio de empresas. Con una distribución por lecciones, cada lección tiene un video y el código en detalle de la lección.
Con la adquisión del curso tiene acceso al código fuente completo del proyecto para ser descargado. Que le puede servir como guía en el desarrollo de sus propios proyectos.
No vamos a explicar fundamentos de React JS o Laravel, vamos de frente al grano.
¿Qué aprenderás?
En este curso aprenderás a desarrollar un Directorio de Empresas Administrable con el BackEnd en Laravel y el FrontEnd con React JS
Las principales funcionalidades:
- Integrar React JS en Laravel
- Implementación de una API Rest para Autenticación y gestión de datos (CRUD)
- Definir rutas publicas y privadas protegidas por un Token de autenticación
- Uso de Layouts en React JS
- Ventanas Modales en React JS
- Buscador
- Formulario de envio de datos con imágenes
- Peticiones http con Axios.JS
Requisitos
Requisitos tentativos para llevar el curso en mención:
- Conocimientos en el diseño y arquitectura de Base de Datos en MySql
- Conocimientos intermedios en el lenguaje de programación PHP
- Conocimientos básicos en el desarrollo de aplicaciones web con Laravel
- Conocimientos en el diseño de páginas web con HTML y CSS nivel intermedio
- Conocimientos Intermedios en programación con el lenguaje de programación Javascript.
- Conocimientos en el desarrollo de aplicaciones web con React JS.
- Conocimientos en el funcionamiento de una API Rest.
FRAMEWORKS - LIBRERIAS:
- LARAVEL [10.*]
- REACT JS [18.*]
- BOOTSTRAP [5.*]
LENGUAJES:
- PHP 8.*
. MYSQL
- JAVASCRIPT
- HTML
- CSS
HERRAMIENTAS:
- SISTEMA OPERATIVO: WINDOWS 10
- ENTORNO JAVASCRIPT : NODE.JS
- MANEJADOR DE PAQUETES PHP: COMPOSER
- SERVIDOR LOCAL: XAMPP
- NAVEGADOR WEB: GOOGLE CHROME
- EDITOR DE CÓDIGO: VISUAL STUDIO CODE
Código fuente
Disponible
- Acceso al código fuente
- Acceso a recursos gráficos
- Formato descargable ZIP
