30 - Como personalizar la plantilla de Jetstream - Curso Laravel 10 desde cero

Поделиться
HTML-код
  • Опубликовано: 15 окт 2020
  • En este capítulo de Laravel, aprenderás cómo personalizar la plantilla predeterminada de Jetstream en tu proyecto Laravel. Aprenderás cómo editar estilos CSS y archivos de Blade para modificar la apariencia y la funcionalidad de la plantilla. También cubriremos cómo mantener tus modificaciones actualizadas con las nuevas versiones de Jetstream y Laravel, y cómo crear tu propia plantilla personalizada desde cero utilizando Jetstream. Al final de este capítulo, tendrás un conocimiento profundo de cómo personalizar y crear plantillas con Jetstream.
    ------------------------------------------------------------------------------------------------
    CURSOS
    🔴 Facturacion electronica Perú: youtube.codersfree.com/larave...
    🟠 Laravel avanzado: youtube.codersfree.com/larave...
    🟢 Ecommerce: youtube.codersfree.com/ecommerce
    🔵 Api: youtube.codersfree.com/api-re...
    🟠 Plataforma de cursos: youtube.codersfree.com/plataf...
    🔴 Vue e Ineria: youtube.codersfree.com/vue-3-...
    🟣 Eloquent Avanzado: youtube.codersfree.com/eloque...
    🟡 Pasarela de pagos: youtube.codersfree.com/pasare...
    ⚫ Laravel Web Socket: youtube.codersfree.com/larave...
    🟣 Notificaciones: youtube.codersfree.com/notifi...
    🟢 Laravel Excel: youtube.codersfree.com/larave...
    🔵 Digital Ocean: youtube.codersfree.com/despli...
    🟡 Laravel Voyager: youtube.codersfree.com/larave...
    🟣 Datatable Livewire: youtube.codersfree.com/datata...
    🟠 Tenancy for Laravel: youtube.codersfree.com/multi-...
    🔵 TDD Laravel: youtube.codersfree.com/tdd-la...
    ⚫ Traducir páginas: youtube.codersfree.com/traduc...
    🟠 Wire UI: youtube.codersfree.com/livewi...
    🔴 Acortador de links: youtube.codersfree.com/acorta...
    🟡 Banhammer for laravel: youtube.codersfree.com/banham...
    🟢 Laravel backup: youtube.codersfree.com/larave...
    🔵 Actualizar a Laravel 10: youtube.codersfree.com/actual...
    -----------------------------------------------------------------------
    DONACIONES
    Patreon: / codersfree
    PayPal: www.paypal.com/paypalme/Coder...
    -----------------------------------------------------------------------
    Plataforma: codersfree.com/
    Grupo: / 4314830498588670
  • НаукаНаука

