How to build your first Lit component скачать в хорошем качестве

How to build your first Lit component

Lit is a tiny library that removes the boilerplate of defining a web component. Learn how to build your first Lit component and use it with React, Vue, and in a markdown editor. Lit Software Engineer Andrew Jakubowicz explains core Lit concepts, the LitElement lifecycle, attributes, state, styles, events, and more! Lit.dev playground with tonnes of Lit examples → https://goo.gle/3ruWNfx Lit documentation site → https://goo.gle/Lit-devsite Tired of using only div’s; try these out: model-viewer → https://goo.gle/3KWdZ58 brick-viewer → https://goo.gle/3ryIJ4O chess-board→ https://goo.gle/37ZPzJE playground-element→ https://goo.gle/3uSfGLj Chapters 0:00 - Introduction 01:36 - What is Lit? 02:45 - What does a Lit component look like? 03:19 - Writing our very first component Start a blank project at https://goo.gle/3ruWNfx More about the html tag function and Lit templates → https://goo.gle/38lA0fk 04:40 Property decorator and attributes Checkpoint TS → https://goo.gle/37Nyse2 Checkpoint JS → https://goo.gle/3OzlHEx 06:34 Lifecycle and changing the word Checkpoint TS → https://goo.gle/3kb3MWR Checkpoint JS → https://goo.gle/3MvmHaS Lifecycle documentation → https://goo.gle/3ESXfJV 08:12 Styles and events! Checkpoint TS → https://goo.gle/3LidGC2 Checkpoint JS → https://goo.gle/3KgA4KK Styles documentation → https://goo.gle/3OMnztU Events documentation → https://goo.gle/3Kg3h8k 09:53 Use this component everywhere! Final TS Code → https://goo.gle/3OESjwD Final JS Code → https://goo.gle/3Mx2Ub0 11:22 - Wrap up Have any lingering questions? Tweet at us with the hashtag #AskLitDev or join the Lit & Friends Discord! Join the community → https://goo.gle/Lit-Community Twitter → https://goo.gle/Lit-Twitter Github Discussions → https://goo.gle/Lit-GitHub Discord → https://goo.gle/Lit-Discord Watch more Build it with Lit → https://goo.gle/BuilditwithLit Subscribe to never miss a video on Lit → https://goo.gle/Lit #Lit #WebComponents #WebDevelopment