{"id":25871702,"url":"https://github.com/abdullah1tani/weatherproject","last_synced_at":"2026-04-11T07:04:26.714Z","repository":{"id":280176242,"uuid":"926873858","full_name":"Abdullah1tani/WeatherProject","owner":"Abdullah1tani","description":"The Weather Tracker program is designed to provide accurate and up-to-date weather information.  With its seamless integration of real-time data from trusted weather sources, the application offers a reliable and precise weather-tracking experience.","archived":false,"fork":false,"pushed_at":"2025-03-01T18:29:32.000Z","size":1464,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-01T19:30:22.863Z","etag":null,"topics":["api","bootstrap","ejs","express","nodejs"],"latest_commit_sha":null,"homepage":"https://weather-tracker-m4r9.onrender.com/","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Abdullah1tani.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2025-02-04T02:12:20.000Z","updated_at":"2025-03-01T18:31:46.000Z","dependencies_parsed_at":"2025-03-01T19:30:56.442Z","dependency_job_id":"3f1f6fb4-9e57-4f17-8dbe-8b2ffa96fcd8","html_url":"https://github.com/Abdullah1tani/WeatherProject","commit_stats":null,"previous_names":["abdullah1tani/weatherproject"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Abdullah1tani%2FWeatherProject","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Abdullah1tani%2FWeatherProject/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Abdullah1tani%2FWeatherProject/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Abdullah1tani%2FWeatherProject/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Abdullah1tani","download_url":"https://codeload.github.com/Abdullah1tani/WeatherProject/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":241472178,"owners_count":19968343,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["api","bootstrap","ejs","express","nodejs"],"created_at":"2025-03-02T07:23:18.357Z","updated_at":"2025-11-28T07:05:40.153Z","avatar_url":"https://github.com/Abdullah1tani.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Weather Tracker 🌦️\n\nThe Weather Tracker program is designed to provide accurate and up-to-date weather information.\n\nWith its seamless integration of real-time data from trusted weather sources, the application offers a reliable and precise weather-tracking experience.\n\u003cbr\u003e\n\n**You can test the app yourself by clicking on this [link](https://weather-tracker-m4r9.onrender.com/)!**\n\n## Summary\n\n1 - [Introduction](#1-introduction)\n\n- What Is Weather Tracker?\n- [Goals](#goals)\n\n2 - [Tools](#2-tools)\n\n- [Geocode API](#geocode-api)\n- [Weather API](#weather-api)\n\n3 - [Development](#3-development)\n\n- [Samples](#samples)\n\n4 - [Installation Guide](#4-installation-guide)\n\n5 - [Program Structure](#5-program-structure)\n\n- [Front-end](#front-end)\n  - [Main Page](#1-main-page-indexhtml)\n  - [Result Page](#2-result-page-resultejs)\n  - [Error Page](#3-error-page-errorejs)\n- [Back-end](#back-end)\n\n6 - [Conclusion](#6-conclusion)\n\n- Challenges encountered\n  - [Front-end](#1---front-end)\n  - [Back-end](#2---back-end)\n  - [Other](#3---other)\n\n7 - [Other Projects](#7-other-projects)\n\n \u003cbr\u003e\n\n## 1. Introduction\n\nWeather Tracker shows the live weather information about a specific location chosen by the user.\nIt accesses real-time weather data directly from reputable sources, ensuring accurate and timely information.\n\u003cbr\u003e\n\n### Goals:\n\n---\n\nThe goals of creating this program are:\n\n- Familiarize with node.js and express.js\n- Gain knowledge in using APIs\n- Understand HTTP post and get requests\n- Improve writing skills in Markdown syntax\n  \u003cbr\u003e\n\n## 2. Tools:\n\nThis program uses the current APIs, libraries, and frameworks:\n\n- [Bootstrap](https://getbootstrap.com/)\n- [Geocode API](#geocode-api)\n- [OpenWeather API](#weather-api)\n- [Axios](https://axios-http.com/)\n- [Path](https://nodejs.org/api/path.html)\n- [Node.js](https://nodejs.org/en)\n- [Express.js](https://expressjs.com/)\n  \u003cbr\u003e\n\n### Geocode API\n\n---\n\n[LocationIQ](https://locationiq.com/) API is a Geocode API that is used to retrieve the coordinates (longitude and latitude) of the location entered by the user.\n\u003cbr\u003e\n\n### Weather API\n\n---\n\n[OpenWeather](https://openweathermap.org/api) API is used to retrieve weather data from specific coordinates (longitude and latitude).\n\n**We are only interested in displaying the current data:**\n\n- Name of location\n- Weather description\n- Coordinates (longitude and latitude)\n- Temperature\n- Feels like temperature\n- Lowest temperature\n- Highest temperature\n- Pressure\n- Humidity\n- Wind speed\n  \u003cbr\u003e\n\n## 3. Development\n\nThe program retrieves coordinates (longitude and latitude) of the location entered by the user using the [Geocode API](#geocode-api), then it uses the coordinates and the [weather API](#weather-api) in order to find the live weather information about the location.\n\n### Samples:\n\n---\n\n**samples used to test the program:**\n\\# | Street | City | State | Postal Code | Country |\n:---:|:---: |:---: |:---: |:---: |:---: |\n1 | 555 5th Ave | New York | NY | 10017 | US |\n2 | statue of liberty | - | - | - | - |\n3 | Avenue Anatole France | Paris | Ile-de-France| 75007 | France |\n4 | eiffel tower | - | - | - | - |\n5 | Piazza del Duomo | Pisa | provincia di Pisa | 56126 | Italy |\n6 | Leaning Tower of Pisa | - | - | - | - |\n7 | 5200 Robinson St | Niagara Falls | Ontario | L2G 2A2 | Canada |\n8 | Niagara Falls | - | - | - | - |\n9 | Bridge St | London | - | SW1A 2PW | United Kingdom |\n10 | - | London | - | - | - |\n\u003cbr\u003e\n\n## 4. Installation Guide\n\nTo run Weather Tracker on your system, the following steps must be done in order:\n\n1. Install [Node.js](https://nodejs.org/en)\n2. Clone the repository using this link: https://github.com/Abdullah1tani/WeatherProject.git\n3. Run `npm install` to install all the required node modules\n4. Run `node app.js` in terminal to start the application\n5. Go to [localhost at port 3000](http://localhost:3000/) in your web browser\n\n## 5. Program Structure\n\nThe program is composed of 2 structures:\n\n- [Front-end](#front-end)\n- [Back-end](#back-end)\n  \u003cbr\u003e\n\n### Front-end:\n\n---\n\nFront-end was built using [Login Modal template](https://mdbootstrap.com/docs/standard/extended/login/), HTML and CSS, it is composed of 3 pages:\n\n#### **1. Main Page:** `index.html`\n\nThe first page that the user sees when he starts the program. This will be the page where he will enter the information about the desired location that he wishes to receive information about its weather.\n\u003cbr\u003e\n\n\u003cimg width=\"492\" alt=\"main page\" src=\"./media/main-page.png\"\u003e\n\n#### **2. Result Page:** `result.ejs`\n\nAfter the user clicks \"Search\" on the [main page](#1-main-page), the information about the weather for the specified location by the user will show up.\n\u003cbr\u003e\n\n\u003cimg width=\"636\" alt=\"result page\" src=\"./media/result-page.png\"\u003e\n\n#### **3. Error Page:** `error.ejs`\n\nIf the location that the user entered in the [main page](#1-main-page) does not exist, this page will show up instead of [result page](#2-result-page) with the current error `TypeError: Cannot read properties of undefined (reading 'lat')`.\n\u003cbr\u003e\n\n\u003cimg width=\"627\" alt=\"error page\" src=\"./media/error-page.png\"\u003e\n\u003cbr\u003e\n\n### Back-end:\n\n---\n\nBack-end was built with the following tools:\n\n- [Axios](https://axios-http.com/)\n- [Path](https://nodejs.org/api/path.html)\n- [Node.js](https://nodejs.org/en)\n- [Express.js](https://expressjs.com/)\n\n## 6. Conclusion:\n\nBuilding the Weather Tracker was an enjoyable and challenging experience.\nThe challenges that I encountered are as follows:\n\n#### 1 - Front-end\n\n- Displaying the information on the user's end\n- Changing the CSS of the elements in the [Login Modal template](https://mdbootstrap.com/docs/standard/extended/login/)\n\n#### 2 - Back-end\n\n- Finding the right API for the [Geocode API](#geocode-api)\n- Posting requests to the [Geocode API](#geocode-api)\n\n#### 3 - Other\n\n- Writing a well-structured documentation\n\n## 7. Other Projects:\n\nIf you made it till here, thank you for reading\n\nCheck out my other projects:\n\n- [Cat animation](https://github.com/Abdullah1tani/cat-animation)\n- [Card animation](https://github.com/Abdullah1tani/card-animation)\n- [School Donations](https://github.com/Abdullah1tani/School-donations)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fabdullah1tani%2Fweatherproject","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fabdullah1tani%2Fweatherproject","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fabdullah1tani%2Fweatherproject/lists"}