https://github.com/ben-miles/weather

A simple weather app made with VueJS
https://github.com/ben-miles/weather

openweathermap openweathermap-api vite vue vue3 vuejs weather weather-apis weather-app

Last synced: 2 months ago
JSON representation

A simple weather app made with VueJS

• Host: GitHub
• URL: https://github.com/ben-miles/weather
• Owner: ben-miles
• Created: 2020-07-03T15:10:51.000Z (almost 5 years ago)
• Default Branch: master
• Last Pushed: 2023-06-14T15:04:15.000Z (almost 2 years ago)
• Last Synced: 2025-02-08T01:45:38.689Z (4 months ago)
• Topics: openweathermap, openweathermap-api, vite, vue, vue3, vuejs, weather, weather-apis, weather-app
• Language: Vue
• Homepage: https://ben-miles.github.io/weather/
• Size: 2.23 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 5
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# weather

A simple weather app, powered by Vue 3 and OpenWeatherMap, with ultra-lightweight SVG graphics and icons.

[![Vue](https://img.shields.io/badge/Vue%203-green?style=for-the-badge&logo=vuedotjs&logoColor=white)](https://vuejs.org/)

[![Vite](https://img.shields.io/badge/Vite-B73BFE?style=for-the-badge&logo=vite&logoColor=FFD62E)](https://vitejs.dev/)

[![Github Actions](https://img.shields.io/badge/Github%20Actions-2088FF?style=for-the-badge&logo=githubactions&logoColor=white)](https://github.com/features/actions)

[![Github Pages](https://img.shields.io/badge/Github%20Pages-2088FF?style=for-the-badge&logo=githubpages&logoColor=white)](https://pages.github.com/)

## Live Demo

- You can see a live demo at [htps://ben-miles.github.io/weather/](https://ben-miles.github.io/weather/).

## Installation

1. Clone this repository and provision a web server for the project.

2. Make sure [Node.js](https://nodejs.org) and [NPM](https://www.npmjs.com) are installed.

3. To work with this app locally, you'll first need an API Key from [OpenWeatherMap](https://openweathermap.org). 

4. In the project root, create a copy of `.env-example`, rename it to `.env`, and replace the placeholder value of `VITE_OPENWEATHERMAP_KEY` with your API Key.

5. In the project's root directory, run `npm install` in the terminal.

## Development

- It's recommended to use [VSCode](https://code.visualstudio.com/) with the [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) extension.

- For a live preview of the source code, run `npm run dev`.

## Deployment

- This repo uses GitHub Actions (with [this Workflow by Vite](https://vitejs.dev/guide/static-deploy.html#github-pages)) to automatically build and deploy to GitHub Pages whenever new code is pushed to the `master` branch. 

- You can also build locally by running `npm run build`, and you can preview that build with `npm run preview`.