The goal of this project was to create an application which fetches weather data of searched cities or based on data from browser geolocalization. Main features:
- search for weather data from desired city or web browser geolocation
- Fahrenheit to Celsius unit conversion
- display current weather (wind speed, precipitation, weather description)
- display weather forecast
Pixel Weather App is inspired by 90's Windows style. Vintage-looking background and pixelated icons are giving the project a retro vibe. Weather icons from Adobe Stock were recolored using Adobe Illustrator.
Pixel Weather App utilises OpenWeather API to provide real time data about weather in searched places. Frontend layer was built using Javascript ES6 and Bootstrap - a full list of technology and tools used to create this project from design to implementation can be found below.
- JavaScript ES6
- Bootstrap 4.5.3
- Prettier 2.2.1
- OpenWeather API
- Font Awesome
- GitHub
- Netlify
- InVision
- Adobe XD
- Adobe Illustrator
Clone the repository:
$ git clone https://github.com/Stajgar/pixel-weather-app.git
Enter the project directory:
cd pixel-weather-app
Open index.html
in your favorite web browser.
Type in the search bar your desired city and click the magnifier button. Then you’ll find out what the weather is there today.
Click the geolocation button to check what the weather is in your current area.
You can also change the current temperature displayed in Celsius to Fahrenheits.
This application was created as part of SheCodes workshops which are a great way to start learning frontend development.