nadatelwazane / weather-app

Weather app using HTML/CSS, JavaScript, PHP, Bootstrap and SQL

Weather App

This is a simple weather app that allows you to check current weather for your current location or any other city.

Table of contents

• Description
• Technologies
• API's used
• Setup
• Unit Testing
• Demo Pictures
• Demo Video

Description

This project is a simple weather app that allows you to check current weather for your current location or any other city. It was created to practice using software engineering principles and to learn how to use API's.

It includes a database for storing user information and a login system.

The database contains two tables: users and cities. The users table stores user information and the favourite locations of each user.

A light and dark mode is available according to the selected location's sunrise and sunset times.

Technologies

Project is created with: HTML/CSS Bootstrap JavaScript PHP XAMPP MySQL

API's used

• Open Meteo - used to get weather data as well as search for cities
• IP info - used to get user's current location
• Big Data Cloud - used for reverse geocoding to get city and country names from latitude and longitude
• Geonames - used to get timezone information from latitude and longitude

Setup

To run this project:

• Install XAMPP
• Clone this repository into the htdocs folder in XAMPP
• Start Apache and MySQL in XAMPP
• Create a database called weatherforecast in phpMyAdmin
• Use the DDL.sql file to create the tables
• Use the DML.sql file to insert some data into the tables

The database should now be set up and you should be able to run the project.

Unit Testing

To run the unit tests:

• Install PHPUnit
• Navigate to the tests folder in the project
• Create a database called test using the DDL.sql file
• Run the following command:

php vendor/bin/phpunit tests --display-warnings

Demo Pictures

Night Mode

Day Mode

Additional screenshots can be found in the demo/screenshots folder.

Demo Video

Contributors

• Hager Ahmed
• Mariem Mostafa