[x] AULA 10.01 - TEMPLATE STRING

• Usado para simplificar o uso de variáveis dentro de console.log:

console.log(`Olá, eu sou ${nome} e estudo ${curso}.`);

[x] AULA 10.02 - OPERADOR TERNÁRIO E ARROW FUNCTIONS

• Arrow functions são usadas para simplificar o uso de funções mais simples:

const divisao = (a, b) => { return a / b };

[x] AULA 10.03 - SPREAD

• Usado para melhor manipulação de listas:

// Inserindo uma lista dentro de outra.
const lista1 = [1, 2, ...lista2, 5];
// Criando uma cópia de uma lista.
let arr2 = [...arr];

[x] AULA 10.04 - DESESTRUCT E MATCH

• Desestruct é usado para desestruturar objetos:

// Criado um objeto Pessoa.
const pessoa = { nome: 'John', sobrenome: 'Oliveira' };
// Desestruturando para variáveis únicas.
let { nome, sobrenome } = pessoa;

• Match é usado para filtrar uma expressão regular:

// Criado uma string contendo um CPF.
const cpf = 'Meu CPF é 123.456.789-12';
// Criado a expressão regular para filtrar o CPF.
const regex = new RegExp('[0-9]{3}.[0-9]{3}.[0-9]{3}-[0-9]{2}');
console.log(cpf.match(regex));

[x] AULA 10.05 - SPA, PWA E WEBCOMPONENTS

• Single-Page Application (SPA's):
  • React
  • Angular
  • Vue.js
• Progressive Web Apps (PWA's):
  • Progressivo: funcionando para qualquer usuário em qualquer navegador escolhido.
  • Responsivo: adequando-se a qualquer formato, seja ele desktop, celular, tablet, etc.
  • Independente de conectividade: aprimorado atráves de Service Workers para trabalhar offline ou com conexão limitada.
  • Semelhante a Aplicativos: deve ter interface similar a um app para usuários, oferecendo os mesmos recursos independente do dispositivo.
  • Sincronizado: mantendo-se atualizado constantemente pelo Service Workers.
  • Seguro: sempre com conexão (quando disponível) via HTTPS.
  • Reenvolvente: deve gerar engajamento através de notificações PUSH.
  • Instalável: possibilidade de "guardar" o aplicativo sem necessariamente instalá-lo.
  • Linkável: facilmente compartilhável com um link, reduzindo o atrito das lojas de aplicativos.
• Especificações WebComponents
  • HTML Template: possibilita a criação de fragmentos HTML que podem ser invocados sempre que necessário.
  • Custom Elements: capacidade de criar componentes customizados.
  • Shadow DOM: estilos e diretivas globais ficam encapsulados, ou seja, cada componente não é capaz de interferir nos demais.
  • ES Modules: possibilidade de carregar módulos nativamnte.