📚 Tutorial Lit desde cero ¡CREA WEB COMPONENTS de forma declarativa y reactiva! ⚛️
HTML-код
- Опубликовано: 2 ноя 2021
- Lit es una biblioteca de Google que te permite crear Web Components de forma rápida y sencilla mientras mantiene un rendimiento brutal y mejora la experiencia de desarrollo gracias a añadir reactividad y ser declarativo.
En algunos casos recuerda un poco a React, especialmente cuando se trabajaba con clases, pero tiene su propio camino. Especialmente porque está muy basado en Web Components.
▶ No te pierdas más directos en: / midudev 
Наука
Ahhh Mil gracias por este video. Es lo que estaba esperando. Eres uno de Los mejores tutores del mundo 🙏👌👍
Por cierto midu, trabajo para ING españa como outsourcing, y efectivamente, están empezando a migrar a Lit. Yo conozco Lit desde polymer 2 y fue mi primer framework front incluso antes que angular y react
Acabo de ver este tutorial y la explicación es grandiosa espero profundices Lit y sigan haciendo contenido :D
Gran contenido, coincido: lit es una gran promesa, a más contenidos, que es por acá. Abrazo desde Arg.
Inicio de RUclips y sale esta belleza. Tremendo video 💥
Así se habla, ni en los tiempos antiguos en guerra se mata al mensajero! xd, buen video hermano éxitos.
Muchas gracias, Midu. Espero más adelante nos compartas más contenido sobre Lit y Web Components! 😄
Excelente tutorial, como te decía, yo llevo conociendo esta librería desde que era polymer 2, y este vídeo me ha ayudado a refrescar el conocimiento!
Súper interesante 👌🏻
Me viene genial para reemplazar un componente en diferentes codebase sin tener que hacerlo para cada una por separado 🔥
Desde que salió LitElement he seguido el proyecto de cerca. Realmente siento que puede definir el futuro de ES.
Lo conocí hace poco y lo comencé a usar y me ha gustado mucho, es muy interesante y mas creando monorepos
Midu explica muy bien, tiene el don, gracias
Spring framework trabaja similar con anotaciones aunque se usa para el back y es muy potente así que le veo futuro a lit, me parece que crecerá muy rapido
Gracias... eres el mejor... una sugerencia para otro video... me encantaría saber sobre three.js [creo que es el futuro de la web (el 3D)] por cierto (no he visto nunca a nadie escribir con tanta facilidad como a ti).... sigue así ...
Muy útil. Llevo ya unos años trabajando con Vue y echo en falta algo que sea 100% JavaScript y no tan "framework".
genial tutorial , en el min 43:40 el simbolo "!" es para decirle al compilador que no es null, el opcional es el "?", sos gigante midu saludos!!
Justo lo que andaba buscando!! Genial; porque la verdad React o Angular están bien...pero es mucho código. (Habría que ver el tema de escalado). Cómo era de esperar, tienes que codificar un poco más que con React o angular; precisamente porque es muy limpio.
Midu, extremadamente claro tus primeros minutos. Gracias!
Gracias!
Me gusta la idea de los web components y el planteamiento de Lit, lo que no me gusta es la utilización de class tanto en web components como en Lit, al final las clases en JavaScript solo son azucar sintáctico y no aportan nada.
Por eso me gusta más en enfoque de Hybrids, que busca solo la utilización de objetos y funciones, y nada de clases.
se puede usar lit como "microfrontends", para mezclarlo con equipos con angular y react?
excelente tutorial gracias por compartir
Me encantó esta librería, sin bromas, dan ganas de aprenderla. 🔥
Eso digo yo!
Excelente tu aporte
Partial templates es una nomenclatura que viene de antes: Backbone y Handlebars/Moustache
Hola midu te sigo desde hace ya un tiempo, gracias a tus posts en Linkedin. Eres muy bueno en lo que haces, primeramente felicitaciones! segundo, al final hiciste el comentario que habia posibilidades de hacer un proyecto con esta tecnologia la llegaste a realizar?
¿Haras mas videos sobre lit, o algun curso extra?
muy interesante esta tecnología. me parece que integra el trabajo de backend con frontend como un todo.
Cómo? 😕
Me gusto esa librería... Cuando hacemos una app
excelente haber la utilizare para hacer un landing page.
Cuando hagas esa "landing page", te recomiendo vigilar la ortografía ;)
Una comparativa con sveltekit? Me gusta más o se me hace más fácil sveltekit
Si tuvieras que elegir entre lit y react para un proyecto tipo "just-eat" por cual te decidirias? ventajas / desventajas?
lit, el wc es nativo a diferencia de react que viene siendo un super wc inmenso porque al final lo inyecta en un div root
podrias hacer un tutorial de adapt framework (y toma tu like prro)
Está muuuuy interesante 🙌
Totalmente, Pablo! Y creo que las últimas versiones lo han hecho todavía mejor!!
Has echo curso de lit ????
Me pasas el enlace please
Otra tecnologia Js. Aqui vamos de nuevo
Y ese proyecto crack, le damos jeje 🤪
google tiene angular y tira por lit?
Hola al dia de hoy con la salida de Lit 2 ya esta full soportado full SSR (server side rendering) ya se estan haciendo muchisimas cosas con esto
Como explico varias veces en el vídeo, la funcionalidad está en beta: www.npmjs.com/package/@lit-labs/ssr
De diez
Una joya de video
Muchas gracias!!!
41:00 no entedi esa parte, en el ejemplo de la documentacion del 2023 usan el spread operator como propagador
Sería posible utilizar algún preprocesador de CSS?
Si con webpack o rollup todo es posible…
Has un video sobre alpine js, saludos
Cool :)
Gracias!
Me recuerda muchísimo a Angular, pero me parece un poco más complicado. Nunca me ha gustado tener los template dentro de los archivos de typescript.
Al reves... yo te diria que es mas sencillo. Esta bueno, no creo que llegue al nivel de Vue y React pero esta bueno
son buenísimo tus videos.. y entiendo que tenes el super monitor, pero yo con mi monitor de 20 pulgadas y mi ceguera no veo nada.
la mayoria de los youtubers dan por echo que todos lo ven igual que el.. pero no es asi.. una pena.
Siempre me pregunte porque el html se le pasaba una String literal así tan feo sin paréntesis, y resulta que se llaman template tags 🤯🤯🤯🤯
midu salio la versión 3... face falta un videooo
este video de Midu se titula: The boy who lived .... to javascript⚡🤓
🤣
esto es lo mismo que litElement?
Sí, le han cambiado el nombre
qué versión de lit es esto?!
La falta de una versión estable de SSR compromete gravemente su uso en prod
Se parece a Angular en varias cosas
También!!
Hace poco lit element en una empresa pidiendo developers con experiencia en el :) jejeje
jajajajaja 10 años de experiencia
A mi no lo personal no me gusto lit no lo volvería usar, hice un proyecto para una empresa y me costo aprenderlo no hay mucha documentación en la web.
Por el momento seguimos con react 🤓
jajaja yes!!!
Conozco un codigo que ya hacia eso desde hace 10 años.
Definitivamente prefiero Svelte sobre otros frameworks de JS para webcomponents. ¿Porqué?
1) Puedo utilizar lo que conozco de JS, HTML5 y CSS3 para construir un webcomponent sin saber del framework Svelte.
2) No necesito mezclar el HTML en el JS para generar código HTML que sea adaptable al componente. El template HTML es una cosa y el código para renderizarlo no debería verlo como desarrollador (como desafortunadamente funciona en React o Lit)
Svelte no funciona de forma nativa, tiene un proceso de compilación
Lit funciona nativamente con WC, no puedes usas componentes de svelte en otros framework (te casas con svelte)
En lit podes básicamente copiar un pegar todo un html y css tal cual sin modificar de algo nativo, el js lo agregas en el firstUpdated y listo, sin modificar nada, podes colocar todo por aparte, solo es es estilo de código
Adobe usa Lit y próximamente Google Chrome y varios proyectos de Google, el Internet eventualmente estará en webcomponents
Yo sólo amo angular xd
space x usa lit element ojo, Lit element fue al espacio XD
Como sabes tanto 😟😟
Tengo 15 años de experiencia. No te compares.
@@midulive hooo entonces espero ser igual o mejor a ti un día. Gracias, sigue a si me gustan tus videos
@@midulive Que humilde 🙄
hoy a muerto angular señores
que feas las clases, lindo un lit with hooks XD