Usando a FETCH API do JavaScript

[@emersonbrogadev]

Link Secreto: ❓❓ emersonbroga.com/secret❓❓ ✅ Tenho um curso de JavaScript do básico ao avançado. emersonbroga.com/js ✅ Tenho também um livro sobre ES6, chamado JavaScript: As Novidades do ES6 emersonbroga.com/es6 ✅ Livro Sobre ES6 Gratuito no Kindle: amzn.to/3iE4lIF ✅ E em breve vou abrir mais uma turma do meu curso de React e NodeJS emersonbroga.com/react

[@MrDvcosta]

Emerson, você não é superman mas salvou minha vida, kkkkk. Vi dezenas de vídeos sobre consumo de API via Javascript com ou sem fetch, mas só entendi após ver seu vídeo. Você não ficou tentando reinventar a roda. Parabéns! Me inscrevi em teu canal prontamente! Sucesso pra você, meu caro!!!

[@emersonbrogadev]

Valeu!!

[@pedrotrudes1726]

meu amigo muito obrigado pelo conteúdo estava doido tentando consumir uma api ate ver o seu conteúdo simples e rápido !! parabéns pelo conteúdo!

[@emersonbrogadev]

Valeu demais!! SPOILER ALERT: Em breve vou lançar um Curso de Axios.

[@jaelmaciel3899]

Muito obrigado pelas suas explicações, me foi muito útil. Sucesso para você.

[@emersonbrogadev]

Valeu demais!! Em breve terei um curso de Axios!

[@alanbidu1]

Nos vídeos do Broga eu já começo feliz por ver ele usando ;

[@emersonbrogadev]

Valeu Baltham!! não esqueça dos seus ";" ! ehehheeh

[@B.E.H.]

Show, ganhou 1 inscrito!!!

[@vontadedeaprender7492]

Show!! Muito bom o vídeo, finalmente consegui entender o uso de fetch.

[@emersonbrogadev]

Muito Obrigado pelo feedback. Gostei do seu username.

[@sidneiglasman8878]

Ótimo vídeo. Javascript, cada vez mais!

[@emersonbrogadev]

Obrigado pelo feedback!

[@sagazph]

Pode me ajudar como enviar os dados que aparece no console.log para o meu BODY ? Preciso pegar uma rede credenciada e enviar para o body

[@rennanmelo8567]

Show Emerson. Ganhou um inscrito! Obrigado pelo conteúdo.

[@emersonbrogadev]

Obrigado! =)

[@alanchristian3209]

Eu quero dominar API faz mais aulas :D topp assim

[@emersonbrogadev]

vou fazer sim! tenho uns posts no blog tambem. corre la deois.

[@thioalves]

Parabéns mano, ótimo vídeo

[@emersonbrogadev]

Obrigado pelo feedback!

[@wellingtonmorete9472]

Parabéns cara , muito boa a explicação!!

[@emersonbrogadev]

valeu

[@lucasmezencio]

Show de bola, hein!

[@emersonbrogadev]

Valeu meu querido!

[@albertosilva9930]

Compreendi! P.S: Essa vinheta de abertura é massa.

[@emersonbrogadev]

valeu!

[@Trollation]

porque em algumas api eu consigo consumir com jquery ajax usando xmlhttprequest e com fetch da erro de cors?

[@emersonbrogadev]

não era pra ter essa diferença não. O CORS é uma configuração da API que deveria funcionar da mesma forma independente do que vc usa para fazer a requisição. Da uma olhada aí.

[@lucasthadeu83]

Agora eu entendi Agora eu saquei!

[@emersonbrogadev]

Aí sim! =)

[@dalmiroe]

Show....saberia dizer como fazer o exemplo da pg que vc mencionou (ranek) em JS, usando fetch para pegar um json e montar dinamicamente a tela com lista? Obrigado

[@emersonbrogadev]

Não sei se entendi bem a pergunta, mas acredito que sim Dalmiro.

[@hallanchristian3499]

Show, tenho uma dúvida como eu faria para fazer um get passando um token, parâmetros e url de requisição. E no caso tenha headers como faria tb?

[@emersonbrogadev]

Olá Hallan, dá pra fazer sim, o segundo parâmetro do fetch, é o options que é um objeto com outras opções e lá vc pode incluir os headers com os tokens e tals. Como eu to vendo que o pessoal ta gostando desse video, eu devo fazer um ensinando o GET/POST/PUT/DELETE com fetch, passando headers e tudo mais. Valeu.

[@hallanchristian3499]

Emerson Broga show vai ajudar demais isso!

[@emersonbrogadev]

@@hallanchristian3499 se quiser, participe da nossa lista de desenvolvedores ! emersonbroga.com/participe/

[@thiagolopes4163]

@@emersonbrogadev olá, você fez essa aula?

[@rodrigoofera]

