"Currently we are not accepting any more applications for any job post"

Login Logout

AngularJs

https://angularjs.softsolutions4u.com
Local News and weather report Dashboard
Developed in Angluar JS
Visit website
View All Projects

How it started

After dabbling with several AngularJS projects which were bound by NDA, we decided to showcase our expertise by developing a Local Weather and News dashboard  in AngularJS. Regarding the look and feel, we decided not to reinvent the wheel and look for design inspiration from News and weather report templates . Not having access to expensive weather report APIs, we decided to lean heavily on Free APIs. Of course Google APIs was extremely helpful in terms of getting the weather report. For News Reports, we decided to go ahead with News API. We zeroed in on few features like getting the Geo location of the visitor and display basic information of the visitor’s geographic location, example  Temperature, Area, Location etc using Google API.
  • News Portal developed in AngularJS
Got a similar project in mind?
Get started with our project planner

News and Weather Dashboard in Angular JS

Core features:

While we made few features like :
    • Google Map, Weather report,
    • Local time and temperature,  Geographical location dynamic i.e. information was displayed based on the visitor’s geographical location.
    • Display news using third party API.

Design Layout:

We built the product on plain HTML, no frameworks or modular tricks, so all the CSS/JavaScript would be in a single file and keep the code light

Cookies:

We used cookies to save the latitude and longitude, This technique was used to avoid current co-ordinates for each page load.

Technical Hacks for getting Local News:

We implemented PHP script to get the news from the API ( https://newsapi.org/). Once the details were fetched from the new API, we stored the data in the session. The session expiration time was set to 500 seconds.
    1. We used the SESSION concept to save the news. Each News Headline was stored in the SESSION and displayed at the endpoint.
    2. The ‘Detail page’ of the each News headline was taken from the SESSION.
    3. Therefore  to show the news details page, no extra requests were sent  to the API. The contents were directly fetched from the session. This decreased loading time and made page access way faster.
    4. In order to Refresh the News Headlines and get the latest status, The SESSION  was cleared every 15 mins.
    5. Google API was used to get the current location image which is provided by the Google maps.

Weather Report:

For getting weather report based on the user’s current location, we used Weather API( https://api.openweathermap.org ) to get the weather related information’s. A request was sent to the weather API to get instant weather reports.

Images based on Geo-Location:

To provide a more localised report, to the current web visitor, we decided to display images pertaining to the User’s current Geo-location. The Google API came in handy for displaying the images of the  current Geo-Location.
Got a similar project in mind?
Get started with our project planner

Related Projects

Payrexx- Payment Service Integrator

Payrexx- Payment Service Integrator

An e-commerce tool which allows you to create a payment form that you can embed, email or spread through social networking sites.