Weather React

Weather React is a clean, lightweight weather application built with React and Vite. It provides current and forecast weather data by integrating with the fast and free-to-use Open-Meteo API.

This project was created as a portfolio piece to demonstrate a strong command of React fundamentals, asynchronous API integration, and modern frontend development workflows.

---

Features

• Live Weather Data: Up-to-the-minute weather conditions from the Open-Meteo API.
• Dynamic City Search: Search for any of the top 500 global cities from an included JSON dataset.
• Persistent Selection: Your last-searched city is saved to localStorage for convenience.
• Responsive UI: A clean, mobile-first design built with Tailwind CSS.
• Modern React Architecture: Built entirely with functional components and hooks (useState, useEffect, useMemo).
• Fast Development Experience: Powered by Vite for near-instant server startup and hot module replacement.

---

Tech Stack

• Frontend: React (v19), JavaScript (ES6+)
• Build Tool: Vite
• Styling: Tailwind CSS
• Components: react-select for the searchable city dropdown.
• Data Fetching: Open-Meteo API client

---

Learning Goals

This project was built to practice and demonstrate:

• React Fundamentals: Components, props, state, and component lifecycle with hooks.
• State Management: The "Lifting State Up" pattern to manage shared state between components.
• External API Integration: Handling asynchronous fetch requests, loading states, and error handling.
• Modern Project Structure: A clean and maintainable project setup using Vite.

---

Getting Started

Follow these instructions to get a copy of the project up and running on your local machine.

Prerequisites

You need to have Node.js (version 18.x or newer) and npm installed on your computer.

Installation

1. Clone the repository:

   git clone [https://github.com/alexanderpetricca/weather-react](https://github.com/alexanderpetricca/weather-react)

2. Navigate to the project directory:

   cd weather-react

3. Install dependencies:

   npm install

4. Start the Vite development server:

   npm run dev

The application should now be running on http://localhost:5173 (or the next available port).