/weather-app

Learning project: Create 'Weather' app

Primary LanguageJavaScript


Logo

Weather app

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

About The Project

screenshot

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

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.

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

(back to top)