WAAPI and Web Components

💫

The New Age of

Who am I?

Hi, I'm J.D Nicholls!

- Open Source Contributor 👨‍💻

- Developer who loves UX

- Chocolate lover 🍫

- Gamer developer (Hobby) 🎮

- Creator of Proyecto26

Web Animations API

 

1. Easing functions 📈

2. Keyframes - animations

3. Animatable properties (color, size, width, height, scale, opacity, rotation, etc)

Movement

Triggering

 

1. No more adding/removing classes

2. Using an API (Imperative or a Framework solution)

Be relaxed 😌

What's the key with tech?

Be agnostic 🤔

Performance, accessibility, cross-platform capabilities, UX, standards...

Do we need to migrate to another framework?

Choosing a Framework

It Depends... maybe You don't need it
 

 

Web Components with StencilJS

"Write once, use Everywhere"

What's StencilJS?

Reactive Data-Binding
Virtual DOM
JSX
Lazy Loading
Async Rendering
Life cycle hooks

It's just a Compiler

(standards-based)

ES6 Modules
Server Side Rendering (SEO)
Prerendering (Dynamic import)
Polyfills
Plugins
PWA
Service Worker (Workbox)
Decorators
Custom elements
Templates
Developer Experience
Docs generation
CSS variables

Support your current stack

And you can re-use these components from any other project... also, existing solutions!

Examples

Tap

Draw

Experiments:

Animatable Components

"Animate once, use Everywhere"

WorkShop here 

WAAPI and WebComponents

By Juan David Nicholls

WAAPI and WebComponents

A talk about Web Animations API, Web Components and StencilJS

  • 543
Loading comments...

More from Juan David Nicholls