Web Components Patterns

This workshop covers the "missing pieces" of vanilla Web Components.

In this workshop we will focus on real world structure, design, naming conventions, testing and patterns for web apps with vanilla Web Components.

Prerequisites

Basic Web Component / web standards knowledge, or attendance at a Web Component-related airhacks.live workshop.

Topics

• How to use modules, JavaScript classes, functions and imports to structure real world applications?
• Naming conventions
• View and logic separation
• Patterns for highly interactive applications
• Data passing between custom elements
• HTML Forms, validation and partial state
• State management and unidirectional data flow
• Opinionated redux
• Redux vs. redux-toolkit
• Routing with and without routers
• Dealing with long running tasks and backend communication
• Pragmatic styling
• Applying Boundary Control Entity to frontends
• Smart and dumb components
• Backend communication patterns
• Dealing with "utilities" and cross cutting concerns
• [TBD]
• ...and most popular questions, topics and technologies from airhacks.tv

In this workshop I would like to explain the most significant features with working code and prepared examples. As a reference, you will get a GIT repository with all snippets and solutions, as well as prepared sample applications.

Environment requirements / prerequisites.

I/we will spend 90% of the time in code.

Feel free to contact me / register via email: workshops[-AT-] adam-bien.com

Registration