presentations.lit.element

Get Started. It's Free
or sign up with your email address
Rocket clouds
presentations.lit.element by Mind Map: presentations.lit.element

1. Demo

1.1. Project setup

1.2. Basic - one component

1.3. Add card component

1.3.1. Styles, sharing

1.4. Add filter

1.4.1. Attributes vs properties

1.5. Add slots

1.6. Add CSS Custom properties

2. Resources

3. Getting Started

3.1. lit-element-starter

3.2. open-wc

3.3. Several other starters on github

3.4. Roll your own

3.5. Development web server

3.5.1. Polymer CLI

3.5.2. open-wc ES Dev Server

4. Me

4.1. Principal Consultant at Virtua: Consulting, training, mentoring on front-end and back-end Java

4.2. Java Champion

4.3. Google Developer Expert on Web Technologies

4.4. Co-host of Enterprise Java Newscast (enterprisejavanews.com)

4.5. International speaker: Devnexus, CodeOne, Devoxx Belgium, France, Poland, JAX, JavaZone, GIDS, etc.

5. You

6. Web Components what's in the browser, stays in the browser

6.1. Core Specs

6.1.1. Custom Elements

6.1.2. Template Element

6.1.3. Shadow DOM

6.1.4. HTML Templates

6.2. Related Specs

6.2.1. CSS Custom Properties

6.2.2. CSS Shadow Parts

6.2.3. Constructable Stylesheets

6.2.4. HTML Modules

6.3. Browser support

6.4. Framework support

6.5. Example

7. LitElement

7.1. From Google Polymer Team

7.1.1. Successor to Polymer 3

7.2. Features

7.2.1. Templating (lit-html)

7.2.2. Automatic support for properties<->attributes

7.2.3. TypeScript / Babel Decorators

7.2.4. Lifecycle methods

7.3. Examples

7.3.1. JavaScript

7.3.2. TypeScript

8. Questions? @kito99 virtua.tech