Комментарии • 59

  • @AntonioGonzalez-dd2ce
    @AntonioGonzalez-dd2ce 3 года назад +5

    Que bueno eres, me dejas loco, curso de Livewire con Alpine próximamente, lo espero con ansia. gracias, gracias y gracias....
    Lo explicas tan fácil que hasta yo me entero de cómo funcionan los componentes.
    Saludos desde Málaga - Andalucía - España

  • @latlov
    @latlov 3 года назад +13

    8:20 Modificar el título del Dashboard
    10:29 Agregar Links al menú de navegación
    15:50 Los elementos del menú están separados. Uno es para el responsive
    16:58 Modificar el logo "x-jet-application-mark"
    18:37 php artisan vendor:publish --tag=jetstream-views

  • @JordyCastro
    @JordyCastro 3 года назад +1

    Agradecido por la dedicación que le das a cada detalle en tus videos, Justamente realicé una consulta en la comunidad de facebook, referente al middleware con la ruta base y sobre los componentes públicos ya modificados para producción, una vez mas, Gracias por tener Vocación! Compartiré tus cursos en mis redes!

  • @jmaurich
    @jmaurich 3 года назад

    Como siempre magistral profe. Un abrazo grande.

  • @JonasReyes
    @JonasReyes 3 года назад

    Gracias Profe!! uff viene arduo trabajo, pero sin duda es vital. Voy a ir estudiando esa libreria javascript Alpine, no la conozco pero quiero saber de ella antes del próximo video! Gracias por mostrarnos lo mejor!!

  • @danielrolando6883
    @danielrolando6883 3 года назад

    Gracias.. Esperamos los proximos videos.. fulll

  • @aztecsavo82
    @aztecsavo82 3 года назад

    Muy bien estan excelentes los videos Saludos!!! \m/

  • @cristianleal3416
    @cristianleal3416 3 года назад

    Excelente, muy bien explicado!

  • @FranciscoJunior29
    @FranciscoJunior29 3 года назад

    Excelente muito bom, didático e de fácil assimilação.

  • @manug6186
    @manug6186 11 месяцев назад

    excelente explicacion, muchas gracias

  • @cesarcastaneda4334
    @cesarcastaneda4334 3 года назад

    Buenísimo!! Gracias

  • @susanaramirez8374
    @susanaramirez8374 3 года назад

    Son muy buenos tus videos!

  • @cyborgcoders
    @cyborgcoders 3 года назад

    Eres un crack bro

  • @santiagolopera5866
    @santiagolopera5866 2 года назад

    Excelente todos tus cursos, te lo agradezco enormemente. Podrías hacer un tuto para integrar las rutas de autenticación jetstream con las rutas web que uno pueda tener en un proyecto anterior? Traté de coger un proyecto viejo y cuando sigo el tutorial tuyo sobre rutas y si descomento la linea de las rutas del appserviceprovider me funcionan las web antiguas pero no las de jetstream

  • @lebaf8661
    @lebaf8661 3 года назад

    Buenaa gracias, jaja me fue de ayuda tu video el comando me sirvió, pero despues para cambiar el logo, no toque esos archivos con los svg, lo mejor es por ejemplo para cambiar el logo, ir a la vista y donde diga o algo asi colocar , saludos!!

  • @ricardoalonso8234
    @ricardoalonso8234 3 года назад

    Estimado Victor, una consulta: en mi vista app.blade.php usa mix() en vez de assets() y para llamar alpine usa {{ mix('js/app.js') }} y dentro de app.js hay un requiere alpine y un requiere bostrap. Es una versión diferente. Gracias

  • @jhonatanvidal2620
    @jhonatanvidal2620 2 года назад +1

    Hola tengo una duda, existe alguna diferencia en rendimiento al extender de una plantilla usando extends y no mediante componentes? o porque ahora se extiende de esa manera por componentes como queriendo reemplazar al extends. lo mismo con lo del yield y sections ahora son slots. No entiendo muy bien esa deferencia y el porque. Muchas gracias por el contenido.

  • @JaimeReyCasadoMonokepos
    @JaimeReyCasadoMonokepos 2 года назад +1

    hola, veo que en la última versión usa el método mix() en vez de asset(), ¿hay alguna diferencia o es solo cuestión de versiones? Gracias

  • @joseperdomo8180
    @joseperdomo8180 Год назад

    Buenas tardes, mira un apregunta y duda, en lo que veo en tu proyecto tu importas todo a traves x-jet-nombre pero en mi proyecto creado en 10 con jestream livewire en ningun lado los componebtes los importa a treaves de x-nombrecomponente

  • @carminemaggio5464
    @carminemaggio5464 3 года назад

    Mi Layout en lugar de traer los recursos de CSS y JS con la función asset(), los esta trayendo con la función mix(). Que significa esta??

  • @edsermoreno7629
    @edsermoreno7629 3 года назад

    Un amigo canadiense me comentaba hace poco que: Cuando le tocó aprender Anular II, "debió desaprender todo lo que sabía acerca de Angular I", ya que todo era totalmente diferente. Laravel 8 apenas lo estoy conociendo y es tan o más interesante que sus hermanitos menores. He estado procrastinando para atacar el tema de los componentes blade, pero estoy viendo que no hay más opciones... Saludos a nuestros amigos programadores.

  • @iTzCeleriX
    @iTzCeleriX 3 года назад +1

    Que paginas me recomiendas para sacar plantillas de jetstream

  • @naren9532
    @naren9532 3 года назад

    Hola tengo una duda. si yo deseo modificar el campo de email en el registro para hacer es la creacion de usuario, es decir, usuario1, usuario 2, admin21, en fin, no quiero que sea con correo electronico donde puedo modificar esas lienas.

  • @wildogreco5102
    @wildogreco5102 3 года назад

    Amigo en dashboard.blade.php llama al componente . donde esta ese componente, no lo encuentro. es lo mismo que del welcome.blade la parte de abajo. lo elimino pero sigue apareciendo y no se cual es el archivo donde esta el component

  • @TheJorgesaw
    @TheJorgesaw 5 месяцев назад

    Cuando abro la aplicación web por Xampp las opciones de usuario en el dashboard no me aparecen. En cambio cuando abro la aplicación con el server de Laravel (php artisan serve) si funciona todo correctamente. ¿Alguién puede decirme por qué?

  • @antoniolanas481
    @antoniolanas481 3 года назад

    Hola Victor, preguntas: ¿estoy en lo cierto cuando digo que hay que usar jetstream para los usuarios del sitio web y admin lte ó por ej spatie/laravelpermission aparte para la parte de administración? o ¿crees que se deberia usar Jetstream para ambos? gracias!
    Animo a la gente a que se haga tu mecenas aunque eso suponga que cada vez tengas más usuarios y el trato contigo ya no sea tan directo :(, aunque realmente te lo mereces amigo. Gracias por tus cursos. Saludos desde Madrid - España ;)

    • @CodersFree
      @CodersFree  3 года назад +1

      Hola tanto jetstream y adminlte son plantillas. Si gustas podrias usar también jetstream en la parte administrativa.
      Laravel Permission es para asignar permisos administrativos a tu web. Por ejemplo que cierta sección de la web sólo lo pueda ver ciertas personas y no todos

  • @danielocanto3968
    @danielocanto3968 3 года назад

    Holaaa, cuando entro en el login no me cargan los estilos de tailwild, lo acabe de instalar todo como tú lo dijiste y aparece como si no tuviera los estilos agregados... Aparece el icono azul grande y el formulario abajo a la izquierda sin estilos... Por favor que alguien me ayude, es urgente

  • @gmarce57
    @gmarce57 3 года назад

    Hola, me da este error "Unable to find component: [navigation-menu]" @livewire('navigation-menu') que reemplaza a @livewire('navigation-dropdown') y el archivo navigation-menu.blade.php existe

  • @carloscana7780
    @carloscana7780 2 года назад

    Por ejemplo si ya inicie sesion y quiero retornar al login, no deberia permitirmelo como configuro eso

  • @dantech9924
    @dantech9924 2 года назад

    exelente curso amigo, grande, lo engorroso de laravel es el monton de archivos y ficheros que trae, cuando se empieza es un poco abrumador, pero es de costumbre

  • @vicarevalo8878
    @vicarevalo8878 2 года назад

    no puedo hacer funcionar los estilos de tailwind no me funcionan ni los background ni los margenes alguien sabe que puede estar pasando?

  • @tecnoaulaarg
    @tecnoaulaarg 2 года назад

    como se personaliza el logo?

  • @MrDarumon
    @MrDarumon 3 года назад

    Entonces por cada elemento del menú superior debo de añadirlo siempre una vez en el archivo de escritorio y luego en el archivo de responsive?

    • @CodersFree
      @CodersFree  3 года назад +2

      Así es. Aunque también podríamos poner los elementos del menú en un array, y luego utilizarlo en un foreach, para imprimirlo tanto en el menú de deskopt como en el menú de móvil, y de esa manera si queramos agregar un nuevo link, solo lo agregamos en el array y se vería reflejado en ambos menús.
      En próximos videos enseñaré cómo hacerlo

  • @edgarrodriguez1461
    @edgarrodriguez1461 2 года назад

    Victor gracias por el aporte!!, tengo un inconveniente no me cargan los estilos de tailwild, ejecute npm install y npm run dev. pero al ejecutar php artisan serve, si me cargan los estilos. como solucionaria los estilos, para no estar ejecutando ese comando?. muchas gracias de antemano

    • @GerardoEnriquezITIPUMPER
      @GerardoEnriquezITIPUMPER 2 года назад

      Hola bro, estuve dos días con ese problema hasta que el mismo chico de los videos contesto a alguien que en el archivo tailwind.conf.js hay que comentar la linea mode: 'jit' volver a correr npm rud dev y asunto resuelto :D

  • @angelicamendoza8054
    @angelicamendoza8054 2 года назад

    Hola!! Tengo una pregunta. hay alguna forma para que el menu de información de perfil se muestre en español? Tengo mi aplicación configurada con locales 'es', pero aún así lo muestra en inglés. Gracias por la ayuda que seguro encontraré en uds!!

    • @CodersFree
      @CodersFree  2 года назад +1

      ruclips.net/video/gL5oO63sT5I/видео.html

  • @zantsama
    @zantsama 4 месяца назад +1

    Lo de jet ya esta descatualizado amigo, ya jetstream crea la carpeta componentes en resources con todos los archivos ahí. Excelente video igualmente

  •  2 года назад

    Hola Saludos, espero se encuentren todos bien.
    ¿Hay alguna manera de cambiar el inicio de sesión de mail/password a username/password?

    • @CodersFree
      @CodersFree  2 года назад +1

      Hola Pablo, si hay forma. Te recomiendo que leas la documentación en la sección de autenticacion

  • @vaidenait
    @vaidenait 3 года назад

    puede ser que hayan cambiado cosas desde que hiciste este video? .. al instalarlo en vez de assets() pone mix() , no tengo la librería de alpine y los estilos de tailwind no funcionan por ejemplo los colores .. ¿ me ha fallado algo en la instalación o hay cosas nuevas?

    • @CodersFree
      @CodersFree  3 года назад +4

      Efectivamente, han cambiado algunas cosas. Ahira usan mix, en vez de asset, y Alpine ahora lo compilan en el archivo js.
      Pero los paso siguen siendo los mismos, tienes que instalar npm y ejecutar npm run dev y tendrás cargado tailwind y Alpine en tu proyecto

    • @robertsosa3415
      @robertsosa3415 3 года назад +1

      En la última versión de tailwind eliminaron algunos colores como por ejemplo los tonos de naranja, por eso no se muestran

    • @vaidenait
      @vaidenait 3 года назад

      @@robertsosa3415 gracias por la aclaración ! .. como han pasado unos días no te lo puedo indicar con seguridad, pero diría que probé con otros colores, .. probaré de nuevo.

    • @robertsosa3415
      @robertsosa3415 3 года назад +1

      @@vaidenait Yo revisé en la documentación de tailwind y ahí fue que me di cuenta que eliminaron los tonos naranjas, allí puedes comprobar cuales colores están y cuales ya no

  • @joseolarte5532
    @joseolarte5532 3 года назад

    ¿Es indistinto utilizar un componente blade o uno de livewire?, ¿cuando utilizar uno u otro?, gracias.

    • @CodersFree
      @CodersFree  3 года назад +2

      Un componente Livewiere se utiliza cuando quieres que una sección de tu página se actualoce dinámicamente con información de tu base de datos sin recargar la pagina. Por ejemplo para hacer un buscador, un crud en el que al agregar o eliminar un nuevo registro se actualice la tabla sin necesidad de recargar la pagina, etc.

    • @CodersFree
      @CodersFree  3 года назад +2

      Un componente de blade en cambio se utiliza para reutilizar código html, sin tener que estar copiando y pegando toda la estructura

    • @antoniolanas481
      @antoniolanas481 3 года назад

      @@CodersFree y mi pregunta es: ¿y como se hace si uno quiere reutilizar un componente livewire ?

    • @CodersFree
      @CodersFree  3 года назад

      ? Pues lo llamas cuantas veces quieras utilizarlo

  • @max427
    @max427 2 года назад

    es un poco complicado entender la combinación de alpine liverwire blade y componentes :(, uno viene del mundo bootstrap donde era mas lindo o react

  • @secundariab.2741
    @secundariab.2741 3 года назад +2

    Soy el unico que se desespera cuando esta siguiendo los pasos y se detiene a decir "esto no lo veremos a fondo, pero hare un curso con respecto al tema" mejor explicalo todo igual lo entendemos xd

  • @miformadepensar
    @miformadepensar 3 года назад

    Disculpa mi desconocimiento.para ver un componente, debo generar una vista que a su vez debe tener una ruta, que a su vez llama al controlador así como dices en el video 4 debe pasar una ruta controlador el controlador llamaría la vista y la vista llamaría a los componentes, exactamente igual pero en vez de llamar directamente a la vista para este caso llamaría a (app/view/miComponente) o (app/liveware/miComponente) y este se encargaría de llamar la vistas. y gracias por responder o ayudarme

    • @CodersFree
      @CodersFree  3 года назад +1

      No te entendí 😅
      Te sugiero que veas los dos videos anteriores, ahí me explayó sobre el uso y creación de los componentes.

    • @miformadepensar
      @miformadepensar 3 года назад

      @@CodersFree si me imagine porque nadie sabe. si vi todo los videos. pero tu usas la misma welcome no generas ninguna make:livewire solo crear un componente y lo llamas, desde la plantilla ya creada; pero desde la ruta no.! (spa) vueroute carga todo las vistas en una sola. eso es lo que me refiero.

    • @CodersFree
      @CodersFree  3 года назад +1

      Creo que estás confundiendo los componentes de blade con los componentes de Livewiere.
      Los componentes de Livewiere aún no lo he tocado. Lo explicare en un curso aparte que iniciaré la próxima semana sobre livewiere