Como integrar uma API com Fetch API
Вставка
- Опубліковано 2 січ 2023
- Código fonte: github.com/front-beginners/fe...
Fala beginners, hoje vamos aprender como consumir uma API utilizando o fetch do javascript, a maneira mais simples e sem precisar de nenhuma instalação adicional, é extremamente necessário dominar essa forma de consumir uma API, pois existem maneiras mais avançadas como por exemplo Axios, React Query, mas a base sempre vem primeiro.
📰 Inscreva-se no nosso Canal no Telegram:
t.me/frontbeginners
👨🏻💻 Curso que indico:
💻 Curso CSS e HTML +30 Projetos | Front Beginners: hotm.art/8484-dce6-b42f
💻 FullStack Javascript: hotm.art/Hx5fnJ
💻 Curso Algoritmo: hotm.art/fWuE71Z
✅ Já nos segue nas outras redes sociais?
Instagram: @frontbeginners
📚 Livros que indico:
Código Limpo: amzn.to/3vWLKy9
Arquitetura Limpa: amzn.to/376U7Oe
Domain-drive design: amzn.to/3vzvN0Y
Entendendo Algoritmos: amzn.to/3kxvihv
Padrões de Projeto: amzn.to/3y68Tjh
🖥 Meus equipamentos:
Teclado Keychron k2 v2: bit.ly/3BtZNy2
Mouse Mx Master 3: bit.ly/3RsvM7n
Mousepad: bit.ly/3QunWc3
Luz led Sokani P25: bit.ly/3B5HM7V
Bastão de Led RGB Sokani x25: bit.ly/3Btjmqh
Suporte Celular: amzn.to/3gyF0RQ
Tava a umas 3 semanas tentando aprender sobre isso, pq as pessoas explicam como fazer, mas n explicam desde o super básico pq usar, como ela funciona e afins, obrigadooooo!!! Vc explica mto bem
Que bom que ajudou meu mano, realmente tbm tinha essa mesma dificuldade no começo.
3/100 ✅ Finalmente consegui compreender melhor como funciona o Fetch API, seu jeito de explicar pegando desde o básico, até mostrar como funciona o processo na prática é muito bom, continue assim.
Vlw Rodrigo, tamo junto meu querido 🚀🚀
tô acompanhando a série dos 100 dias e queria q fossem uns 3 vídeos dessa qualidade por dia kkkkkkkkkkk
😂😂😂 rapaz até eu queria, mas se tu soubesse o trabalho que dá pra gravar uma aula, editar e postar, mas vamos firme 🚀
@@FrontBeginners akakkakaka osso, tô tendo um gostinho do q é agr, tô preparando uns vídeos de projeto pro meu LinkedIn e tá tenso 😅
Estudandoooo agora... Partiuuu 100 dias!!!!
bora !!
Só vamos 🚀🚀
Brabooo de maiis
Nossa, que fera! Entendi tudo...
Parabens!
Vlw Talita, tmj 🚀🚀🚀
Bora lá mais umas aula top!
Bora Matheus pra cima 🚀🚀🚀
vc tem tudo pra tar dando aula em uma grande empresa incrível sua facilidade de comunicação!
Hehehe, quem sabe a oportunidade uma hora aparece, vlw Eneilson 🙏🏻🙏🏻
Top demais!😍
Vlw meu querido 🚀🚀🚀
Conteúdo de qualidade 👌
Vlw Adriannn 🚀🚀
Brabo d+. Tô entendendo esses conceitos para conseguir um estágio daqui a alguns meses. Faço Análise e desenvolvimento de sistemas e me identifico muito com Front End. Parabéns.
Boa Isaías, sucesso meu querido ❤️🚀
poxaa finalmente aprendi esse negocio. Didatica muito daora
parabéns, ótima aula
Estou acompanhando e vou continuar. Só senti falta de uma organização melhor em cada aula. Tipo, poderia ter gerado um projeto e dentro criar um arquivo para cada aula, ficaria mais legal. Mas bora pra cima.
Fala Maciel, o intuito foi realmente trazer vídeos separados pra facilitar na busca e pesquisa no youtube e não gerar um curso com uma linha temporal :) Mas obrigado pelo comentário 💪🏼
Brabo demais, muito bom!
Vlw Marcos 🚀
a ideia de vc falar, onde vc usa no dia a dia ajuda a assimilar o conteudo
sim com certeza hehe
3/100 ✔ Bora pro próximo!
Mete marcha 🚀🚀
Um baita conteúdo!
Quando puder, mostra um pouquinho pra gente sobre como utilizar o postman nessa questão de APIs? Seria muito legal um exemplo prático de como as coisas funcionam por lá!
Um abraço!
Mano, muito bom cara, abriu minha mente sobre esse assunto.
Muito obrigado pelos ensinamentos.
Cara, que explicação! Parabéns e obrigada!
muito bom, parabéns
Valeu!!! Otimo video!!!
conteúdo de altíssima qualidade! acompanhando a jornada 🔥
Parabéns! Super bem explicado. 👏
Boa didática meu nobre.
Muito boa a explicação parabéns
Boa aula, bem claro e direto
Você é incrível, ajudou bastante, obrigado.
Muito bom o seu vídeo. Consegue fazer um vídeo partindo de um front end (exemplo: um formulário simples em html para lançar os dados no banco de dados? Vejo muitos vídeos sobre criar o banco de dados, consumir a api, mas não acho um vídeo simples do processo completo. Se for possível lhe agradeço muito!
canal otimo, realmente muito bom
Video muito bom! #dia3
Boa Vagner, bora continuar a série.
ótima aula
"Bodyzinho" kkkkkkkkkkkkkk rachei na hora. vlw pela aula prof, só conteúdo top.
kkkkkkk os costumes raizes kkko
Ótima didática, muito obrigado. Que Deus te abençoe
Muito bom!
Bora pra cima 🚀
day 3 ok 🚀🚀
Muito bom Felipe, bora continuar no caminho.
Muito bom o vídeooo!! valeuuu !
AMÉM, VALEEU, ngm explicava o nome dos trem, esse cara ai é brabo!!!!😁😁
Mano, esse tipo de trabalho é super necessário muito obrigado por isso, eu tenho dificuldade de entender alguns conceitos porque não enxergo a utilidade prática daquilo e esse formato que vc ta fazendo ajuda muito! Eu to acompanhando a serie dos 100 dias meio atrasado pq dei uma procrastinada no inicio, mas agora é foco 🚀🔥
cara, você é brabo!
Porque todos os tutoriais que vi o pessoal nao explicava nada, só iam colocando um monte de codigo e fds, voce explicou direitinho. Obrigado!!
Que vídeo bom, mano! Sério! Ajudou demaisss
Explicação muito esclarecedora do funcionamento do fetch
Virando tradição vir a tarde depois do estágio e assistir um vídeo dos #100Dias
show Sameminsmp vou ficar contente em te ver por aqui
Assisti vários vídeos sobre API mas estava com uma certa dificuldade em colocar em prática apesar de ter entendido a lógica. O seu vídeo esclareceu bastante e vou fazer um mini projeto usando API para praticar. Valeuuu
Muito bom
Nunca fui de dar like nem de comentar em nenhum vídeo no yt, mas vc merece
Vlw demais ❤️
vi no curso que tava fazendo e achei muito difícil e esse cara explica muito bem, abriu a minha mente, espero que ele poste mais vídeos pois ajuda muito
Boaaaa Luan, aqui a gnt tenta explicar do jeito mais simples possível rsrs 😌
Muito boa a aula, e também gostei do exemplo de uso na sua sua empresa.
Parabéns mano. mais explicado que isso impossível parabéns.
Mano vc é incrivel , ate conceitos que eu demorei pra compreende, se eu tivesse passado por esse video antes teria sido bem mais facil.
esse video simplesmente tirou todas as duvidas que eu tinha sobre consumo de APIs, trabalho incrivel!
valeu Bruno, tamo junto meu querido 🚀
Top, top. Simples e objetivo. Certeza vou estar aqui no 100/100
Boa Rodrigo, vamos ver quem vai terminar esse tudo com a gnt rs
Dia 03 ✓ ! Top ! Parabéns!
Parabéns 🎉🎉🎉
Muito bom esse tipo de conteúdo, estou finalizando um trabalho acadêmico e esse vídeo vai me ajudar muito.
Opa que bom que vai ajudar 🚀🚀🚀
TOP ✅.
Mano dahora, me abriu bem a mente sobre essa tag, precisava integrar uma API de consulta em uma loja física. Só preciso autenticar a Key agora.
Continue assim.👏👏👏👏
Vlw Luciano 🚀🚀
Aula perfeita
Vlw meu querido, tmj nessa 🚀🚀
@@FrontBeginners cara mto obrigado material mto bom parabéns
Que aula incrível cara! Obrigado por compartilhar seu conhecimento!
Vlwww tamo junto ♥️
Mesmo conhecendo todos os temas dos vídeos da jornada até agora, incrivelmente o vídeo sempre tem algo pra agregar. Muito bom!
Boa é isso Zolk, a gnt sempre aprende algo né.
mds vc explico muito bem, com muito detalhe, e ainda é bonito de quebra kkkkkk
Desculpa gritar, mas: SEUS VIDEOS SÃO MUITO BONS!!!! Obrigada pela jornada
hahaha obrigado pela energia Jessie, segue a gnt lá no insta tbm 🚀🚀
Seu conteúdo está me ajudando muito, obrigada demais! 😎✌
Obrigado pela msg Kelita 😊 🚀🚀 tmj
Parabéns ... cara amando as aulas e tipo quando comecei a estudar programação tivesse as explicações assim acho que seria mais fácil, didático e mais gosto de estudar.... Tô vendo todas as aulas para poder relembrar uhullll
Vlw Darioo 🚀🚀
Parabéns pelo trabalho
Vlw meu manoo
Já conhecia o conceito de api e fetch mas gostei de aprender nesse vídeo mais sobre o POST. Seguindo a jornada 3/100 ✔️
sempre agrega algo né hehe, bom demais
🚀
🚀🚀
você explica muito bem
Valeu meu querido 🚀🚀
Top
Vlw Davi, vmj
Cara... você é sensacional, apenas.
Hahaha vlw Leandro. tmj irmão 🙏🏻 que bom q ajudou.
top
Dia 3. Estou aqui!
Boa Ivan, voaaaa
Amigo primeiramente parabéns pelo video, tem algum video com validação ao banco de dados mysql?
muitobom
🚀🚀🚀
✅
🚀🚀🚀
🚀🚀
To terminando um curso de back e gostaria de aprender a integração com o front onde escontro a playlist dessas aulas para asistir desde inicio??
Bom dia, Direto do trem 3/100
Como faço para ter o console no vscode ?
Boa noite meu nobre, queria sanar uma duvida. Existe um site de manga, quadrinhos japonês, chamado slimeread , eu fiz um requisição fetch diretamente para o url do site mas não veio nenhum dados só um html puro e esquisito. Queria conseguir os dados para mostrar no meu próprio site. O certo seria ver se o site tem uma api?
Uma dúvida, uma vez que a resposta chega, como iterar isso para mostrar no html por exemplo. Com js puro. Em frameworks como angular eu sei como fazer e tals, mas no js puro não sei.
É da mesma forma, mas vc vai precisar a tag do html, por exemplo uma div e injetar dentro dela com innerHTML, aqui vai facilitar o entendimento: developer.mozilla.org/pt-BR/docs/Web/API/Element/innerHTML
3/100 is done
Brabo 🚀🚀🚀
3/100✅
Bora Ricardoo 🚀🚀
3/100 presente
Bom demais meu querido 🫶🏻🎉
3/100 checked
🎉🎉🎉
agita
Só mexe 🚀🚀😂
oi querido só nao entendi porque se esta em formato json, precisa converter p formato json...
Vc deve estar falando do momento em que ele faz o POST certo? Então, na vdd, no momento do post, a informação que ele estava mandando é recebida pela API como um objeto javascript, o JSON.stringfy transforma os métodos e valores do objeto em json para poder enviar para a API. *Um exemplo da própria documentação :
console.log(JSON.stringify({ x: 5, y: 6 })); // Aqui é um objeto javascript
// Expected output: "{"x":5,"y":6}" - Saída em JSON
obrigada @@weversonmp
Faltou colocar o dia
Mais ligeiro que o gato hahaha, vlw meu querido.
3/100
Boa Eloy.. só vamos 🚀🚀🚀
3/100