Project information

Weather Forecast Website

The Weather Forecast website's functionality is to show the weather forecast for any area in Cyprus. The website implemented the framework of the course Internet Techonolgoies using HTML, CSS, JavaScript and PHP.

Front-end Functionality

The user inserts values into the 3 textboxes and presses search. With the help of JavaScript the website takes the values inserted and calls the OpenStreetMap API asynchronously. The API returns the coordinates in the form of a JSON response. If the response is OK, then the program gets its coordinates. With these coordinates the program similarly calls the openweathermap API with the coordinates and it returns a JSON response that contains the weather for that specific region. The website then displays a section with all the information retrieved along with a heat map of the location that the user can interact with. This section has a second tab as well, that shows some basic weather information about the weather for the next 24 hours for that location. If the user wishes to see more information they can press the view button where a modal pop up appears with more information for the specific hour the user selected.

Back-end Functionality

Another functionality that the website had was the following: every time a request was sent, then it was stored in the database under my university username. This was implemented with JavaScript and PHP. I had implemented a GET and a POST method, so every time a user pressed the search button and a request was sent, then after it retrieved and displayed all the data I was storing the address, region, city, degree in the database. If the user wanted to see previous requests they made they could press the yellow button and the last 5 requests would be shown that were done successfully. If the user pressed on one of the requests showed in the list, then the request would repeat itself and the results of that request would be shown. This functionality is no longer available due to the fact that I no longer have an account to my university and so I do not have access to the database, so the GET and POST method cannot be run successfully

Sample Inputs

Example data to use the website are as follows: Address:"Eressou", Region:"Strovolos", City:"Nicosia" or Address:"Panepistimiou", Region:"Aglantzia", City:"Nicosia"