*NOVO* AJAX - Curso completo de fundamentos - Parte 7: STREAMS | CM Code_Zone | Skillshare

Velocidade de reprodução


1.0x


  • 0.5x
  • 0.75x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 1.75x
  • 2x

*NOVO* AJAX - Curso completo de fundamentos - Parte 7: STREAMS

teacher avatar CM Code_Zone, !false | funny, because its true

Assista a este curso e milhares de outros

Tenha acesso ilimitado a todos os cursos
Oferecidos por líderes do setor e profissionais do mercado
Os temas incluem ilustração, design, fotografia e muito mais

Assista a este curso e milhares de outros

Tenha acesso ilimitado a todos os cursos
Oferecidos por líderes do setor e profissionais do mercado
Os temas incluem ilustração, design, fotografia e muito mais

Aulas neste curso

    • 1.

      Introdução do curso

      2:07

    • 2.

      O que são Streams

      4:52

    • 3.

      Como ler os fluxos

      12:06

    • 4.

      Como escrever para fluxos

      4:10

    • 5.

      Resumo do curso

      3:34

    • 6.

      O curso

      1:25

  • --
  • Nível iniciante
  • Nível intermediário
  • Nível avançado
  • Todos os níveis

Gerado pela comunidade

O nível é determinado pela opinião da maioria dos estudantes que avaliaram este curso. Mostramos a recomendação do professor até que sejam coletadas as respostas de pelo menos 5 estudantes.

12

Estudantes

--

Projeto

Sobre este curso

BEM-VINDO A ESTA SÉRIE DE SKILLSHARE NO AJAX. ESTE É O SÉTIMO curso DA AJAX.

O que cobrimos neste curso específico da Skillshare?

Vamos cobrir muitas informações em toda esta série, mas para a Parte 7, você vai aprender sobre o Streams.

O termo AJAX foi cunhado em 2005, mas a sua origem se estende até 1999 quando a Microsoft forneceu aos desenvolvedores cola entre clientes e servidores.

A partir de agora você sabe que o AJAX é uma maneira como o JavaScript usa um objeto do navegador para se comunicar com um servidor remoto. Na seção anterior, usamos a API do Fetch para executar uma solicitação do AJAX.

Mas você notou algo peculiar quando usamos a API da Fetch?

É verdade, não conseguimos acessar o corpo da resposta diretamente!

Isso porque o corpo da resposta foi um fluxo legível. Especificamente, a API do Fetch oferece uma instância concreta de um ReadableStream através da propriedade do corpo de um objeto Response.

O quê?

Não se preocupe, é exatamente disso que este curso se trata.

Os fluxos são poderosos, porque quando usamos streams podemos receber um recurso da rede e processá-lo assim que o primeiro bit chegar.

Isso significa que em vez de esperar que o recurso baixe completamente antes de usá-lo, podemos trabalhar com ele imediatamente. Lembre-se dos velhos tempos em que você teve que baixar um vídeo inteiro para sua memória antes de poder assisti-lo? Bem, os velhos tempos já se foram! Agora temos o YouTube e a Netflix que permitem que você transmita e assista vídeos, pouco a pouco.

Neste curso, vamos analisar alguns conceitos importantes como:

  • o que são o Streams?
  • como ler fluxos
  • como escrever para fluxos (avançado)
  • como ler pedaços de dados através do método pipeThrough do tubo
  • E UM MONTE MAIS!

Não posso esperar.

VAMOS COMEÇAR

--- curioso sobre o que é o AJAX? Não procure mais...

Dê as boas-vindas aos alunos da Skillshare para esta série sobre o AJAX.

A compreensão do desenvolvimento da web é um processo contínuo. Para dar um pé, eu fui para fora para estruturar uma série abrangente e focada, da AJAX Skillshare, que eu entrego para você de uma maneira que vai beneficiar mais você.

A minha série Skillshare é distinguível em ensinar a você "por quê" as coisas funcionam e não apenas "como" para fazer algo sem mente.

PARA QUEM É A MINHA SÉRIE AJAX?

A minha série Skillshare AJAX é para todos, desde codificadores iniciantes e avançados. Você não precisa fazer nenhuma outra aula depois que a minha para saber o que é a AJAX.

Você precisa saber um pouco de HTML e JavaScript. Se você nunca ouviu falar de JavaScript, pode ser benéfico para você primeiro fazer meus cursos em JavaScript antes deste, mas isso não é essencial.

Esta série da Skillshare AJAX pode ser tomada sozinha (não precisa fazer nenhuma outra série da Skillshare) para alcançar seus objetivos.

O QUE É O AJAX?

O AJAX permite que você atualize as informações no seu aplicativo da web de forma dinâmica, sem uma atualização da página, e facilita o streaming mais importante. Uma boa adição ao seu conjunto de habilidades. Inteligente e poderoso.

Por exemplo. Se um usuário quiser avaliar seu produto "⭐⭐". Você não quer que a página inteira se atualize quando o usuário decide dar ao produto uma revisão estrela, devido ao tempo desnecessário que ele perda, especialmente se sua página for grande.

Outro exemplo é uma sala de bate-papo. Por razões óbvias, não é necessário que a página atualize sempre que um novo comentário ou uma resposta seja publicada.

O AJAX vai mais longe do que apenas atualizar os dados da sua página sem uma atualização da página. Com o AJAX, você também pode transmitir dados. Pense em assistir a um vídeo antes de todo o vídeo ter baixado para sua máquina. Pense no Google Maps onde você precisa apenas fazer o download de dados que sejam relevantes para você. A AJAX torna tudo isso possível.

Você pode começar a ver o quão poderoso o AJAX é, o quão essencial é hoje?

O conhecimento do AJAX é crucial se você quiser se tornar um desenvolvedor fullstack, pois ele vai permitir que você faça solicitações de servidor e ouça dados que entram, de forma assíncrona. A AJAX pode ser complicada por vezes, e não contesto isso, mas com um treinamento correto que inclui explicar os fundamentos de uma maneira simples, você vai aprender a dominar e amar o AJAX.

