Lets Create a Weather Widget in Angular using Open Weather Map Api

แชร์
ฝัง
  • เผยแพร่เมื่อ 15 ก.ย. 2024
  • In this simple example, you can see how we can use the open weather map api to fetch the recent weather data for any city and then use that to create our own weather widget in Angular.
    Open Weather Map:
    openweathermap...
    Github Source:
    github.com/Nit...
    ►►►Like this Video? Please be sure to SUBSCRIBE for more:
    www.youtube.co...
    ----------My Social Links:
    🔴 Facebook Page: / code-first-21550750080...
    🔴 My Channel: / codefirst
    🔴 View Playlists: / codefirst
    🔴 My Github: github.com/Nitij
    #AngularWeather

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

  • @laynslife
    @laynslife 3 ปีที่แล้ว +7

    I've gone through so many tutorials but this one has been my favorite!! Thank you!!

    • @waylonjosiah5824
      @waylonjosiah5824 3 ปีที่แล้ว

      I realize I'm kinda off topic but do anybody know a good website to stream new series online ?

    • @daxtonlukas8892
      @daxtonlukas8892 3 ปีที่แล้ว

      @Waylon Josiah try Flixzone. Just search on google for it =)

  • @jochenmaier6691
    @jochenmaier6691 ปีที่แล้ว +1

    Thank you very much, very clear, very straight forward, many options to extend by own ideas!!

  • @seniorpomidordev
    @seniorpomidordev 4 ปีที่แล้ว +2

    Thank u for a video. It will be interesting to see how get data for several cities

  • @mahdiandalib186
    @mahdiandalib186 8 หลายเดือนก่อน

    thx man, plz create more angular videos

  • @wesleymiranda9541
    @wesleymiranda9541 2 ปีที่แล้ว

    Awesome conntent, thank you!

  • @bhuvaneshkumarrece5105
    @bhuvaneshkumarrece5105 ปีที่แล้ว

    Hey. This video is very useful to me man. But how to get it in real time . There is default of value for mumbai only?

  • @ThePiterCid
    @ThePiterCid 4 ปีที่แล้ว

    it's cool video ! thank you !

  • @hoangngocphuong949
    @hoangngocphuong949 3 ปีที่แล้ว +1

    nice

  • @21alof
    @21alof 3 ปีที่แล้ว

    well made

  • @Solomax
    @Solomax ปีที่แล้ว +2

    I was having a lot issues checking if it was really day or night with that method, so my solution:
    the API returns inside "weather[0].icon" three characteres, something like "02d".
    So, if the last character is "d" it is day / "n" for night
    so my method was:
    this.weatherData.isDay = (this.weatherData.weather[0].icon.split("").includes("d"))
    so it will returns direct from the icon if it's day or night by true or false

  • @MartinPhalane
    @MartinPhalane 4 ปีที่แล้ว +1

    Nice

  • @anmolsharma9539
    @anmolsharma9539 3 ปีที่แล้ว

    instead of this if you use a query parameter units=metrics then all the data comes in standard format hence no need to edit it

  • @lynnegeldenhuys9176
    @lynnegeldenhuys9176 3 ปีที่แล้ว

    Thanks so much! Really cool way to add weather to my current build!

  • @sayalichinchole5427
    @sayalichinchole5427 3 ปีที่แล้ว

    Thank You. Very well explained.

  • @sidraa8570
    @sidraa8570 2 ปีที่แล้ว

    How to do temp for different cities can u help me out

  • @buzzyso
    @buzzyso ปีที่แล้ว

    You skipped the part of how to show the data 06:57, i ddnt get how to do that

  • @rafiquemohammed3029
    @rafiquemohammed3029 2 ปีที่แล้ว

    Great tutorial. But i thought you are going to create a widget which will be reused on other 3rd party websites.

  • @irusuhome
    @irusuhome 3 ปีที่แล้ว

    Can I make my own widget based on this tutorial and upload it to github for my portfolio?
    no commerce

    • @CodeRadiance
      @CodeRadiance  3 ปีที่แล้ว

      Yeah man sure.

    • @irusuhome
      @irusuhome 3 ปีที่แล้ว

      @@CodeRadiance Thanks❤️

  • @mohamedatef97
    @mohamedatef97 3 ปีที่แล้ว

    This so cool, thank you very much. 👍💖👌 But, in 16:46 why did you put this.WeatherData = {
    main: {},
    isDay: true,
    };
    in ngOnInit() function and I tried to comment them and code still works so why did you add them? what is their purpose?

    • @CodeRadiance
      @CodeRadiance  3 ปีที่แล้ว +1

      Looks like default initialization but l'll hv to confirm. It's been a while since I created this video.😸

  • @vanity9038
    @vanity9038 4 ปีที่แล้ว +1

    Why is the minimum and maximum temperature always the same as the current temperature?

    • @seniorpomidordev
      @seniorpomidordev 4 ปีที่แล้ว

      temp_min and temp_max are optional parameters mean min / max temperature in the city at the current moment just for your reference.

  • @Alekslim13
    @Alekslim13 3 ปีที่แล้ว

    #FinalsSheridanCollege2020

  • @NILblubb
    @NILblubb 2 ปีที่แล้ว

    Thats no Widget, thats a full Angular Application.

  • @AshkanSaadabadi217
    @AshkanSaadabadi217 4 ปีที่แล้ว +1

    Then how we can show it in another page??? You juse made a simple page, Not A WIDGET!!!

    • @XxHenrykunxX
      @XxHenrykunxX 3 ปีที่แล้ว

      Exactly what I thought. Widget is something you inject into another html page, not just an angular project.