Skip to content

nofuenterr/weather-now

Repository files navigation

Weather Now

A responsive weather app with city search, unit toggling, and 7-day + hourly forecasts.

Preview

Live Demo: weather-now-rrn.vercel.app


Overview

Weather Now is a feature-rich weather application powered by the Open-Meteo API. Search any city to get current conditions, a 7-day forecast, and an hourly breakdown. Toggle between Imperial and Metric units, and switch specific measurements for temperature, wind speed, and precipitation independently.


Features

  • Search weather by city name
  • Current conditions — temperature, feels like, humidity, wind speed, precipitation
  • 7-day forecast with daily high/low temperatures and weather icons
  • Hourly forecast with day selector
  • Toggle between Imperial and Metric unit systems
  • Independent unit controls for temperature (°C / °F), wind speed (km/h / mph), and precipitation (mm)
  • Responsive layout across mobile, tablet, and desktop
  • Hover and focus states for all interactive elements

Tech Stack

Category Technology
Framework React + Vite
Language TypeScript
Styling Tailwind CSS
UI Components Radix UI
State Management Zustand
Date Formatting date-fns
Weather Data Open-Meteo API

Getting Started

Prerequisites

  • Node.js v18+

Installation

git clone https://github.com/nofuenterr/weather-now.git
cd weather-now
npm install

Running the App

npm run preview

Build

npm run build

Screenshots

Desktop Tablet Mobile
Desktop Tablet Mobile

To-do

  • Geolocation detection on first visit
  • Favorites / saved locations
  • Compare locations side-by-side
  • UV index, visibility, and air pressure data
  • Sunrise/sunset times with indicators
  • Animated weather backgrounds based on conditions
  • Voice search
  • Dark/light mode that adapts to time of day
  • Progressive Web App (PWA) support

Completed

  • City search
  • Current weather conditions
  • Additional metrics (feels like, humidity, wind, precipitation)
  • 7-day forecast
  • Hourly forecast with day selector
  • Imperial / Metric toggle
  • Independent unit controls
  • Responsive layout
  • Hover and focus states

Credits

This project is for personal/portfolio use.

  • Weather data provided by Open-Meteo (free, open-source API)

Developed by RR Nofuente

About

A responsive weather app with city search, 7-day and hourly forecasts, and Imperial/Metric unit toggling — powered by the Open-Meteo API.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors