As funções generator assíncronas são um novo recurso no ES2018. Node.js adicionou suporte para funções generator assíncrona no Node.js 10. As funções generator assíncrona podem parecer um recurso de nicho bonito, mas apresentam uma ótima oportunidade para estruturar websockets em Node.js. Neste artigo, explicarei como uma estrutura de websocket Node.js pode usar funções generator assíncronas.

Classificando frameworks HTTP

Primeiro, pense em frameworks de servidor HTTP, como Express ou Hapi . Em geral, a maioria das estruturas de servidor HTTP se enquadra em uma das 3 classes:

1. Resposta explícita — Para enviar uma resposta HTTP no Express, você deve chamar res.end(), res.json() ou alguma outra função no objeto res. …

O useEffect é um poderoso hook para realizar efeitos em suas aplicações React usando a sintaxe de componentes em funções.

Ao retornar uma função dentro do useEffect estamos entrando na faze de limpeza do efeito.

Como mostra a documentação, em componentes de classe, usaríamos os ciclos de vida componentDidMount e componentWillUnmount:

class FriendStatus extends React.Component {
  constructor(props) { ... }  componentDidMount() { // [ A ]
    ChatAPI.subscribeToFriendStatus(
      this.props.friend.id,
      this.handleStatusChange
    );
  }  componentWillUnmount() { // [ B ]
    ChatAPI.unsubscribeFromFriendStatus(
      this.props.friend.id,
      this.handleStatusChange
    );
  }  handleStatusChange(status) { ... }  render() { ... }
}

O exemplo acima pode ser resumido em:

• [ A ]: Ao montar o componente, criamos uma inscrição/escuta na API ChatAPI.subscribeToFriendStatus e iremos executar a função handleStatusChange para cada…

A proposta do TC39 de iteradores assíncronos que trouxe for/await/of para o JavaScript também introduziu o conceito de uma função generator assíncrona . Agora, o JavaScript tem 6 tipos distintos de funções:

• Funções normais function() {}
• Funções de seta () => {}
• Funções assíncronas async function() {}
• Funções de seta assíncrona async () => {}
• Funções generator function*() {}
• Funções generator assíncrona async function*() {}

As funções generator assíncronas são especiais porque você pode usar ambos await e yield em uma função generator assíncrona. As funções generator assíncrona diferem das funções assíncrona e funções generator porque não retornam uma promessa ou um iterador, mas sim um iterador assíncrono. …

Créditos da Imagem

O Array.map () é uma função muito útil, mas, infelizmente, só funciona com funções síncronas. Uma solução simples para executar funções async é usar o Promose.all() ou seu irmão mais tolerante Promise.allSettled():

// Falha no momento que UMA função do .map falhar
const results = await Promise.all(array.map(asynMapFunction))// Continua executando mesmo se uma função falhar
const results = await Promise.allSettled(array.map(asynMapFunction))

Funciona assim: o .map()irá converter cada item do array em uma Promise, então teremos um array de Promises para resolver. Há duas maneiras de fazer isso:

• Promise.all(): joga um erro se a função no .map …

Tenho lutado para encontrar referências sobre isso online, mas ouvi o nome ser usado várias vezes este ano ao descrever a abordagem descrita aqui.

A ideia geral de uma arquitetura em “ilhas” é aparentemente simples: renderizar páginas HTML no servidor e injetar espaços reservados ou slots em regiões altamente dinâmicas. Esses espaços reservados / slots contêm a saída HTML renderizada pelo servidor de seu widget correspondente. Eles denotam regiões que podem então ser “hidratadas” no cliente em pequenos widgets independentes, reutilizando seu HTML inicial renderizado pelo servidor.

Você pode pensar nisso como um documento HTML estático que contém vários aplicativos incorporados…

Trabalhar com datas em JavaScript é uma dor. Os métodos de datas nativo costumam ser prolixos e ocasionalmente inconsistentes — algo que também os torna sujeitos a erros. Mas boas notícias estão à mão. Existem várias bibliotecas para lidar com a manipulação de datas e removem essa dor. Essas bibliotecas são para datas em JavaScript, o que jQuery é para a API DOM nativa.

Aqui está um exemplo. Esta é a resposta aceita para uma pergunta do Stack Overflow perguntando como obter o último dia do mês:

var t = new Date();
alert( new Date(t.getFullYear(), t.getMonth() …

GraphQL foi originalmente criado para fornecer facilmente uma API poderosa em cima do código existente. A abordagem atual que as pessoas estão usando ao migrar de API REST para o GraphQL é criar um novo esquema e usar o GraphQL como um proxy. Isso traz muitos benefícios, porque nos dá a oportunidade de repensar a API e melhorá-la, sem alterar os serviços por baixo dela.

Vamos primeiro começar observando essa abordagem:

Implementando um back-end de proxy GraphQL

Digamos que você tenha um endereço /user que faz todas as operações CRUD para a entidade User, com diferentes métodos HTTP, e você precisaria de um esquema GraphQL como…

Créditos da Imagem por Kai Pilger

Créditos

• The Complete Guide to Next.js Authentication, escrito originalmente por Nader Dabit.

Neste guia, você aprenderá como implementar a autenticação em um aplicativo Next.js. Abordarei autenticação de cliente, páginas autenticadas renderizadas no servidor, rotas de API autenticadas, rotas protegidas e redirecionamentos.

O serviço de autenticação será implementado com AWS Amplify, mas as ideias e estratégias abordadas aqui funcionarão para qualquer serviço de autenticação como Auth0 / Okta ou mesmo uma implementação de back-end personalizada, desde que forneça uma maneira de gerenciar sessões no cliente e servidor.

O código para este projeto está localizado aqui . …