<img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id=1063935717132479&amp;ev=PageView&amp;noscript=1 https://www.facebook.com/tr?id=1063935717132479&amp;ev=PageView&amp;noscript=1 "> Bitovi Blog - UX and UI design, JavaScript and Front-end development

Bitovi |

New CanJS Recipe: Weather Report Guide

Learn about a new recipe we’ve added to CanJS.com: the Weather Report Guide!

Chasen Le Hara

Chasen Le Hara

Twitter Reddit

The new Recipes section on CanJS.com now has a new guide: Weather Report!

This guide walks you through building a simple weather report widget with Yahoo’s Weather API and Query Language (YQL):

  • Allow a user to enter a location
  • Get and display the places for the user’s location name
  • Allow a user to select a place
  • Get and display the forecast
  • Hide the forecast if the user changes the entered location
  • Skip selecting a place if only one place matches the entered location

It takes about 25 minutes to complete and was built with CanJS 3.5.

Here’s a quick demo of what the final widget looks like:

weather forecast.gif

This new guide was presented by Brian Moschel and Kevin Phillips yesterday at DoneJS Chicago. If you’re in Chicago, join us for future hack nights on projects like this one.

We’ll be adding more recipes over time based on what we hear the community wants, so let us know what recipe you would like to see us cook up next. If you have any questions or comments while going through the recipes, please join us on our forums or Gitter chat!