{"id":20931590,"url":"https://github.com/johnwargo/weather-app-ionic-4","last_synced_at":"2026-04-29T01:01:59.568Z","repository":{"id":70062172,"uuid":"259492069","full_name":"johnwargo/weather-app-ionic-4","owner":"johnwargo","description":"A sample weather app built using Ionic 4","archived":false,"fork":false,"pushed_at":"2021-06-16T21:49:08.000Z","size":379,"stargazers_count":2,"open_issues_count":0,"forks_count":2,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-06-06T14:39:29.290Z","etag":null,"topics":["ionic"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/johnwargo.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-04-28T00:46:26.000Z","updated_at":"2024-10-27T16:09:04.000Z","dependencies_parsed_at":"2023-03-02T07:30:31.559Z","dependency_job_id":null,"html_url":"https://github.com/johnwargo/weather-app-ionic-4","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/johnwargo/weather-app-ionic-4","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/johnwargo%2Fweather-app-ionic-4","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/johnwargo%2Fweather-app-ionic-4/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/johnwargo%2Fweather-app-ionic-4/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/johnwargo%2Fweather-app-ionic-4/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/johnwargo","download_url":"https://codeload.github.com/johnwargo/weather-app-ionic-4/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/johnwargo%2Fweather-app-ionic-4/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32405903,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-28T19:38:08.556Z","status":"ssl_error","status_checked_at":"2026-04-28T19:37:55.688Z","response_time":56,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["ionic"],"created_at":"2024-11-18T21:44:15.051Z","updated_at":"2026-04-29T01:01:59.552Z","avatar_url":"https://github.com/johnwargo.png","language":"TypeScript","funding_links":["https://www.buymeacoffee.com/johnwargo"],"categories":[],"sub_categories":[],"readme":"# Weather App - Ionic 4\n\nby John M. Wargo\n\n## Introduction\n\nThis is an Ionic 4/Capacitor version of the [TACO Weather App](http://taco.visualstudio.com/en-us/docs/vs-taco-2017-first-app/) solution. I created the [Ionic 2/Cordova](https://github.com/microsoft/cordova-samples/tree/master/weather-app-ionic2) version of this app while I worked on the docs for [Visual Studio 2017 Tools for Apache Cordova (TACO)](https://visualstudio.microsoft.com/vs/features/cordova/). That app hasn't been updated in a while, so I thought I'd give it a refresh. This version of the app is an Ionic Capacitor app; as market interest in Apache Cordova wanes, Capacitor is a robust alternative.\n\nThe app uses the [Open Weather Map](http://openweathermap.org/) service to provide current weather conditions and a 5 day forecast; you'll need to update the project's `src/app/config.ts` file with your API key to run the app. The existing file looks like the following:\n\n```TypeScript\nexport const Config = {\n    weatherEndpoint: 'https://api.openweathermap.org/data/2.5/',\n    weatherKey: ''\n}\n```\n\nPopulate the `weatherKey` property with your Open Weather Map API Key, then save the changes to the file.\n\n## Application Operation\n\nOn start up, the application uses the Apache Cordova Geolocation plugin to determine the current location for the device running the application, then loads the weather conditions for that location. The application's main UI is split using an Ionic Segment (`ion-segment` control); the **Current** segment shows current weather conditions while the **Forecast** segment lists the 5 day forecast for the location. Tap the refresh icon in the upper-right corner of the app's UI to refresh the weather data for the current location.\n\nWhen a user enters a US Zip Code, the application will retrieve current weather conditions for the specified location.\n\n\u003e **Note:** You can easily convert the app to use city name instead of Zip code. It requires merely changing the endpoint URL for the weather service.  \n\nThe following figure shows the contents of the Current segment.\n\n![Application Home Screen](screenshots/figure-01.png)\n\nWhen providing a forecast, the Open Weather API returns an array representing forecast time periods beginning with the following day at midnight (local time). The **Forecast** segment displays an interactive list of the available forecast periods as shown in the following figure:\n\n![Application Forecast List](screenshots/figure-02.png)\n\nTap on a period to open a page containing the detailed weather forecast for the selected period as shown in the following figure.\n\n![Application Forecast Details](screenshots/figure-03.png)\n\n***\n\nYou can find information on many different topics on my [personal blog](http://www.johnwargo.com). Learn about all of my publications at [John Wargo Books](http://www.johnwargobooks.com).\n\nIf you find this code useful and feel like thanking me for providing it, please consider \u003ca href=\"https://www.buymeacoffee.com/johnwargo\" target=\"_blank\"\u003eBuying Me a Coffee\u003c/a\u003e, or making a purchase from [my Amazon Wish List](https://amzn.com/w/1WI6AAUKPT5P9).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjohnwargo%2Fweather-app-ionic-4","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjohnwargo%2Fweather-app-ionic-4","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjohnwargo%2Fweather-app-ionic-4/lists"}