YEAR
TECHNOLOGIES
- JavaScript
- SASS
- HTML
TOOLSET
- AdobeXD
- VSCode
- Git
- Github
- Cloudfare
Odin's Forecast
A weather app built to deliver only the most important weather information. This was built using vanilla JS. Everything else was also coded by hand. The results? It can run in any browser, works on mobile and desktop while using ES6 JS syntax for beautiful code that's easily understood by other developers.
LAUNCH PROJECT
Secure API calls, fast UI updates, city auto-complete
Two APIs (Flickr and OpenWeatherMap) are used in conjunction with Cloudfare service workers setup to secure my API keys. The result is that no sensitive information is exposed in the response. An image of the queried location is returned from Flickr's API. The response is filtered on the service worker side with a dynamic query so that only 5 relevant images are returned. I then randomly selected one of the returned images to serve as the image displayed to the user to keep things interesting. The Algolia API was used to implement an auto-complete search feature assisting users in finding the name of a city they can't quite remember correctly.
Skills Utilized
Mobile-First
The entire design was built with mobile-users in mind. This mindset elucidated the most important UI elements required for a complete experience. As a result, the final UI is lean and minimalistic.
API Consumption
Three different APIs were called using JavaScript's Fetch. Responses were trimmed and tailored according to what I needed displayed. Response errors are handled and default values are used as fallbacks.
Security
Cloudfare's service workers were setup and then called from within my JavaScript code. This added an extra security layer to keep my API keys hidden and thus keep my API accounts secure.