Skip to content

Hahlina/weather-app

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

8 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Weather App Project

This is my "Weather App" project, designed to retrieve current weather information for various locations worldwide. It allows users to quickly and easily obtain up-to-date data on temperature, humidity, wind speed, and other weather conditions.

Technologies and Libraries

In this project, I utilized the following technologies and libraries:

  • HTML: Used to create the basic structure of the web page.
  • SCSS: Used for styling and formatting the web page to provide a user-friendly and visually appealing interface.
  • Vite: A fast and easy-to-use build and development tool for web applications. It provides quick page reloading during development and optimizes performance for the final deployment.
  • Page.js Library: Utilized for client-side routing and navigation within the Weather App, enabling smooth transitions between different sections or pages of the application.
  • JavaScript: Implemented the functionality of the Weather App, including interaction with the weather API and data processing.
  • OpenWeatherMap API: Integrated to retrieve real-time weather data. To use it, you need to obtain an API key from the OpenWeatherMap website and include it in the project.
  • Moment.js Library: Utilized for working with dates and times, particularly for date formatting.
  • Swiper Library: Incorporated for creating a weather forecast carousel and displaying different slides with information.
  • Firebase: Implemented for user authentication using email and Google accounts, as well as for storing users' favorite cities in the database.
  • SweetAlert2 Library: Utilized for creating modal windows with warnings, success messages, or error alerts, adding interactivity to the project.

Instructions

  • Clone the repository or download it as a ZIP archive.
  • Obtain an API key from the OpenWeatherMap website and save it.
  • In the script.js file, find the apiKey variable and replace its value with your obtained API key.
  • Register on Firebase and set up authentication for email and Google.
  • Open the index.html file in a web browser.

Further Enhancements

In the future, you can expand the functionality of the "Weather App" project by adding the following features:

  • Search functionality for specific locations or cities.
  • Additional weather parameters such as UV index, precipitation levels, etc.
  • Visualization of weather data using charts or diagrams.

Releases

No releases published

Packages

No packages published