semagarcia

// OPTION B: "Angular way" => Class
// In Angular example, use this snippet inside AfterViewInit lifecycle hook:
class MyAngularComponent implements AfterViewInit {
  
  // Through @ViewChild decorator, Angular will get the first element matches selector in the DOM
  @ViewChild('counter', { static: false }) counter;

  ngAfterViewInit() {
    // Angular-way
    this.counter.nativeElement

semagarcia

// OPTION A: "standard way" => Class
// In Angular example, use this snippet inside AfterViewInit lifecycle hook:
class MyAngularComponent implements AfterViewInit {

  ngAfterViewInit() {
    // Standard-way
    document.querySelector('#clickCounter')
      .addEventListener('counter-clicked', this.myCallbackFunction);
  }

semagarcia

<!-- Template: web component inside an Angular component -->
<div>
  <h1>I'm an Angular component</h1>
  <click-counter id='clickCounter'></click-counter>
</div>

semagarcia

<!-- Template: Angular component containing web component -->
<div>
  <h1>I'm an Angular component</h1>
  <print-full-name
    name="{{ user.name }}"
    surname="{{ user.surname }}">
  </print-full-name>
</div>

semagarcia

<!-- HTML file -->
<my-web-component></my-web-component>

semagarcia

<!-- HTML file -->
<template id="myTpl">
  <h1>Hi, I am a WebComponent!</h1>
</template>

semagarcia

<script>
  // JavaScript code for creating "my-web-component" custom element 
  // using HTMLElement as base class from which to extend
  customElements.define('my-web-component', class extends HTMLElement {
    constructor() {
      super();

      // Find an HTML snippet (template used by WebComponent)
      const template = document.querySelector('#myTpl');
      const templateContent = template.content;

semagarcia

https://docs.google.com/presentation/d/1YWe46QRe5SHJzU_BP66AMWg3pHp-YC0VT_us11xOYbA/edit#slide=id.g62e0a832ab_2_110

semagarcia

# 1. Clone your fork:
git clone <your-forked-repo>.git

# 2. Add remote from original repository in your forked repository:
cd forked-repo
git remote add upstream <your-forked-repo>.git
git fetch upstream

# 3. Updating your forked repo from original one to keep up with their changes:
git pull upstream master

semagarcia

#! /bin/bash
openssl req -x509 -newkey rsa:4096 -keyout key.pem -out cert.pem -days 365 -nodes