vWeather_Vue

vWeather | Vue3

Project setup

yarn install

Compiles and hot-reloads for development

yarn serve

Compiles and minifies for production

yarn build

Lints and fixes files

yarn lint

Customize configuration

See Configuration Reference.

Todo List:

Part1

[] Setup up the project
-[x] npm init vite-app mWeather_Vue (Skip as I use codesandbox)
-[x] google font https://fonts.google.com/specimen/Roboto
-[x] baisc css [x]element ui npm i element-plus (Choose/search via codesandbox dependencies system ) [x] page structure
[X] API test axios to fetch data [X] header component [x] Add the logo npm i @element-plus/icons [x] Create top titlte/subtitle [X] search area [x] Create input [x] Create datepicker [x] Create info tooltip [x] Loading Skeleton [x] Test the api axios

Part2

[x] Create chart [x] Add echart lib to the project npm i echarts vue-echarts (Choose/search via codesandbox dependencies system ) [x] Create singleDayLineChart [x] Create MutipleDateStatckLineChart

Part3

[x] Light/Dark Theme
-[x] Override element item to support dark theme

Part4

[x] i18? en/cn i18@next for vue3 is v9, need manually select the verison from codesandbox
-[x] element ui default i18n
-[x] update page items one by one to support i18N
[] Deploy to netlify