State Management with Native Web Components - Full Code Walkthrough - No Frameworks! [intermediate]

Published: 05 December 2020
on channel: Jeremy Chone

8,286

108

Full code walkthrough of state management with Native Web Components, with no framework, no virtual DOM, just best practices, and scalable code design.

Episode source code: https://github.com/jeremychone-channe...
Quickstart source code: https://github.com/dom-native/quickstart

00:00 - Intro
00:34 - Setup
00:52 - v-project base component
02:18 - DcoMock (create and list)
04:42 - v-project refresh method
05:31 - c-task component
07:15 - Add new task logic (v-project)
08:55 - c-task click to update concept
10:49 - c-task click to update code
12:40 - c-task update in-place
13:42 - Recommendations

Approach:
Scalable web application UI code using the Browser As The Framework.
NO ReactJS, NO Angular, NO vuejs/virtual-dom.

Good code design and Native Web Component can scale as well if not better than big or "small" web framework.

Principles:
Best Practices over Frameworks
Simple scales better
Making something easy does not make it right.

OWN your code design from the start, do not delegate it to frameworks!

#JavaScript #WebComponents #TypeScript #NativeWebComponents #Frontend

Icon attributions:
(brain & maze icons) Icon made from http://www.onlinewebfonts.com/icon, Icon Fonts, is licensed by CC BY 3.0
(feather icon) Icon made by https://www.flaticon.com/authors/freepik from https://www.flaticon.com

On this page of the site you can watch the video online State Management with Native Web Components - Full Code Walkthrough - No Frameworks! [intermediate] with a duration of hours minute second in good quality, which was uploaded by the user Jeremy Chone 05 December 2020, share the link with friends and acquaintances, this video has already been watched 8,286 times on youtube and it was liked by 108 viewers. Enjoy your viewing!

1,614