Se você quiser se tornar um desenvolvedor da web de pilha completa, você precisa saber sobre o AJAX e é disso que esta série da Skillshare

 

POR QUE ESSA SÉRIE DE HABILIDADES NO AJAX É TÃO IMPORTANTE?

  • Os seus sites favoritos hoje usam o AJAX
  • Outras aulas ensinam sobre bibliotecas de terceiros ao usar o AJAX (como o jQuery ou o Axios). Esta série da Skillshare vai ensinar a usar o AJAX. Não há atalhos. O verdadeiro negócio!
  • A realização de solicitações HTTP está na vanguarda do desenvolvimento da web atual. De fato, não é mais aconselhável ou o que faz para fazer com que as solicitações HTTP sincronia
  • Saber como fazer um pedido do servidor e ouvir uma resposta, de forma rápida, é uma habilidade vital para qualquer desenvolvedor da web
  • Como desenvolvedor, você lida com dados. Esses dados podem assumir muitos formulários, mas o mais comum é o XML e o JSON
  • Você pode usar o AJAX para transportar HTML, imagens, JavaScript, XML, JSON e até mesmo texto simples pela internet. A minha série Skillshare abrange tudo isso
  • A utilização do AJAX permite salvar o uso da memória e acelerar seu site. Por exemplo, o Google Maps usa o AJAX. Portanto, em vez de carregar toda a página para cada evento, ele carrega a seção exigida para que você esteja analisando somente. A quão eficiente não é
  • O AJAX faz para uma melhor experiência do usuário, não é argumento
  • Cada navegador tem hoje uma API (ou objeto embutido) chamada o objeto XMLHttpRequest ou a API Fetch. Esses objetos dão aos navegadores a capacidade de se comunicar com servidores, nos bastidores. Isso significa que uma página pode atualizar (não totalmente carregada) sem bloquear nada na interface do usuário
  • Depois de concluir esta série da AJAX Skillshare, você vai certamente ser bem conhecido, confiante e a pessoa “go-to” para fazer solicitações da AJAX

 

DEIXE QUE ME PARTILHE O MEU CONHECIMENTO AJAX COM VOCÊ

Como o AJAX funciona vai te equipar para a ser um programador completo incrível, relevante para hoje. A utilização do AJAX permite que você atualize as partes do seu site de forma dinâmica sem que uma página atualize, transmita e economize tempo, economize espaço de memória e, portanto, melhore a experiência do usuário.

Assuma o controle e oferece aos usuários atuais a experiência da web rápida que eles estão esperando.

A masterização da AJAX é desafiador.

Nesta série da Skillshare, eu dou um mergulho profundo para explicar o AJAX e como ele funciona de uma maneira clara e simples. Por que precisamos do AJAX? De onde ela vem? Por que a API mais recente do Fetch() foi introduzida? Por que é que temos de substituir o objeto XMLHttpRequest()? Por que é que temos de usar a nova palavra-chave ao usar o objeto XH? O que são promessas? O que são o Streams? Quais são os diferentes formatos de dados que podemos transferir pela internet? Ao entender (realmente compreensível) essas perguntas, e muito mais nesta série da Skillshare, você vai ser capaz de criar facilmente sites avançados e usar o processo de pilha completa. Você vai ser capaz de criar sites dinâmicos que melhorem o engajamento e a experiência do usuário.

ONDE É USADO O AJAX?

  1. A validação do formulário

Pode ser impraticável e tedioso obter resultados de validação apenas após o envio de um formulário. Você pode usar o AJAX na validação de formulário, para dar atualizações em tempo real quase instantâneo sobre a validação.

  1. Como gravar dados de um banco de dados de forma dinâmica sem uma atualização da página

Se você precisar obter dados de um banco de dados e exibi-los para sua página (como um comentário do blog, uma resposta de bate-papo ou nome do usuário), então usar o AJAX é uma necessidade.

  1. Classificar ou filtrar

Se você precisar obter dados de um banco de dados e exibi-los para sua página (como um comentário do blog, uma resposta de bate-papo ou nome do usuário), então usar o AJAX é uma necessidade.

  1. Votos ou classificação ★★

O site inteiro não precisa ser atualizado se um usuário votar para algo ou avaliar seu produto. A votação e a exibição dos resultados podem ser feitas com mais eficiência usando o AJAX.

  1. E-mail

A conversa é sempre em tempo real. É por isso que o AJAX é um dever se você vai fazer um painel de bate-papo bem sucedido no seu site.

  1. Comentários do blog

Você pode carregar comentários anteriores ou pode postar um novo blog com o AJAX, fácil e fácil.

  1. Captcha

Para fazer o captcha (recarregar o captcha basicamente) o AJAX também é a melhor plataforma para usar.

  1. Como transmitir dados e mais

O AJAX é usado para consumir dados antes de seu download completo (economizando espaço e tempo de memória) e muito mais!

Depois de experimentar a minha série Skillshare “AJAX”, que eu apresento de uma maneira divertida, você vai ser bem informado e confiante.

 

O que esta série de SKILLSHARE cobre

Esta série da Skillshare é abrangente, cobrindo os fundamentos essenciais do AJAX.

O AJAX se refere a como os navegadores fazem solicitações HTTP para servidores de forma assíncrona, ouvem resultados e depois faça algo com os dados quando é recebido. A AJAX tem mais rapidez e eficiência.

Você pode pensar no AJAX como o motor que lida com todo o processo de saída entre o navegador e o servidor.

Simples o suficiente.

O único problema é que para entender o AJAX, você precisa entender muitos outros conceitos. E este é um dos aspectos únicos da minha série e do estilo de ensino da Skillshare

As explicações e exemplos práticos simples permitem que você entenda o seguinte:

  • Como escrever o AJAX da melhor maneira
  • O que é o código assíncrono e como ele se diferencia do código síncrono
  • Como usar o AJAX para fazer solicitações assíncronas
  • Qual é o ciclo de eventos no JavaScript
  • O que é XML e como ele se diferencia do JSON
  • Qual é o protocolo HTTP e o que é o protocolo HTTP/2 e HTTP/3
  • O que são as funções de construtor
  • O que é o objeto XHR
  • O que é a nova API do fetch()
  • O que são promessas
  • O que são Streams
  • Por que usar o Async/Await
  • A interface de URL, a interface de solicitação, a interface do cabeçalho e um monte mais!

E sim, vamos codificar exemplos reais e vamos analisar como o AJAX funciona (usamos o objeto XMLHttpRequest e a mais recente API do Fetch).

Por que você deve aprender tanto sobre o AJAX?

Como o AJAX permite que você atualize certas partes da sua página sem uma atualização da página. É usado para streaming e mais e hoje a utilização do AJAX é essencial em sites. Não fica melhor do que isso!

*** Uma série AJAX abrangente sobre Skillshare ***

Os programadores bem sucedidos sabem muito mais do que memorizar algumas linhas de código.

Eles também sabem os fundamentos de como a interação do navegador e do servidor funciona nos bastidores que lhes permite ser totalmente criativa, corrigir problemas e aprimorar as experiências do usuário.

Isso é particularmente verdadeiro no que se refere ao AJAX.

Se você está querendo se tornar um desenvolvedor de pilha completa, você precisa saber, de fato, como fazer uma solicitação da AJAX. Você precisa entender como o AJAX foi criado, por que a API moderna do Fetch foi introduzida, o que são os Streams, como as promessas funcionam e por que as palavras-chave Async/Await foram introduzidas, e muito mais!

 

UMA ABORDAGEM ÚNICA

Esta série da Skillshare contém exemplos práticos e desafios e questionários divertidos.

A compreensão da forma como o AJAX funciona é um tópico vasto. Para que você se atualize para a velocidade, eu criei uma experiência de aprendizado divertida e abrangente, abraçando o conteúdo que você precisa saber para ter sucesso. E eu o entrego da melhor maneira possível para se beneficiar mais

E eu faço uso dos recursos mais recentes e melhores do JavaScript e navegadores durante a jornada de aprendizado para que você possa ficar à frente do seu negócio.

Você vai aprender estratégias simples e muito poderosas para fazer solicitações de servidor de um cliente.

No final desta série da Skillshare, você vai ser capaz de “falar” e “andar” da AJAX ao obter uma compreensão de como você pode construir e configurar sua solicitação de maneira prática. Nós aprofundamos em todos os cursos, e esta série da Skillshare tem muitas palestras de bônus que ampliam sua base de conhecimento e testam suas habilidades com desafios divertidos.

Esta série da Skillshare oferece os melhores fundamentos e habilidades práticas com o AJAX. Ele pode ser tomado sozinho (não precisa fazer nenhuma outra série da Skillshare) para alcançar seus objetivos. Você vai emergir desta série da Skillshare com uma compreensão avançada e uma experiência prática com a realização de solicitações HTTP. O usuário vai levar ao ponto de entender que método (GET ou POST) para usar ao enviar dados, como definir para onde os dados vão, como configurar um mecanismo AJAX e como verificar se há erros. Este é um conhecimento impressionante. Esta série da Skillshare vai cativar você e catapulta você para o próximo nível. E é uma parte importante da sua jornada para se tornar um grande mestre no desenvolvimento da web.

Nesta série da Skillshare você vai aprender tudo sobre o AJAX. A partir do básico de construir um motor AJAX, todo o caminho para aprender sobre XML e JSON, código assíncrono, protocolos, funções de construtor, promessas, Streams, protocolos HTTP, API do Fetch, palavras-chave da Async/Await e várias APIs como o Fetch, interface de URL, interface de cabeçalhos e interface de solicitação e muito mais!

Se você quiser se tornar um desenvolvedor da web de pilha completa, você precisa fazer esta série da Skillshare no AJAX!

 

COMO ESTE curso SKILLSHARE É DIFERENTE?

A característica única da minha série Skillshare é o detalhe que eu fornece sobre como o AJAX realmente funciona nos bastidores. Uma habilidade que cada desenvolvedor completo precisa dominar para usar o potencial para melhorar.

Eu uso aulas simples e eficazes para levar você além de bibliotecas iniciais, como o Axios ou o jQuery. As bibliotecas são úteis, mas não são uma substituição para o conhecimento e uma vez que você pode escrever a sua própria, é melhor que você possa usar e alterar o código da biblioteca.

Nesta série da Skillshare, eu me concentro no aspecto mais fundamental do AJAX. Eu uso o JavaScript simples, que é a linguagem de programação principal de que você precisa para usar o AJAX. Depois de dominar o JavaScript com o AJAX, a integração de uma biblioteca pode beneficiá-lo e fazer sentido.

Para entender como o AJAX funciona, eu me aprofundo em tópicos como protocolos, funções de construtor, código assíncrono, tipos de formato de dados (JSON e XML), promessas, Streams, manipulação de erros e como usar as palavras-chave Async/Await com a API Fetch.

A prática torna perfeita

A teoria é ... mas não há nada como ficar atrás do seu computador e digitar o código. É por isso que vamos codificar, rir e extrair o cabelo de forma conjunta enquanto codificamos sites e exercícios da vida real durante esta série da Skillshare.

Adoro ensinar e uso frequentemente exemplos práticos. E é por isso que começo a codificar com você desde o início. Vou mostrar por que o objeto XHR é uma função de construtor. Vou mostrar a diferença entre o JSON e o XML. Vou mostrar como configurar um objeto XHR e mostrar como criar Promessas, mostrar o que são os Streams e como usar a nova API do Fetch. Estes conceitos são melhor aprendidos com a codificação de exemplos reais. Não posso esperar.

 

ESTE curso é para você?

Com certeza. Se você se encaixar em qualquer uma dessas categorias, esta série da Skillshare é perfeita para você:

#1: pessoas ocupadas que querem se tornar certificadas e confiantes no AJAX no menor tempo possível.

#2: DESEJO DE PROGRAMAÇÃO. Você quer avançar no mundo da programação.

#3: FREELANCERS que querem saber como os desenvolvedores podem criar sites dinâmicos que podem atualizar as informações sem uma atualização da página (como o Twitter, o Google Maps etc).

#4: PROPRIETÁRIOS de SITES que querem obter uma compreensão sólida de como o AJAX realmente funciona.

#5: AGÊNCIAS que querem aprimorar seus desenvolvedores rapidamente.

#5: TODOS que querem APRENDER.

 

POR QUE COMEÇAR AGORA?

Neste segundo, seus concorrentes estão aprendendo a se tornar melhores desenvolvedores da web.

O desenvolvimento da Web é um tópico quente e não está definido para se refrescar no futuro. Precisamos da web mais e mais e os avanços continuam a acontecer. Mas você tem uma vantagem distinta. Esta série da Skillshare oferece tópicos de aprendizagem memoráveis, táticas e exemplos do mundo real para o ajudar mais .

Vamos começar!

O que você obtém?

  • Você se torna um especialista da AJAX
  • Suporte de perguntas e respostas.
  • As tarefas para o ajudar a aprender.

Espero que você esteja tão animado quanto eu estou para começar e aprender e eu não posso esperar para mostrar como aplicar o AJAX com confiança em seus próprios sites.

Vejo você no curso.

Conheça seu professor

Teacher Profile Image

CM Code_Zone

!false | funny, because its true

Professor

Success takes sacrifice.

And sacrifice is something I know a lot about.

I am a self-taught developer so I understand how difficult and daunting it can be for a new comer. 

Today, I continue to code and stay on top of the latest technologies and programming languages. 

It's time to share the knowledge I've gained and to help others succeed. 

Visualizar o perfil completo

Level: Intermediate

Nota do curso

As expectativas foram atingidas?
    Superou!
  • 0%
  • Sim
  • 0%
  • Um pouco
  • 0%
  • Não
  • 0%

Por que fazer parte da Skillshare?

Faça cursos premiados Skillshare Original

Cada curso possui aulas curtas e projetos práticos

Sua assinatura apoia os professores da Skillshare

Aprenda em qualquer lugar

Faça cursos em qualquer lugar com o aplicativo da Skillshare. Assista no avião, no metrô ou em qualquer lugar que funcione melhor para você, por streaming ou download.

Transcrições

