Weather app

Weather application used to show forecast from OpenWeather API.
View Demo

About The Project

Learning project from The Odin Project curriculum.

Features

• Get current and weekly forecast.
• Search cities worldwide.
• Switch between imperial and metric systems.
• Responsive design.

Built With

Technologies

• JavaScript
• CSS
• HTML

Third party code

• date-fns
• Google Fonts
• Font Awesome

Tools

• Visual Studio Code
• Linux terminal
• Git and GitHub
• Webpack
• ESLint + Airbnb JavaScript Style Guide
• Prettier

(back to top)

Getting Started

These instructions will get you a copy of the project up and running on your local machine for development and testing purposes.

Prerequisites

You will need Node.js and npm installed globally on your machine.

• Downloading and installing Node.js and npm

Installation

1. Get a free API key at https://openweathermap.com
2. Clone the repo

   git clone https://github.com/Artis-Dev/weather-app.git

3. Install NPM packages

   npm install

4. Enter your API key in ./src/api.js

   const API_KEY = 'YOUR API KEY';

5. Build an app

   npm run build

(back to top)

Usage

• Open ./dist/index.html file with browser.

(back to top)

Outcome

• Used revealing module pattern for better code organizing.
• Used public API to get data.
• Used Webpack to build the app.
• Used third-party library for date and time formating.
• Used CSS3 grid and flex to create layout.
• Used HTML5 semantic elements for better readability and structure.
• Used Git and GitHub for project management.
• Learned error handling a bit.
• Tried to maintain clean code.
• Cross tested on Firefox and Chromium based browsers.

(back to top)

Authors

ArtisDev - LinkedIn - artguk@protonmail.com

(back to top)

Acknowledgments

• The Odin Project
• CSS-Tricks
• DuckDuckGo

(back to top)