All Projects → atufkas → angular-openweather-app

atufkas / angular-openweather-app

Licence: MIT License
A weather forecast app written in AngularJS

Programming Languages

HTML
75241 projects
javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to angular-openweather-app

OWM-JAPIs
Java APIs for OpenWeatherMap.org
Stars: ✭ 14 (-74.07%)
Mutual labels:  openweathermap-api, openweathermap, weather-data, weather-forecast
TheWeatherDashboardApp
A small and stylish weather dashboard.
Stars: ✭ 29 (-46.3%)
Mutual labels:  openweathermap-api, openweathermap, weather-forecast
Ngx Quill Editor
🍡@quilljs editor component for @angular
Stars: ✭ 234 (+333.33%)
Mutual labels:  angularjs, angular-directives
api
Community discussion and documentation for the NWS API
Stars: ✭ 168 (+211.11%)
Mutual labels:  weather-data, weather-forecast
AngularJS-ES6
No description or website provided.
Stars: ✭ 25 (-53.7%)
Mutual labels:  angularjs, angular1
Angular Fx
Angular CSS3 animation directives (ngfx-bounce, ngfx-shake, ngfx-flip, ngfx-pulse and more ...) https://720kb.github.io/angular-fx
Stars: ✭ 181 (+235.19%)
Mutual labels:  angularjs, angular-directives
Angular Query Builder
Dynamic query building UI written in Angular.
Stars: ✭ 211 (+290.74%)
Mutual labels:  angularjs, angular-directives
OpenWeatherMap-Android-Library
A wrapper for the openweathermap REST API
Stars: ✭ 100 (+85.19%)
Mutual labels:  openweathermap-api, openweathermap
Angular Prest
pREST component for Angular
Stars: ✭ 16 (-70.37%)
Mutual labels:  angularjs, angular-directives
aurelia-typescript-boilerplate
A starter kit for building a standard navigation-style app with Aurelia, typescript and webpack by @w3tecch
Stars: ✭ 18 (-66.67%)
Mutual labels:  jasmine-tests, karma-tests
angular-downloader
Angular Downloader is an angularjs directive that enables you to manage browser download - https://720kb.github.io/angular-downloader
Stars: ✭ 16 (-70.37%)
Mutual labels:  angularjs, angular-directives
ng-contenteditable
ng-contenteditable
Stars: ✭ 41 (-24.07%)
Mutual labels:  angularjs, angular-directives
Ng6 Starter
🆖 An AngularJS Starter repo for AngularJS + ES6 + Webpack
Stars: ✭ 1,933 (+3479.63%)
Mutual labels:  angularjs, angular1
Angular Promise Buttons
Chilled loading buttons for AngularJS
Stars: ✭ 156 (+188.89%)
Mutual labels:  angularjs, angular-directives
Semanticui Angular
Angular Directives for Semantic UI
Stars: ✭ 58 (+7.41%)
Mutual labels:  angularjs, angular-directives
acuparse
Captures, stores, and displays data from an AcuRite ‎Iris/Atlas weather station and towers via an Access/smartHUB. Uploads data to Weather Underground, CWOP, Weathercloud, PWS Weather, Windy, Windguru, and OpenWeatherMap. *** MIRROR REPO | See: https://gitlab.com/acuparse/acuparse ***
Stars: ✭ 57 (+5.56%)
Mutual labels:  openweathermap, weather-data
owmr
An R Interface to OpenWeatherMap
Stars: ✭ 24 (-55.56%)
Mutual labels:  openweathermap, weather-data
Angular Tooltips
Angularjs tooltips module, add tooltips to your elements - https://720kb.github.io/angular-tooltips
Stars: ✭ 357 (+561.11%)
Mutual labels:  angularjs, angular-directives
Angular Datepicker
Angularjs datepicker module, generate a datepicker on your input element - https://720kb.github.io/angular-datepicker
Stars: ✭ 486 (+800%)
Mutual labels:  angularjs, angular-directives
SciFi Conky HUD
SciFi theme for Conky
Stars: ✭ 33 (-38.89%)
Mutual labels:  openweathermap-api, openweathermap

Note: February 2018 housekeeping -> v 0.2.0 updates angular and fixes testing issues

Updated bundled angularjs lib from angular-1.2.0-rc.2 to angular-1.2.32 (latest of the 1.2 release series) + updated and fixed dependencies on karma and jasmine modules so that tests would run and pass again.


angular-openweather-app — a weather forecast app written in AngularJS

Build Status

OpenWeather App

"OpenWeather App" is a small AngularJS project that makes use of the OpenWeatherMap service for fetching and displaying weather data and forecasts based on a given location (city).

This project basically serves as an example app I refer to within an article about AngularJS I wrote for the German web technology magazine t3n no. 34.

Demo

A demo site running this little app can be found here.

Why?

Points of interests:

  • Building an app with AngularJS (of course!)
  • Building an app based on the OpenWeatherMap API
  • Bootstrapping an AngularJS app: Basic modules and view definition, ng-app, ng-view
  • Defining a controller for handling the weather data in $scope
  • Defining a service for fetching weather data from openweathermap.com via JSONP
  • Defining a custom directive for instantly embedding sort of "weather data day panel"
  • Setting up unit and e2e-tests with karma/jasmine

angular-openweather-app uses:

Installation

Clone repository and install dependencies

via git and npm:

$ git clone [email protected]:atufkas/angular-openweather-app.git [my-app-name]
$ cd [my-app-name]
$ npm install

Run application via server

(see also angular-seed docs)

You can pick one of these options:

  1. serve this repository with a webserver of-your-choice
  2. having installed node.js, you can run a script starting a simple web server:
$ ./scripts/web-server.js

Then navigate your browser to http://localhost:<port>/app/index.html to see the app running in your browser.

Run tests

To run unit and end-2-end tests with karma/jasmine, call these scripts:

$ ./scripts/test.sh
$ ./scripts/e2e-test.sh

Contribute!

Ideas, suggestions and pull requests are welcome. Someone willing to suggest a fancy (responsive) design for desktop and mobile use?

Todo

  • Make use (and parse) more provided weather data (+ add filters, formatting)
  • Internationalization / Localization
  • Provide "use current location" and fetch data via lat/lon
  • Build a view with n-day-forecast in typical weather app style
  • Improve UI/UX by integrating a fancy design, transitions, effects

License

The MIT License

All data provided by the great service and API of OpenWeatherMap.

Copyright (c) 2013 Matthias Lienau <[email protected]>

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].