Capítulo 3 – Instalación de Laravel y React JS – Curso ReactJS y Laravel Directorio de Empresas

Curso ReactJS y Laravel Directorio de Empresas

Capitulo 3 ➜ Instalación de Laravel y React JS

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

Instalación de Laravel y React JS

app.js

import './bootstrap';
import './App.jsx';

App.jsx

import React from 'react'
import ReactDOM from 'react-dom/client';
import 'bootstrap/dist/css/bootstrap.min.css'

const App = () => {
  return (
    <div>
        App codea
        <button className='btn btn-primary'> BOTON</button>
    </div>
  )
}

export default App

if (document.getElementById('root')) {
    const Index = ReactDOM.createRoot(document.getElementById("root"));

    Index.render(
        <React.StrictMode>
            <App/>
        </React.StrictMode>
    )
}

welcome.blade.php

<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>DIRECTORIO DE EMPRESAS LARAVEL - REACT</title>   
    @vite("resources/js/app.js")
</head>
<body>
    <div id="root"></div>    
</body>
</html>

vite.config.js

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
//import react from '@vitejs/plugin-react';

export default defineConfig({
    plugins: [
        laravel({
            input: [
                'resources/sass/app.scss',
                'resources/js/app.js',
            ],
            refresh: true,
        }),
        //react(),
    ],
});

1151 visitas

« Capítulo 2 – Base de datos

Capítulo 4 – Modelos y relaciones »

{ Curso ReactJS y Laravel Directorio de Empresas }

Compartir link con tus amigos

Descarga el código del proyecto

Descarga el código fuente del proyecto adquiriendo el curso completo

Comprar

Indice

Puesta en escena

1 Presentación 2 Base de datos 3 Instalación de Laravel y React JS

API Rest | BackEnd

4 Modelos y relaciones 5 Rutas y Controladores 6 Roles de Usuarios admin | client 7 Registro de usuarios 8 Login de usuarios 9 Logout de usuarios 10 CRUD User 11 CRUD Categoría 12 CRUD Empresa

Autenticación en React Js

13 Rutas y Layouts 14 AuthUser - Token 15 Registro de usuarios 16 Login de usuarios 17 Logout de usuarios

Rol Admin | User

18 PanelAdmin 19 UserAll mostrar usuarios 20 UserUpdate Aprobación del usuario

Rol Admin | Categoria

21 CategoriaAll mostrar categorias 22 CategoriaStore Agregar una categoría 23 CategoriaUpdate Actualizar Categoría 24 CategoriaDelete Borrar categoría