Coding Design Systems - ep15 - Design Systems and State Management, with Juho Vepsäläinen
Автор: Backlight
Загружено: 2022-04-14
Просмотров: 83
Every Tuesday at 5:30PM UTC, join @Georges_Gomes, @m4d_z, and their guests in a new live coding session about design systems, on Backlight.dev!
⎯⎯⎯ In this episode ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯
00:00:00 - Intro: Welcome Juho Vepsäläinen
00:05:01 - State Management in Webapps overview
00:07:45 - App State, Partial Hydration, and Islands Architecture
00:10:23 - State Management Patterns
00:11:36 - Sidewind: State engine for modern Webapps
00:14:43 - Creating a Design System based on Web Components and Sidewind
00:20:49 - Splitting components to cascade state using props
00:42:33 - Using Sidewind to manage state cascade in design systems components
01:09:02 - Outro: a statement for the next session to improve the cascade
⎯⎯⎯ Description ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯
Helped by the creator of Sidewind, a modern state engine for Webapps, we create a new Backlight's Starter Kit based on Web Components and Sidewind to demo how to expose stateful components from your design system, ready to handle state coming from your top-level app.
In this episode, we make the first steps in defining the basics of state management in stateful components.
⎯⎯⎯ Resources ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯
🐥 @bebraw: / bebraw
🐥 @survivejs: / survivejs
https://survivejs.com/
🐥 @ReactFinland: / reactfinland
https://sidewind.js.org/
https://gustwind.js.org/
Picks:
Xstate JavaScript State Machine: https://xstate.js.org/
Deno: https://deno.land/
Cloudflare workers with Deno: https://denoflare.dev/
Astro Beta Launch Week: https://astro.build/blog/launch-week/
Rocket SSG engine: https://rocket.modern-web.dev/
Previous episodes you may be interested in:
Web Components design system, with Thomas Allmer: https://backlight.dev/sessions/coding...
🪄 Backlight Design Systems Editor: https://backlight.dev/?utm_campaign=s...
🐥 Georges Gomes: / georges_gomes
🐥 m4dz: / m4d_z

Доступные форматы для скачивания:
Скачать видео mp4
-
Информация по загрузке: