Skip to content

Weather forecasting website with images and walk-through videos of searched city.

Notifications You must be signed in to change notification settings

axlothecook/CityWeather

Repository files navigation

City Weather

City Weather is a weather forecasting website using several APIs, styling libraries and React JS.

Demo video

duno

Concepts tested

  • usage of multiple APIs
  • css animations
  • css modules for styling
  • using graphs
  • page transitions
  • usage of search bars
  • animated icons

Sources used

CSS Modules
Select Component
Framer library
Chart.js
Chart.js label plug-in
Static weather icons
Date library
Some features

APIs used

Google Autocomplete API
Visual Crossing API
Google Places API
Google Youtube API

Issues not fixed

Phone scaling

The website falls short of delivering satisfactory user experience. After dozens of attempts, its dimensions are way bigger than they should be, with white areas being accessible on vertical scroll. Another downfall is some features not working in smartphone dimensions, but they did work when being tested in Google DevTools and when browser was resized to phone dimentions. Better phone size testing tool is needed.

Upcoming updates

Version 1.1 Images zoom in

Feature: When double clicking / tapping on image, it should appear above all others in bigger dimensions, with an exit button on top right.

Version 1.2 Phone App

Feature: After I learn how to make React Phone apps, this project should get its own phone app as I want to use it in daily life and provide it to my friends and family in the same way.

About

Weather forecasting website with images and walk-through videos of searched city.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published