se a minha página que eu estou requisitando seja em php ou outra linguagem nao retornar no response um objeto json? 4:33 Ou o objeto json é padrão pra todo fetch com os dados da requisição? Em um dos campos do json vai vir o response text?

[@emersonbrogadev]

isso vai depender de como a api funciona.

[@rodrigoofera]

Tem como setar o envio da requisição se é post ou get? tem como enviar um formData pra requisição? Poderia fazer um vídeo explicando?

[@emersonbrogadev]

Depois faço um video explicando as outras requisições. Valeu.

[@wallaceerick]

Bom explicacao man, parabens

[@emersonbrogadev]

Obrigado pelo feedback =)

[@lurdaum88]

Muito obrigado! Agora entendi!

[@emersonbrogadev]

Eu que agradeço! que bom que pude ajudar! =)

[@venommotorrockerbass]

Show

[@emersonbrogadev]

Valeu!

[@alanj.95]

Interessante aplicação mostrada no vídeo. Fazer uma pergunta: Seu livro também explica todos esses recursos JS que ensina nos vídeos do yt ?

[@emersonbrogadev]

Alan, no livro eu explico as novidades do ES6. Nesse post aqui, tem a lista dos capítulos pra você ter uma ideia do conteúdo e tals, da uma olhada la. emersonbroga.com/es6 E lembrando que vc pode ler o livro no android, ios e kindle.

[@emarciobdirector]

@@emersonbrogadev link tá indo p uma página scam.

[@emersonbrogadev]

@@emarciobdirector obrigado por avisar. o problema ja foi corrigido mas continua acontecendo com algumas pessoas. Você poderia tentar novamente por favor? Obrigado.

[@emarciobdirector]

@@emersonbrogadev tentei, agora já tá indo pra página com domínio correto mas sem conteúdo, "essa página não pode ser encontrada".

[@emersonbrogadev]

@@emarciobdirector emersonbroga.com/es6 corrigido.

[@thiagolopes4163]

se fosse fazer uma listagem como seria com a url? criando um for é substituindo o índice no final da url?

[@emersonbrogadev]

você teria que tratar essa coleçao de promises.

[@thiagodiniz8224]

Como eu uso o resultado de um fetch fora da função? Queria guardar em uma variável global e consumir em varias outras funções.

[@emersonbrogadev]

Você pode criar uma função que "seta/define/atribui" o resultado e chamar como callback, mas o ideal é ir passando esse resultado pra função que ira utilizá-lo.

[@FunctionDev]

ajudou demais!

[@emersonbrogadev]

fico feliz em ajudar!

[@paulovinicius9940]

A URL mudou, agora é: swapi.dev/api/people/1

[@emersonbrogadev]

isso! valeu

[@jorgedalves1781]

Aeeeeee

[@jorgedalves1781]

putz agora que vi que é Broga e não Boga

[@euricojbsilva3799]

Seguinte: preciso usar esse objeto e retornar valor(es) da função, ao invés de usar "console.log". Como fazer?

[@emersonbrogadev]

Você pode usar callbacks, promises ou até mesmo o async/await. Se tiver com dúvidas tenho video no canal sobre.

[@srsilva2]

Tô com o mesmo problema.

[@lazarok0963]

@@srsilva2 aquele data.name ele tá acessando a chave name do data. "data" é um objeto com váriás chaves e valores você pode desestruturar o que você quer assim const { name, height, mass} = data; Pra saber o que têm no objeto é só fazer console.log(data)

[@brenocristovaorocha]

bom vídeo !

[@emersonbrogadev]

Obrigado!

[@matheusdepaula4916]

Como eu faço para pegar um json por uma url do github

[@emersonbrogadev]

Vai depender do caminho no repositório, mas seria algo assim: github.com/[USERNAME]/[REPO]/blob/[BRANCH]/[CAMINHO_RELATIVO_DO_JSON]?raw=true

[@canallucasrocha]

Pode tirar um duvida, um fetch roda dentro de um for?

[@emersonbrogadev]

por ser assíncronos não seria interessante tratar isso em um loop, existe outras formas para fazer isso.

[@fernandaramos7625]

valeu

[@emersonbrogadev]

🤘

[@baianoprogramador]

Valeuu

[@emersonbrogadev]

Show de bola!

[@moisesbritoalmeida]

thanks!

[@emersonbrogadev]

No problem!

[@FunctionDev]

pretende colocar o curso na Udemy?

[@emersonbrogadev]

Opa! Eu tenho um curso de JS, e um curso de React/Node! E tambem um livro sobre as novidades do ES6! js.emersonbroga.com/links/

[@lucasoad399]

Problema é o post.

[@emersonbrogadev]

nao tem muito segredo nao. aqui no canal tem um video que eu mostro o upload usando tambem o fetch.

[@lucasoad399]

@@emersonbrogadev já aprendi. Vlw, cara.