1. Introdução do curso: Bem-vindo de volta Meus queridos alunos Skillshare para mais uma turma. Esta é a classe sete. Estaremos discutindo um conceito muito avançado conhecido como fluxos. Agora, antes de lhe dizer o que é isso, slide financiado serei seu instrutor e obrigado por acompanhar. Esta classe é autônoma, mas como todos sabem, esta foi uma série inteira sobre o Ajax. Agora, por que preciso discutir a API do Streams ao falar sobre ajax, daremos um passo atrás na classe anterior que aprendemos sobre a API Fetch. Esta é a maneira mais nova e moderna realizar uma solicitação do Ajax. Agora, como vimos, a API Fetch depende de promessas, mas não apenas isso, a API Fetch utiliza a API Streams. O que isso significa é que quando seu navegador faz uma solicitação do Ajax para um servidor, o que é recebido pelo servidor não é a resposta bruta. É um fluxo legível. Por que isso? Bem, no ponto crucial disso, realmente nada mais é do que apenas ser capaz processar pedaços pouco a pouco. Pense na Netflix, pense no YouTube. Quando eu estava crescendo, quando eu era uma iluminação, tive que baixar um arquivo de vídeo inteiro antes de poder assisti-lo. Mas hoje não temos que fazer isso. Podemos transmitir vídeos. Nem precisamos baixar o vídeo inteiro para nossa memória. Então, basicamente, o que isso permite que você faça é consumir dados que poderiam ser potencialmente maiores do que toda a sua memória no computador, ou seu telefone ou tablet, seja lá o que você usá-lo. Quão interessante é que essa classe não será uma classe abrangente sobre fluxos, só vai te dar uma compreensão de alto nível sobre o que são os fluxos, como ler fluxos por pedaço. Temos que usar o método pipe through. E então eu quero mostrar algo bem interessante. Quero apresentar-lhe a ideia de que também é possível escrever duas ruas. Você não precisa apenas ler fluxos. Você pode usar o Ajax para escrever para eles. Eu sei, muito estranho, certo? Esta classe é para todos os níveis. Se você é iniciante ou avançado, confie em mim, há algo que você aprenderá. Vai ser uma aula relativamente curta, mas cheia de informações sobre pacotes divertidos. Então, mal posso esperar. Por favor, acompanhe e eu vou te ver espero, nos primeiros vídeos de palestras. 2. O que são Streams: Antes de analisarmos detalhes avançados sobre phage, você precisa entender a API do Streams. O que é isso tudo? Bem, em primeiro lugar, deixe-me esclarecer. Nos primeiros dias da Fitch, os fluxos não existiam. O que e o que isso significa? Bem, se você estiver perto da minha idade, você se lembrará nos dias em que você queria processar um recurso, como um vídeo, por exemplo, você teria que baixar o arquivo inteiro, esperar que ele seja desserializado em formato adequado. E só então você poderia processar a coisa toda? Só então você poderia assisti-lo. Foi muito chato. Mas a boa notícia é que fluxos de sangue, tudo isso muda porque com fluxos, agora você pode começar a processar fileira com JavaScript. Mas, por pouco, assim que estiver disponível no lado do cliente, me deixa animado mesmo pensando nisso. Hoje, a Fitch nos dá o corpo da resposta como um fluxo, como um fluxo legível para ser específico. Já vimos isso antes, mas se você esqueceu, deixe-me ir até o console e mostrar-lhe muito rapidamente. Você viu esse problema porque temos nosso JavaScript aqui nas tags de script. E isso simplesmente o torna muito simples. Ligação Fitch, este apenas URL do Fitch. Acabei de colar uma lágrima do espaço reservado JSON. Fazemos um pedido de busca. Se fizermos isso e formos ao navegador, abrimos nosso console, nada vai acontecer. A razão pela qual nada está acontecendo, é claro, como não fizemos nada, lembre-se, Fetch nos devolve uma promessa. Para obter o resultado da promessa, precisamos envolver isso dentro de uma declaração. Sabemos que vamos receber os dados de volta. Podemos pegar nossos dados e podemos executar essa função de retorno de chamada. Isso apenas diz que tudo o que queremos fazer é registrar o resultado do console. Isso é tudo o que queremos fazer aqui. Salve isso, acesse nosso navegador. E aqui vamos nós, recebemos o resultado, podemos ver que é um objeto de resposta. Abrimos isso. Queremos acessar a rocha filha. Queremos ver o que está no corpo dessa resposta. Mas se fizermos isso, obtemos um fluxo legível. E esse é o ponto que estou tentando fazer. O corpo da resposta de uma solicitação de recurso é recebido como um fluxo. terceira pergunta que você provavelmente tem agora é, sim, é muito boa. Temos um fluxo legível, mas como acessamos e lemos o fluxo? Bem, temos que usar outra API dada a nós pelo navegador. Essa API é chamada de API do Streams. Ele nos permite usar JavaScript para excesso de fluxos, partes, bits de dados recebidos pela rede e processá-los conforme desejamos. Sei que pode parecer bastante assustador. Uma vez que temos a maioria, um conceito que vimos ter que agora aprender sobre outro. Deixe-me pegar minha pedra. Deixe-me jogar isso na tela e deixe-me dar um resumo. Tudo bem, eu não quero que você fique intimidado. Basta lembrar o que significa streaming. Isso envolve apenas dividir nossos resultados que você deseja receber pela rede em pedaços menores. Isso nos permite processar esses pedaços pouco a pouco. Isso é algo que os navegadores fazem de qualquer maneira. Por exemplo, sabemos que eles fazem isso quando recebem ativos para serem exibidos em páginas da Web. Vídeos, buffer e muito mais estão gradualmente disponíveis para reprodução enquanto você continua assistindo a esse vídeo. E, claro, todos nós estivemos em sites onde você vê imagens exibidas gradualmente à sites onde você vê imagens medida que mais dessa imagem é baixada. O streaming não é algo novo. Já existe há muito tempo. Isso meio que faz sentido. Mas como usamos fluxos? Bem, para usar fluxos, temos que nos certificar de que a resposta nos pareceu do servidor está disponível como um fluxo. E só para tornar as coisas um pouco mais difíceis para nós, não há apenas um tipo de fluxo. Você tem duas cargas de streaming de alto nível. Lendo de um fluxo e escrevendo em um fluxo. Com qual deles estamos mais preocupados? Estamos mais preocupados com a forma de ler o fluxo usando o Ajax. Lembre-se, acabamos de ver que o corpo de resposta retornado para nós por um desperdício futuro bem-sucedido é um fluxo legível. O que é ótimo em ser um fluxo legível é que podemos usar um leitor, por exemplo, o método gig Reader. Vamos vê-lo em breve. Podemos usar um leitor para ler dados do fluxo. Acho que isso é suficiente por enquanto. Sei que pode ser um pouco de sobrecarga de informações. Na próxima palestra, quero começar a falar sobre como podemos realmente ler os dados. Mantenha-se motivado, pule para cima e para baixo. E te vejo na próxima palestra. 3. Como ler fluxos: Ok, deixe-me responder à pergunta de US$1 milhão. Como lemos fluxos? Agora, eu só queria que você percebesse que isso é muito, muito avançado. E você só precisa realmente ler fluxos se tiver recursos muito pesados e quiser processar pedaços de dados. Mas, mas, para a maioria das chamadas do Ajax que você vai fazer, você não terá que ler pedaços individualmente. Você pode usar esse método JSON, por exemplo, que faz todo o trabalho pesado para você e eventualmente retornará todos os dados. Eu só queria esclarecer as coisas. É muito interessante entender como podemos ler fluxos. Sabemos que Fetch retorna um objeto de fluxo legível. Mas como lemos o fluxo? Essa é a pergunta de US$1 milhão. Já vimos. Podemos usar esse método JSON e ele faz isso por nós. Mas e se você quiser mais controle? Nesse caso, eles são dois objetos importantes que você precisa conhecer e lidar para ler fluxos e todo o objeto de fluxo legível e o leitor padrão de fluxo legível. Em primeiro lugar, vamos dar uma olhada neste objeto de fluxo legível. O que é isso? Bem, vamos pular rapidamente para o nosso editor e vamos começar a olhar para isso de forma prática. Estamos falando sobre o conceito de fluxos. E o que eu quero mostrar é que o que nos devolveu da Fitch é um fluxo, é definir uma variável. Vamos chamá-lo de stream. E está atribuindo-o ao que nos devolveu por um carvão. Vamos usar o mesmo URL que estivemos nas últimas palestras. E se o deixássemos assim, o que esperaríamos ver? Qual será essa variável de fluxo? Isso mesmo. Vai ser uma promessa. E o que está resolvido é um objeto de resposta. Vamos para o navegador, tudo, e vamos digitar nosso objeto de fluxo. Lá vamos nós. Isso é uma promessa. E sabemos que será de tipo de resposta, obtemos esse objeto de resposta. Faz sentido até agora. Sim, sim, sim, acho que sim. Acho que sim. Mas não queremos o objeto de resposta, Dewey. Queremos acessar o corpo da resposta. Para fazer isso, temos que envolver este Fitch em uma declaração de veia. E sabemos que as promessas nos darão a unidade de objeto de resposta. Podemos simplesmente chamá-lo de resposta. Então o que queremos fazer é que queremos acessar o corpo dessa resposta. E esses alunos da Medeia devem nos devolver o objeto de fluxo legível. Vá para o navegador, limpe tudo. X é nossa variável e nós a temos. Temos uma promessa. E o que está resolvido é esse fluxo legível. Entendi, ótimo. Os tópicos, a palestra. Lá vai você. Sabemos que o que nos é retornado pela API Fetch é uma string legível. E isso pode ser encontrado na propriedade body da resposta do recurso. Ok, ok, cliente, mas o que fazemos a seguir? Bem, podemos chamar o método gate read up neste objeto de fluxo legível. E isso vai nos devolver outra coisa. Isso nos dará um leitor. Em particular, ele nos dará o leitor padrão de fluxo legível. Com efeito, o que estou dizendo é que vai nos dar a capacidade de ler o objeto de bolha de fluxo. Deixe-me voltar para o nome do editor é mostrar como conseguimos esse leitor. Vamos continuar exatamente de onde paramos. Sabemos que o corpo de um objeto de resposta a peixes é um fluxo legível. Sexta-feira, quando nós consolamos o log do objeto stream, pudemos ver que era um fluxo legível. Se abrirmos esse objeto de fluxo legível, um dos métodos que temos é essa função de leitor de portão. E chamar essa boa função de leitor neste fluxo legível nos retornará o objeto de leitor padrão de fluxo legível. Todos esses linguetas. Em outras palavras, ele nos devolverá um leitor. O que eu quero dizer? Bem, deixe-me mostrar-lhe, deixe-me mostrar-lhe. Vamos voltar ao nosso editor de texto agora não estamos interessados em recuperar um fluxo. Quero mostrar-lhe agora como recuperar um leitor. Acabamos de ver que dentro desse corpo, também conhecido como dentro do objeto de fluxo legível é uma boa função de leitor. Acabei de te mostrar isso no console. Por que não executamos esse código no nosso navegador novamente. E vamos agora registrar nosso leitor no console. Podemos ver agora que o que nos devolveu é o leitor, especificamente o leitor padrão de fluxo legível? Você pode pensar que fizemos anotações, mas não estamos, só temos um leitor. Então, por que esse objeto leitor é útil? Bem, vamos cortar a perseguição. Ele nos permite ler o fluxo. Especificamente, podemos ler os dados em pedaços. Nós, um pedaço é um byte ou uma matriz digitada. Mas, de qualquer forma, a linha inferior é que, uma vez que tenhamos um leitor padrão de fluxo legível, podemos acessar a filha usando seu método de leitura. O que super duper interessante é que assim que esse leitor é criado, o fluxo é bloqueado e nenhum outro leitor pode ter chance dele até, claro, você chamar o bloqueio de liberação método nele. Não se preocupe, outro, é muito avançado e isso não é um curso sobre fluxos. A coisa mais importante que eu quero que você saiba é que quando temos esse objeto de leitor padrão de fluxo legível para nós. Podemos usar o método de leitura para realmente ler pedaços de dados, mas por, mas pássaros, você me conhece agora, eu adoro exemplos práticos. Deixe-me voltar para o editor. Deixe-me mostrar como podemos usar o método de leitura. E o que é muito legal é se abrirmos isso e olhamos para o protótipo, esse é um método de propriedade chamado read. Ok, OK, OK. Portanto, temos esse leitor padrão de fluxo legível. Sabemos que tem uma função chamada read. E com isso, podemos ler pedaços de dados. Deixe-me mostrar exatamente o que quero dizer. Então, vamos voltar agora ao nosso editor de codificação. Agora não queremos o leitor, não é? Agora queremos pedaços disso. É aqui que fica realmente emocionante. Sabemos que neste objeto de leitor padrão de fluxo legível, temos essa função vermelha. Podemos simplesmente encadeá-lo. E isso é praticamente isso. Vamos ver o que isso nos retorna vá para o navegador, limpe tudo. Esse é pod de tipo, eu vou dividir variável e vamos abri-la. Isso é interessante. Se abrirmos esse objeto. A segunda coisa que vemos é que obtemos duas propriedades feitas e valor. A propriedade value. Se abrirmos isso, isso lista todos os bytes recebidos. Isso é interessante. Mas como isso retorna uma promessa, podemos realmente utilizar a instrução vein para exibir o valor. Deixe-me mostrar o que quero dizer. Vamos voltar para isso leva dados para aqui. E, claro, tudo o que precisamos fazer é excesso, outra declaração de veia. E quais dados vamos receber nessa afirmação? Basta sentar o código. Se tudo estiver pronto, quais dados vamos obter? Bem, se voltarmos ao nosso navegador, lembre-se que eu disse que essa variável de bloco nos devolve as propriedades Dun e value. Sabemos que o que nos é devolvido é o valor e os objetos feitos. Muito legal em tudo. Quero mostrar agora é que quero mostrar a você como é essa propriedade de valor. Podemos apenas registrar o console na tela. Vamos ao navegador e atualizar. E lá vamos nós. Nós obtemos esses valores. Voltando ao nosso código. Eu não quero que nos concentremos realmente no que é feito por enquanto. Só quero mostrar como podemos acessar o valor que Bits e Bytes receberam de uma resposta do Ajax. Foi o que fizemos aqui. Isso é o que está no nosso console. E se abrirmos qualquer grupo único de itens de matriz, o que você será visto ou bytes. E esses bytes são armazenados em uma matriz uint8. Você pode simplesmente imaginá-los como sendo um monte de bytes. O número desses arrays que recebemos e o tamanho deles. Bem, isso vai depender da condição da sua rede. Se você tiver uma conexão de rede mais rápida, você terá alguns arrays grandes. Claro, se você tiver uma conexão com a Internet mais lenta, ela irá pingar arrays menores de volta. E haverá o mínimo com frequência. Muitas vezes, você realmente não quer lidar com a filha binária. Mas não se preocupe, podemos transformar o fluxo em algo legível. De qualquer forma, entendi. Desculpe. Vamos voltar para a sala de aula. Isso não é divertido? Estamos ficando bem avançados agora, não estamos? Então deixe-me dizer que com o leitor, podemos ver um excesso de todos os dados. Mas há uma desvantagem porque esses dados estão em formato binário. Isso significa que não tem sentido. Eu sei, eu sei. Então, o que fazemos? Bem, para transformar bytes em caracteres, você precisa usar algum tipo de API de codificação. Você precisa de algo para passar por esses bytes e convertê-lo em algo significativo. Bem, qual API de codificação pode usar? Bem, um desses codificadores é o texto Dakota, e isso é dado a nós, é claro, pelo navegador. E as ações falam mais alto que as palavras. Então, vamos ver como podemos usá-lo na prática. Tudo bem, então agora temos essa matriz de ajudas uint8, o que não tem sentido porque eu não entendo o que esses números significam. Mas não se preocupe, como acabei de mencionar, podemos usar uma API de codificação que basicamente transforma esses bits e bytes, dois caracteres que entendemos. Como fazemos isso? Bem, isso é muito fácil. Não queremos apenas registrar esse valor no console. Na verdade, queremos decodificá-lo primeiro? Então, como fazemos isso? Bem, o que podemos fazer, navegadores diferentes têm decodificadores diferentes. Estou usando o Chrome. Então, por que não pegamos o decodificador do Chrome? É claro que é uma função de construtor, e isso é dado a nós diretamente da caixa pelo navegador. Queremos um decodificador que decodifique em UTF-8. Por exemplo, UTF-8 é o padrão. Agora temos nosso decodificador. O que podemos fazer é acessar nosso objeto decodificador. Há um método no decodificador a frio. O que queremos decodificar? Queremos decodificar todas as nossas bundas. Muito legal. Vamos para o navegador. Deixe-me atualizar. E boom, nós vamos. Há nosso resultado. A chamada para essa API, a propósito, retorna apenas cinco postagens, que é o que temos aqui. Cara, isso é legal. Tão bem feito, bem feito por ficar comigo durante toda essa palestra. Sei que faz muito tempo, sei que tem sido muito complicado. E esse é um tópico muito complicado. Na verdade, na maioria dos casos, você não precisará decodificar pedaços de dados, mas, por pouco, você pode esperar seu código assíncrono seja concluído e depois trabalhar com os dados. Mas eu darei a vocês pelo menos uma compreensão de alto nível de como os fluxos funcionam. Porque eu quero que você seja um grande mestre quando se trata de Ajax, que eu conheço, eu sei, eu sei recrutar por isso bem feito para ficar comigo. E estamos quase acabando. Deixe-me apenas fornecer um resumo de alto nível. Sabemos que a API Fetch nos retorna um fluxo legível. Podemos acessar o fluxo acessando o corpo do objeto de resposta. E assim que tivermos o fluxo, podemos começar a lê-lo. Mas, para lê-lo, temos que criar nosso objeto leitor. Fazemos isso executando o método gate Reader. Depois disso, para realmente ler os dados, podemos executar a função de leitura que nos retorna a valores, valor e feito. E como vimos, o valor está em bytes. Então, combinando isso com o decodificador, temos tudo o que precisamos para usar pedaços de dados à medida que eles chegam. Muito legal. Sei que isso é muito avançado. Eu mencionei que este não é um curso sobre fluxos. Este curso já é longo o suficiente tentando apenas obter o conceito de HX. Mas pelo menos agora você começa a obter uma compreensão de alto nível dos fluxos. Porque lembre-se, Fitch é baseado no conceito de usar fluxos. Muito legal, muito excitante. Vejo você na próxima palestra. 4. Como escrever para streams: Se você acha que estava confuso na palestra anterior, só vou piorar as coisas porque agora fui falar com você sobre escrever com transmissões. Fluxos estão ficando bem avançados agora. O que isso significa é que você pode até ver os dados em uma solicitação em fluxos. Sei que isso é muito, muito avançado. Não se preocupe se você não entender essa palestra. Mas são transmissões tão excitantes é um tópico muito emocionante. Talvez eu deva fazer um curso inteiro em fluxos. Mas, por enquanto, eu só quero que você saiba que não só temos que ler fluxos, também podemos enviar fluxos e direto para o muito, muito legal, Como fazemos isso? Bem, também temos que usar a interface de fluxo legível. Acontece que, neste caso, estamos criando nossa string legível. Ao usar isso, podemos criar e retornar um objeto de fluxo legível nós mesmos. Certo? Ok, ok, deixe-me dar um exemplo. Mas antes que eu faça, você pode estar pensando, como isso pode ser útil? Essa é uma boa pergunta. Bem, pense nisso. Pense em uma sala de bate-papo, por exemplo, assim que o usuário começar a digitar ou até se concentrar em um campo, você pode começar a configurar sua solicitação de streams. Você pode enviar cabeçalhos e todos os outros pedaços de informações aleatórias primeiro para o servidor. Então você pode parecer que o texto quando eles fizeram em um momento diferente e isso apenas melhorará a velocidade. Isso criará uma melhor experiência do usuário. Na verdade, você pode até começar a enviar dados para um servidor à medida que o usuário começa a digitar. Hallmark parece quando se trata de código. Mais uma vez, não fique atolado em todos os detalhes. Não se preocupe com como fazer isso. Eu só quero que você entenda em alto nível como funciona nos bastidores. Digamos que um usuário esteja digitando em uma sala de bate-papo e queremos enviar alguns ticks para um servidor por meio de um fluxo. O que podemos fazer é criar o objeto stream. Instanciamos a interface de fluxo legível usando a nova palavra-chave. O que é realmente legal é você saber o que isso tudo significa agora, certo? Legal. Bem dentro desse fluxo legível, precisamos iniciar nosso próprio controlador. Não se preocupe com o que é isso. É basicamente uma maneira de definirmos nosso próprio fluxo personalizado quando o usuário digita dia alto, digamos que o pegamos dinamicamente aqui, apenas digitando-o, mas na realidade nós o pegamos. Em seguida, editaríamos em um fluxo. E então vamos fingir aqui que o usuário levou 1 segundo para digitar, como você está? E depois pegamos esse texto e editamos em um fluxo. Em seguida, chamamos o método close e terminamos nosso fluxo. Então, neste momento, você pode pensar que poderíamos enviar o fluxo em nossas solicitações normais do Ajax que você pode pensar que podemos usar nossa API Fetch, o estado final do URL que é o método é publicado e então o corpo da nossa solicitação de postagem, você pode pensar que podemos colocar nosso objeto de fluxo. Infelizmente, você estaria errado. A razão é, a partir de agora, o pedido de um corpo ajax tem que estar na forma de texto. Isso significa que o corpo da solicitação não pode ser um fluxo. O que isso significa é que você teria que decodificar o fluxo de volta para o texto antes de enviá-lo. E podemos fazer isso. Já vimos isso antes usando o método pipe through e obtemos um, pegamos todos esses dados binários e dentro de posit para isso leva fluxo de decodificador. Mais uma vez, quero enfatizar novamente, não se preocupe com o código. Não se preocupe muito com isso. Escrever foi fluxos é muito avançado. Eu só queria que você soubesse que ela existe. Sei que nos deparamos com muitos fluxos, mas confie em mim, confie em mim, todos vocês já estão a quilômetros à frente. A maioria dos outros desenvolvedores, quando se trata de trabalhar com o Ajax, essa é uma informação muito interessante para você aprender e isso o ajudará. Na próxima palestra. Só quero resumir tudo o que aprendemos quando se trata de fluxos. Antes de avançarmos para novas discussões em torno da Fitch. Vejo você na próxima palestra. 5. Resumo do curso: Falante desse boom, estou dizendo ao seu cérebro como um cogumelo mal subiu. Toque uma melodia. Vamos, vamos lá. Você tem que ser feliz. Você chegou até agora e muito obrigado pelo seu apoio. Obrigado por ficar comigo. Estou super orgulhoso de você a propósito, porque estamos discutindo tópicos muito avançados. As pessoas, você sabe, simplesmente se perderiam e não querem continuar tão bem feito, sério D Muito bem feito. Você em milhas ou oito fiduciários. Tudo bem. Deixe-me dar um resumo. Temos falado sobre fluxos. Os fluxos são apenas pedaços de dados. Não fique atolado com todos os detalhes complicados. É importante porque o Fetch usa o poder dos fluxos. Mas nem sempre tínhamos cordas. Antigamente. Você tinha que ler um arquivo na memória de uma só vez. E o que torna os fluxos únicos é que ele nos permite ler pedaços de dados peça por peça. E isso torna os sonhos realmente poderosos ao trabalhar com grandes quantidades de dados. Porque, por exemplo, agora você pode ler o tamanho do arquivo que é ainda maior do que o espaço livre de memória. E isso é realmente emocionante, alunos enlameados porque com o ajax, com a API Fetch , é possível extrair, ler, buscar dados, quantidades muito grandes de dados e arquivos de um servidor. Vamos pegar um serviço de streaming como YouTube ou Netflix, por exemplo. Sabemos que esses serviços não fazem você baixar todo o feed de vídeo e áudio ou olhar uma vez. No palco, seu navegador recebe o vídeo como um fluxo contínuo do que tem pedaços, permitindo que os destinatários, você e eu, comecem a assistir e ouvir quase que imediatamente. É muito, muito legal. Certo, entendi. Portanto, os pontos fortes basicamente fornecem duas grandes vantagens sobre outros métodos de manuseio de filhas. Transmita um único, com eficiência na memória e com eficiência no tempo. Por eficiência de memória, quero dizer que você não precisa carregar grandes quantidades de dados em sua memória antes de poder processá-los. E, claro, isso alimenta a próxima grande vantagem, sendo eficiente em tempo, leva muito menos tempo para interromper o processamento de dados assim que você os tiver, em vez de ter que esperar com o processamento até que toda a carga útil tenha sido transmitida. Então esse é o benefício dos fluxos. Sabemos que é aplicável a nós neste curso porque a recuperação da API Fetch começa a partir de um servidor como um fluxo legível. E eu poderia ter parado por aí. Serei honesto com você e eles passaram para outras discussões, ataques, mas eu queria mergulhar mais em fluxos. Especificamente, eu queria mostrar que podemos acessar o fluxo de dados por meio do método get Reader. Lembra disso? E então podemos ler o fluxo através do método de leitura. Mas eu quero enfatizar aqui que você não precisa trabalhar com fluxos, você não precisa fazer isso. Você pode lidar com uma resposta do Ajax por meio do método JSON. E já vimos exemplos disso inúmeras vezes. E, claro, o que é retornado no método JSON é um objeto JavaScript e você pode usar esse objeto JavaScript da maneira que desejar. Então, realmente o que estou tentando dizer é que se todo esse tópico de fluxos passou por cima de sua cabeça, não entre em pânico. Você não precisa saber sobre nós para saber sobre o Ajax. Mas, de qualquer forma, o suficiente em fluxos tem sido muito divertido e espero que você tenha gostado. Muito bem. E verei em breve. 6. Reconhecimento do curso: Ei, muito bem, bem feito, muito bem. Eu disse que essa aula seria curta e doce, mas tem sido doce, não é? Porque agora você sabe algo que maioria dos desenvolvedores nem sabe quais fluxos, tudo, você sabe quais fluxos legíveis ou você sabe como extrair esses dados de um trecho de fluxo por bloco. Eu até te apresentei o conceito de branco em fluxos. Agora, os fluxos por si só são um tópico muito grande. Então, essa classe, o propósito não era fazer com que você se tornasse um grande mestre e fluxos. Seu objetivo era fazer com que você entendesse ajax, a API Fetch que ele depende de strings. Agora, geralmente ao usar chamadas ajax e usar a API Fetch, você não precisa ler partes da rua. Já vimos que temos métodos como o método JSON que usa método que faz tudo para aguardarmos o término do fluxo. E então nos dá isso no corpo da resposta que podemos acessar através de outra promessa. Mas de qualquer forma, você já sabe tudo isso. Terminamos essa aula. Muito bem. E na próxima aula, quero que voltemos a falar sobre a API phage, mas quero discutir alguns conceitos um pouco avançados. Quero começar a falar sobre coisas como a propriedade ok. Quero começar a apresentar a interface de URL, a interface de solicitação, a interface de cabeçalhos e muito mais, talvez algum tratamento de erros também. Quem sabe, quem sabe? Vamos ver. Liguei para esperar, e te vejo na próxima aula.