Como pegar os dados de um arquivo JSON usando JAVASCRIPT - Acessando um JSON com JAVASCRIPT

Поделиться
HTML-код
  • Опубликовано: 14 дек 2024

Комментарии • 103

  • @brunarafaela9688
    @brunarafaela9688 Год назад +2

    caracas, você explicou até os método eu vou chorar... continue assim! vai me ajudar muito

  • @jorgeissono4669
    @jorgeissono4669 Год назад +2

    Amigo vc sempre se superando, parabéns.

  • @gustavoterrin7921
    @gustavoterrin7921 16 дней назад

    Nossa teu video valeo muito, bem explicado obrigado.

  • @BrunoSilva-mu4mv
    @BrunoSilva-mu4mv 3 месяца назад

    Deus de abençoe infinitamente, era exatamente isso que eu estava precisando.

  • @reginaldogalli2094
    @reginaldogalli2094 Год назад +2

    Muito obrigado. Exatamente isso que eu estava precisando.

  • @IsabellaCristinaS_
    @IsabellaCristinaS_ 3 месяца назад

    era exatamente o que eu precisava!! Obrigada

  • @almirsilva838
    @almirsilva838 Год назад

    Parabéns! Muito boas estas explicações!

  • @michelesobrosa1339
    @michelesobrosa1339 Год назад

    Muito bom, Everton! Obrigada mesmo. Super me ajudou! 🤩

  • @VNSilva95
    @VNSilva95 Год назад +1

    video perfeito ajudou no meu projeto pessoal!

    • @evertondev
      @evertondev  Год назад

      Se precisar de ajuda tbm faço mentoria particular.

  • @reydsonmartins3165
    @reydsonmartins3165 Год назад +1

    Justamente o que eu estava procurando vlw.

  • @miqtutoriais9670
    @miqtutoriais9670 Год назад

    Cara, Parabéns! Excelente vídeo, tem canal grande que não chega nem aos pés da sua explicação prática! Tem canal que a pessoa apenas lê o script e não aplica nada.

  • @thiagopires5407
    @thiagopires5407 Год назад

    Parabéns pelo vídeo 🎉

  • @pandaHG0
    @pandaHG0 4 месяца назад

    Po vei, me ajudou demais, muito obrigado

  • @kennedyleonardo
    @kennedyleonardo Год назад

    video massa! Ganhou um inscrito

  • @brunocatan
    @brunocatan 2 года назад

    O melhor professor não tem como

  • @cafosinhos
    @cafosinhos 2 года назад +5

    Everton, se você soubesse o quanto salvou minha vida com esse vídeo... olha... nem te digo nada! hahahaha obrigadíssima por essa contribuição tão clara. Foi de muita ajuda para mim! Agora uma dúvida... existe alguma forma de eu substituir um dado do JSON utilizando uma função JS? Pensei em utilizar o replace, mas estou com dificuldades nisso.

    • @evertondev
      @evertondev  2 года назад +4

      Fico feliz em saber, se você quer alterar o arquivo Bruto não é recomendado, o que você pode fazer é atualizar o objeto recebido, mas quando você atualizar a pagina os dados são perdidos.
      Se você já esta sentindo a necessidade de inserir/alterar e excluir dados em um JSON agora é a hora de começar a ver banco de dados.

  • @Heidfelabel1
    @Heidfelabel1 Год назад +1

    Bom dia, Everton faz uma video aula explicando como conectar a pagina com um banco de dados

    • @evertondev
      @evertondev  Год назад

      Oi, então cara, tem que criar uma api em node se fosse o caso, eu posso fazer se você quiser.

  • @lucastomazini58
    @lucastomazini58 7 месяцев назад +1

    Parabéns, muito bom.
    poderia fazer um video explicando como faria se um deses dados fosse um aray com mais objetos dentro, e pegar os dados deste objeto? to com esse problema e não achei nada ainda

    • @evertondev
      @evertondev  7 месяцев назад +1

      Seria basicamente a mesma coisa, porém você teria que usar um map dentro do outro, estuda sobre matriz vai ajudar a entender.
      Qualquer coisa me chama no Instagram @Evertondev

    • @lucastomazini58
      @lucastomazini58 7 месяцев назад

      @@evertondev ok, obrigado.

  • @musicanimada7524
    @musicanimada7524 Год назад +1

    Aula top

  • @adryelmartins6943
    @adryelmartins6943 Год назад +1

    Professor, e se eu quero retornar exatamente da forma do vídeo, mas só que com o menor faturamento do mês de cada estado, no map eu passaria o usuário por exemplo e depois do parênteses do usuário eu colocaria element?

    • @evertondev
      @evertondev  Год назад +1

      pt.stackoverflow.com/questions/435941/pegar-o-menor-valor-de-um-array-de-objetos
      Opa, achei uma resposta muito boa aqui, da uma olhada.

  • @douglassouza9096
    @douglassouza9096 Год назад

    Top.....adorei....

  • @ArturHenrique
    @ArturHenrique Год назад

    Muito legal, só verifiquei que com innerHTML ele não inclui as dentro do código fonte, no caso de produtos e serviços o Google não reconheceria essas informações, existe alguma solução pra isso?

    • @evertondev
      @evertondev  Год назад +1

      Neste caso não tem como ser dinâmico, você vai precisar criar as fixas.

  • @PalomaCardoso01
    @PalomaCardoso01 Год назад

    Me salvou!!! Excelente!!!

    • @evertondev
      @evertondev  Год назад

      Que bom que ajudou, qualquer coisa dou mentoria de programação!

  • @btplacar
    @btplacar Год назад

    olá, e se o arquivo estiver do tipo D:/PLA/CFG/CONFIG.JSON como ficaria o fatch ? , já tendei de todas as formas, mas não leu

    • @evertondev
      @evertondev  Год назад

      Você precisa especificar o caminho partindo do local do arquivo, para voltar a pasta usa ..

    • @btplacar
      @btplacar Год назад

      @@evertondev Olá, grato por sua resposta, mas, minha pasta de exercícios java fica na unidade c:\java\projetos e o arquivo que quero abrir fica na pasta D:/PLA/CFG/db.json , e mesmo colocando o caminho não abere , já tendei com file:/// e tudo que podia tentar, faça ai você um teste quando tiver tempo e me passa um feedback ok. grato

  • @cleitoncfs
    @cleitoncfs 11 месяцев назад

    Professor, poderia fazer um video explicando como invocar o arquivo Jason em txt da pasta htdocs do Xampp.

    • @evertondev
      @evertondev  11 месяцев назад

      cara, no caso você esta usando PHP correto? seria mais facil pegar o txt e converter em JSON e usar o JS para fazer isso, ou o no PHP usar o json_decode

  • @eriveltonbezerradacosta7347
    @eriveltonbezerradacosta7347 Год назад +1

    Amigo o meu retorna a pagina html em branco. Precisa algum complemento>

    • @eriveltonbezerradacosta7347
      @eriveltonbezerradacosta7347 Год назад

      O código está idêntico

    • @evertondev
      @evertondev  Год назад

      Creio que você esta fazendo algo errado amigo, pode ser em adicionar o js no html por exemplo, ou não esta colocando o id certo.
      Me manda uma foto do codigo no insta. instagram.com/evertondev/

  • @DrWar-hg4tr
    @DrWar-hg4tr Год назад

    Opa, boa tarde o meu quando eu faço a parte do li ele fica como resultado ${usuario.nome} ele nao identifica o valor, sabe dizer como corrigir?

    • @evertondev
      @evertondev  Год назад

      Você esta colocando aspas simples eu acho, o certo é colocar crase `${usuario.nome}`

  • @RenanSantos7
    @RenanSantos7 Год назад

    Tentei fazer assim, mas o console retorna "Uncaught (in promise) SyntaxError: Unexpected token '

    • @evertondev
      @evertondev  Год назад

      No codigo fala qual é a linha?
      Entra no nosso servidor do Discord que eu posso te ajudar qualquer coisa.
      discord.gg/fSFj9TnT3D

  • @EdmundoHerculano
    @EdmundoHerculano Год назад +1

    É possível gravar dados nesse arquivo JSON usando apenas o JavaScript? Tenho que fazer um programa simples, apenas registrar o momento q usuários clicam em alguns botões e o momento que param de assistir um vídeo. O site esta hospedado na Hostinger, não tem suporte a Asp.Net Core e nem ao NodeJS (conheço um pouco dessas).

    • @evertondev
      @evertondev  Год назад

      Recomendo você ativar o ssh da hospedagem e instalar o nodejs, com isso você consegue criar uma api para salvar os dados em um banco de dados como o mongodb ou mysql.
      Não recomendo editar o JSON não é uma prática segura.

    • @EdmundoHerculano
      @EdmundoHerculano Год назад

      @@evertondev vc tem algum vídeo sobre essa ativação do ssh?

    • @evertondev
      @evertondev  Год назад

      Você precisa mandar msg no suporte, e pedir para eles.

    • @EdmundoHerculano
      @EdmundoHerculano Год назад

      @@evertondev muito obg pela informação!! Abraços

  • @astropetslove6137
    @astropetslove6137 2 года назад +2

    Tentei aqui mais meus navegadores não permitiram, nem o Chrome nem o Edge, falaram q deram um problema de política no CORS

    • @evertondev
      @evertondev  2 года назад

      Você está fazendo acessando o arquivo ou alguma API?

    • @evertondev
      @evertondev  2 года назад

      Para ser resolvido você pode aplicar um mode: cors, segue o exemplo.
      developer.mozilla.org/pt-BR/docs/Web/API/Fetch_API/Using_Fetch#fazendo_as_requisi%C3%A7%C3%B5es_fetch

    • @clarenciopessimista889
      @clarenciopessimista889 Год назад

      estou com o mesmo problema

    • @laerciosouza3874
      @laerciosouza3874 2 месяца назад

      O navegador está bloqueando a requisição ao arquivo dados.json devido à política de CORS (Cross-Origin Resource Sharing). Para resolver esse problema, você precisa hospedar os arquivos em um servidor web, mesmo que seja local. Se estiver usando o VS Code instale a extensão "Live Server"

  • @marcosschurmann831
    @marcosschurmann831 Год назад

    Olá! Aula excelente. Como faço para pegar apenas um elemento do Json. Por exemplo a idade do terceiro usuário?

    • @evertondev
      @evertondev  Год назад

      Pesquise pelo metodo find com ele você consegue pesquisar em um array um elemento e ele retorna apenas aquele elemento, ai você vai poder usar.

  • @gustav_spin
    @gustav_spin Год назад +1

    A minha principal dificuldade com o js, é o próprio js... Brinks

  • @alberparavel9350
    @alberparavel9350 Год назад

    Posso atribuir 2 arquivos de json diferentes em um mesmo método como esse? É que eu tenho 2 carrossel e não consigo fazer com que apareça na tela com um json só.

    • @evertondev
      @evertondev  Год назад +1

      Pode até mais, creio que seja o modo que você esta chamando o arquivo.
      Crie uma função para poder reaproveitar o retorno.

    • @alberparavel9350
      @alberparavel9350 Год назад

      @@evertondev me ajuda aí professor
      class Products {
      async getProducts(){
      try{
      let result = await fetch("products.json");
      let data = await result.json();
      let products = data.items;
      products = products.map(item =>{
      const {title, price} = item.fields;
      const {id} = item.sys;
      const image = item.fields.image.fields.file.url;
      return {title, price, id, image};
      });
      return products;
      }catch(error) {
      console.log(error);
      }
      }
      }
      Preciso que ele leia, mais toda vez que chamo o segundo json, dá erro e não consigo visualizar no display corretamente

  • @gabfpv7039
    @gabfpv7039 Год назад

    Muito Obrigado pelo video Everton, ajudou muito !!! Uma duvida, vamos supor que eu tenha um array com 100 objetos, mas quero apenas mostrar 10 na minha pagina, e o restante colocar nas paginas seguintes... Qual método devo usar ?

    • @evertondev
      @evertondev  Год назад

      É possível fazer isso utilizando vários modos, a mais simples de eu explicar por comentario basicamente você vai pegar a quantidade total, dividir pela quantidade de item que você quer mostrar em cada pagina, com isso você vai conseguir a quantidade de paginas que existe, então você consegue usar o numero da pagina para definir qual vai ser o primeiro elemento que vai aparecer naquela pagina e qual o ultimo, exemplo:
      Tenho 21 itens e que que mostre apenas 5 itens por pagina, dividindo vou ter 4,2.
      Minha primeira pagina vai ser os itens 0 * 5 + 1 até 1 * 5, na minha segunda pagina vai ser do 1 * 5 + 1 até 2 * 5, na terceira pagina vai ser do 2 * 5 + 1 até o 3 * 5, quarta pagina 3 * 5 + 1 até 4 * 5, e a ultima pagina vai ser 4 * 5 + 1 até 5 * 5, na ultima pagina vai ter apenas 1 registro mas a pagina vai ser gerada mesmo assim.

    • @evertondev
      @evertondev  Год назад

      www.braziljs.org/p/criando-um-sistema-de-paginacao-simples-com-javascript
      Esse artigo pode te ajudar.

  • @antonyalbuquerque7736
    @antonyalbuquerque7736 8 месяцев назад

    Eu conseguiria escrever isso diretamente em um .txt e logo efetuar o download só utilizando os códigos? Obrigado!

    • @evertondev
      @evertondev  8 месяцев назад +1

      Pode sim, pesquise por ActiveXObject("Scripting.FileSystemObject") que pode ajudar você

    • @antonyalbuquerque7736
      @antonyalbuquerque7736 8 месяцев назад

      Valeu!

  • @Lg.i1
    @Lg.i1 Год назад

    O meu retornou o seguinte erro :
    Uncaught (in promise) SyntaxError: Expected property name or '}' in JSON at position 24
    Você poderia me ajudar já tentei de muitas formas resolver mas não consigo

    • @delfodelfo
      @delfodelfo Год назад

      deve ser algum erro no próprio JSON, mas precisaria olhar o arquivo em si

    • @Lg.i1
      @Lg.i1 Год назад +1

      Obrigado já consegui corrigir

  • @infodevbrasil
    @infodevbrasil Год назад

    Só faltou os input para inserir os dados, mas ajudou muito

    • @evertondev
      @evertondev  Год назад +1

      Sim, mas como o indicado em organizar informações no JSON é que apenas manipule, se for para inserir, alterar e deletar recomenda-se usar um banco de dados.

    • @infodevbrasil
      @infodevbrasil Год назад

      @@evertondev mas vou te falar seria de grande valia um vídeo onde vc ensinasse a pegar os dados de input de um form e organizar em um json simulado um banco de dados, oque vc me diz?

  • @danielgomes2818
    @danielgomes2818 Год назад +1

    Muitissimo obrigado cara uma aula excelente você vai muito longe e espero mesmo para me salvar mais vezes. kkkk
    Só um duvida, como eu faço para pegar e dar um print no nome do objeto e colocar ele no html, por exemplo, fazer com que antes de José aparece o nome a que ele se refere:
    nome: José - 22 anos
    é possível pegar esse "nome" direto do JSON?
    Agradeço chefe e sucesso.

    • @evertondev
      @evertondev  Год назад +1

      Você pode usar o Object.keys, vou deixar um exemplo aqui em baixo.
      var myObject = { a: 'c', b: 'a', c: 'b' };
      var keyNames = Object.keys(myObject);
      console.log(keyNames); // Outputs ["a","b","c"]

  • @eletrotech51
    @eletrotech51 Год назад

    Boa

  • @dutodiboa
    @dutodiboa Год назад

    Você usou o nodejs ou apenas o servidor iis?

    • @evertondev
      @evertondev  Год назад +1

      Neste caso não estou usando servidor, apenas estou usando o arquivo com os dados JSON.
      Se você quiser aulas particulares de desenvolvimento web para iniciantes minha mentoria esta aberta, só precisa me mandar msg no instagram @Evertondev

  • @mangaedit1994
    @mangaedit1994 Год назад

    como eu faria para deletar ou atualizar esses dados?

    • @evertondev
      @evertondev  Год назад

      O ideal é você criar uma api e realizar uma conexão com o banco de dados, ouu armazenar no navegador, mas não seria escrito no arquivo

  • @igorgumprichcantuaria7465
    @igorgumprichcantuaria7465 Год назад +1

    Meu vídeo virou project.json ajuda nois

  • @superaula3458
    @superaula3458 Год назад +2

    essa resposta já e JSON ? - PORQUE PRECISO CONVERTELA DE NOVO SE O ARQUIVO JA É .JSON

    • @evertondev
      @evertondev  Год назад +1

      Por que a leitura do arquivo pelo fecth retorna o conteúdo da solicitação como um texto, o arquivo pode ser um Json e tem uma estrutura Json, mas o fecth quando executa retorna como fosse um texto corrido, então precisa converter para organizar a estrutura

    • @superaula3458
      @superaula3458 Год назад +1

      @@evertondev o retorno usuários. Mesmo eu retornando a chave do json e preciso colocar .usuários

    • @evertondev
      @evertondev  Год назад

      O .usuários é onde está todos os objetos por isso precisa

  • @XR55OR
    @XR55OR 11 месяцев назад

    aaanão fessor, meu deus isso tudooo, pra conecta json com html.........

    • @evertondev
      @evertondev  11 месяцев назад

      Para você ver, qualquer coisa só falar.

    • @XR55OR
      @XR55OR 11 месяцев назад

      ok@@evertondev

  • @andretaenia
    @andretaenia 7 месяцев назад

    mais ingual

  • @oliveiranacs
    @oliveiranacs Год назад +1

    é... não é fácil imprimir dados do json não

  • @Leossj1
    @Leossj1 Год назад

    Não tem um jeito mais simples de ler um arquivo JSON?

    • @evertondev
      @evertondev  Год назад +1

      Pelo incrível que pareça essa é a forma mais simples que existe.
      Se você quer apenas ver o conteúdo e não criar uma pagina html para usar os dados, você pode abrir o arquivo json no bloco de notas.
      Não sei se a pergunta foi essa mas foi isso que entendi rsrs