weather-forecast

20

4

Wayne Gakuo

Added on December 21, 2024

A simple Weather Forecast app built using Angular, Tailwind CSS, OpenWeather API & HERE Geocoding API.

weather-forecast

A simple Weather Forecast app built using Angular, Tailwind CSS, OpenWeather API & HERE Geocoding API.

Wayne Gakuo

README.md

Weather Forecast

Weather Forecast

This project was generated with Angular CLI version 11.1.0.

The Weather Forecast App uses the OpenWeather API to provide a city's current weather forecast & a 7-Day weather forecast. The app also uses Here API to provide geo-coordinates of a known address, place, locality or administrative area, even if the query is incomplete or partly incorrect.

It is very important to have an OpenWeather & HERE Geocoding AP Keys

API Keys

Inside the api.interceptor.ts in the Interceptors folder (src > app > interceptors), replace the YOUR_GEOCODE_API_KEY & YOUR_OPENWEATHER_API_KEY sections with their respective API keys which you would have generated.

API Keys Screenshot

Progressive Web App (PWA)

This web app is PWA-enabled; you can install it on your phone if you wish to do so. Read more about PWA at PWAFire

Development server

Run ng serve for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.

Code scaffolding

Run ng generate component component-name to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module.

Build

Run ng build to build the project. The build artifacts will be stored in the dist/ directory. Use the --prod flag for a production build.

Running unit tests

Run ng test to execute the unit tests via Karma.

Running end-to-end tests

Run ng e2e to execute the end-to-end tests via Protractor.

Further help

To get more help on the Angular CLI use ng help or go check out the Angular CLI Overview and Command Reference page.

Related Content

ng-mocks

An Angular testing library for creating mock services, components, directives, pipes and modules in unit tests. It provides shallow rendering, precise stubs to fake child dependencies. ng-mocks works with Angular 5 6 7 8 9 10 11 12 13 14 15 16, jasmine and jest.
GitHubUpdated today

Angular Authentication

An Angular application that demonstrates best practices for user authentication.
GitHubUpdated 5 days ago

Angular Scrollbar

Custom overlay-scrollbars with native scrolling mechanism, it also provides a cross-browser smooth scroll directives.
GitHubUpdated 27 days ago

generator-ngx-rocket

ngx-rocket
Extensible Angular 12+ enterprise-grade project generator based on angular-cli with best practices from the community. Includes PWA, Cordova & Electron support, coding guides and more!
GitHubUpdated 18 months ago

Angular, NgRx & Angular Material Starter

Angular, NgRx and Angular Components (previously known as Material) Starter projects which shows you how to implement application with routing, custom themes, translations, state management and more
GitHubUpdated 27 months ago

We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.