Project information
- Category: Web design
- Project date: 19 April, 2021
- GitHub URL: https://github.com/loukiaioannou17/Weather_website
- Website: https://loukiaioannou17.github.io/Weather_website/
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"