Desenvolvendo uma aplicação de CLIMA com HTML, CSS e JavaScript | Integração com a API OpenWeather

แชร์
ฝัง
  • เผยแพร่เมื่อ 5 ส.ค. 2024
  • Olá, pessoal!
    Neste vídeo, vou te mostrar como utilizar uma API de clima (OpenWeather) usando JavaScript. Além disso, iremos conhecer alguns conceitos de CSS, como flexbox e grid.
    Api usada no vídeo:
    openweathermap.org/current
    Repositório com o código:
    github.com/Larissakich/weathe...
    Redes sociais:
    LinkedIn: / larissakich
    Instagram: @lariikich
    E-mail:
    larissakich04@gmail.com
    Tema do VSCode:
    Omni Owl
    Capítulos:
    00:00 - Introdução
    00:55 - Criação do projeto
    02:15 - HTML
    10:20 - CSS
    22:16 - JavaScript
  • วิทยาศาสตร์และเทคโนโลยี

ความคิดเห็น • 45

  • @systemtik4580
    @systemtik4580 19 วันที่ผ่านมา

    Muito top, desenvolvi o meu e ficou muito legal, apesar de eu achar que essa API não seja muito legal, gostei do video e aprendi você é uma boa profissional querida. :)

  • @wxsleyb
    @wxsleyb 4 หลายเดือนก่อน

    projeto mt fofo lari, parabéns

  • @Albert_Su
    @Albert_Su 5 หลายเดือนก่อน

    Aula sensacionoal, parabens!!!

  • @PauloHenriqueMusicphm
    @PauloHenriqueMusicphm 5 หลายเดือนก่อน

    Excelente conteúdo! Esse é o segundo projeto que faço através de seu canal. Parabéns pela didática! 👏❣

  • @rhuanribeiro5428
    @rhuanribeiro5428 6 หลายเดือนก่อน +2

    tive muitos problemas por não usar o encodeURI, ainda bem que achei seu vídeo. Muito obrigado!

  • @fabricioitajuba
    @fabricioitajuba 2 หลายเดือนก่อน

    Muito bom!!!!! parabéns!!!!

  • @jvsouza-hv3vg
    @jvsouza-hv3vg 3 หลายเดือนก่อน

    Parabéns, top !!!

  • @guitechtubebr
    @guitechtubebr 2 หลายเดือนก่อน

    Ótima explicação e didática Larissa. Sou professor e youtuber, só que com foco em lógica de programação e sintaxe da linguagem, também e sempre estou em buscar de novos aprendizados, até para poder compartilhar conhecimento. Tenho um pouco de dificuldades, ainda, na questão de montar uma página com um layout bacana e através dos seus vídeos estou quebrando essa barreira de dificuldade. Por isso te parabenizo pelas aulas e didática e nunca desista de ensinar

  • @human_oficial
    @human_oficial 6 หลายเดือนก่อน

    Muito obrigada pelo vídeo, ótima explicação!

    • @larissakich
      @larissakich  6 หลายเดือนก่อน

      Eu quem agradeço ☺️

  • @PauloSantos-yc2fx
    @PauloSantos-yc2fx 6 หลายเดือนก่อน +1

    Adorei o vídeo! Explicou a lógica do funcionamento de cada coisa na aplicação de madeira que facilitou o entendimento

    • @larissakich
      @larissakich  6 หลายเดือนก่อน +1

      Muita obrigada! Fico feliz em poder ajudar 😀

  • @marianagoncalves6833
    @marianagoncalves6833 6 หลายเดือนก่อน

    Parabéns pelo vídeo, me ajudou muito!

    • @larissakich
      @larissakich  6 หลายเดือนก่อน

      Muitooo obrigada ❤️

  • @erycfreire3294
    @erycfreire3294 6 หลายเดือนก่อน

    Obrigado, me ajudou muito!👍🏽💪🏽

    • @larissakich
      @larissakich  6 หลายเดือนก่อน

      Eu quem agradeço, fico feliz em ajudar 😊

  • @FredsonNascimentoSousa
    @FredsonNascimentoSousa 6 หลายเดือนก่อน

    Excelente!

    • @larissakich
      @larissakich  6 หลายเดือนก่อน

      Muito obrigada!😊

  • @leiturando2100
    @leiturando2100 6 หลายเดือนก่อน

    Consegui aprender muito, vídeo muito bom

    • @larissakich
      @larissakich  6 หลายเดือนก่อน

      Fico muito feliz em ler isso 😁

  • @douglas2085
    @douglas2085 5 หลายเดือนก่อน

    Eu estou terminando a trilha de Java e não fazia ideia de como se consumia um endpoint de api... Vc me deu uma luz imensa.. obrigado

  • @apaolaoliveiraa
    @apaolaoliveiraa 6 หลายเดือนก่อน +2

    Te conheci pelo LinkedIn e adoro os seu vídeos :) Uma sugestão seria adicionar mais tags semânticas no HTML, como transformar a div #weather em main, as divs #temp e #other-infos em sections e adicionar alguns aria-labels como no input e button. Assim melhoraria a estrutura do código e o deixaria mais acessível! bjs

    • @larissakich
      @larissakich  6 หลายเดือนก่อน

      Oii, muito obrigada pela dica 😊

  • @aarosanunes
    @aarosanunes 4 หลายเดือนก่อน +2

    o vídeo está bom mas existem pontos bem confusos, parece que o vídeo foi cortado partes, que pequenas fossem, acho que iria acrescentar, partes do código não batem e o código simplesmente deixa de ser um todo e viram apenas partes soltas, quando executando não funciona mas foi um dos melhores vídeos que encontrei entre diversos.

  • @wnolau
    @wnolau 5 หลายเดือนก่อน

    Larissa, como faço pra abrir o index direto em determinada cidade, sem a caixa de seleção? É complicado?

  • @wnolau
    @wnolau 5 หลายเดือนก่อน

    Estou tentando usar o codigo mesmo sem saber quase nada de programação.
    Eu removi todas as instruções no input, preciso q a pagina inicia já vá direto para uma determinada cidade sem a caixa de formulário. Alguem pode dar alguma dica?

  • @luizpaulo2537
    @luizpaulo2537 5 หลายเดือนก่อน

    não funcionou o grau Celsius, o que poderia ser?

  • @FranciscoDiakomas-x2p
    @FranciscoDiakomas-x2p 20 วันที่ผ่านมา

    Minha api Key não esta a funcionar

  • @pliniomarcos4922
    @pliniomarcos4922 4 หลายเดือนก่อน

    você é PIK4 !! AM31

  • @scoottzn
    @scoottzn 6 หลายเดือนก่อน

    Aprendi muito! Mas umas cidades fica dando conflito por nao informar o estado, teria como fazer isso por essa API? Nao consegui encontrar.

    • @larissakich
      @larissakich  6 หลายเดือนก่อน

      Oii, você pode informar na URL o parâmetro de estado, se não me engano é separado por "," na hora de pesquisar, você consegue ver isso nesse link:
      openweathermap.org/current
      Na parte de "Parameters" lá no parâmetro "p" tem uma explicação de como funciona

  • @misaelsapiente4124
    @misaelsapiente4124 6 หลายเดือนก่อน

    🤝🤝🤝🤝🤝

  • @leandroperdona7691
    @leandroperdona7691 5 หลายเดือนก่อน

    Olá Larisa muito obrigado pelo vídeo ! Te mandei um e-mail depois se possível de uma olhada, obrigado!

  • @sodeolho959
    @sodeolho959 6 หลายเดือนก่อน

    Eu gostei muito do vídeo parabéns 👏👏 Estou começando a entrar na área de Front end agora e estou acompanhando muito seu canal e gostando ❤. Eu queria saber como foi sua rotina para estudar a programação e suas duvidas no começo da programação, como estou começando por agora estou cheia de duvidas 🤣 tbm.

    • @larissakich
      @larissakich  6 หลายเดือนก่อน

      Muito obrigada!! Espero conseguir te ajudar nessa jornada ☺️ bons estudos

  • @GabrielandreR
    @GabrielandreR 6 หลายเดือนก่อน

    qual a configuração de seu pc lari ?

    • @larissakich
      @larissakich  6 หลายเดือนก่อน +1

      Oii, é um Lenovo IdeaPad s145, Intel(R) Core(TM) i7-8565U, SSD de 512 GB, 8 GB de RAM

  • @italodamasceno6626
    @italodamasceno6626 6 หลายเดือนก่อน +1

    unica coisa que nao conseguir fazer foi colocar os icones

  • @lucianogoncalves6596
    @lucianogoncalves6596 6 หลายเดือนก่อน

    Olá Lari, tudo bem ?
    oq acha de inseri uma vinheta de abertura nos seus vídeos como exemplo da Rafaella Ballerini, caso tenha interrese eu faço pra vc no 0800!

    • @lucianogoncalves6596
      @lucianogoncalves6596 6 หลายเดือนก่อน

      Estou aprendendo a programar e vc e umas das pessoas que esta ajudando muito nesse meu progresso, e quero muito retribuir essa contribuição!

    • @larissakich
      @larissakich  6 หลายเดือนก่อน

      Oii, muito obrigada!! Fico muito feliz em podendo te ajudar nesse precesso. Me manda um email para larissakich04@gmail.com que consigo te responder certinho por lá

    • @lucianogoncalves6596
      @lucianogoncalves6596 6 หลายเดือนก่อน

      mandei um e-mail pra você, caso tenha interesse!

  • @WellingtonCoutto
    @WellingtonCoutto 6 หลายเดือนก่อน

    Pq vc não definiu a largura nem altura para o container principal?

    • @larissakich
      @larissakich  6 หลายเดือนก่อน +2

      Oii, preferi não definir um tamanho fixo pra que ele se adaptasse ao conteúdo de dentro, mas não muda muita coisa