COEP FOSSMeet'19

Libre, not Gratis

Diwanshi Pandey

@diwanshipandey

Beyond the Basics: Create custom HTML elements using Angular Elements

Submitted Feb 4, 2019

Have you ever played with Legos or have built something amazing with them? Imagine how much easier front-end web development would be if your HTML elements were just like lego blocks and you could use your imagination and combine them together to create something amazing and use them wherever you want and however you want. Let’s go beyond the basics and try creating framework independent web components.

##Talk Duration: 30 - 45 Mins

Outline

#Introduction:
The talk will include the introduction to Angular Elements which provides Angular components as framework-independent web components. In a snap, now you can create custom web components and package them in a way that you don’t need to use any framework. They can also work with your plain html.

#Demo:
After the introduction, I’ll be showing a demo of a web component for ex: a multi select dropdown which I’ll start with basic dropdown component and I’ll start adding customization one by one for instance, text or background color, the title text, sorted values, scroll, etc.
Once finished customization I’ll show how to package it as an independent component which users just need to import in their html file and start using it.

#Q&A:
If time permits, I’ll take any Questions and answers.

Requirements

Participants should be familiar with Javascript.

Speaker bio

Diwanshi is an Application Developer at RedHat and a Mozilla Tech Speaker. You can talk to her about modern open web technologies, Privacy and Security over the web. She also loves to talk about different cultures and cuisines and give it a try in her free time.

Comments

{{ gettext('Login to leave a comment') }}

{{ gettext('Post a comment…') }}
{{ gettext('New comment') }}
{{ formTitle }}

{{ errorMsg }}

{{ gettext('No comments posted yet') }}

Hosted by