vue2 google sheet api串接練習

需至.env將以下三個換成你自己的

VUE_APP_GOOGLE_SHEET_URL = '' //google sheet分享的網址
VUE_APP_GOOGLE_SHEET_ID = '' //google sheet網址上的ID
//請參考 https://docs.google.com/spreadsheets/d/SHEET_ID/edit#gid=0
VUE_APP_GOOGLE_WEB_APP_ID = '' //google sheet的apps script部屬後得到的id

讀取資料

• 把google sheet當小型資料庫使用2 串接資料篇
• Google Sheets API : google-spreadsheet Package

npm i google-spreadsheet --save

• VueSheet
• 【我可以你也可以的Node.js】第二三篇 - 蛤！原來串接 Google Sheet API 那麼簡單?

新增資料

• 把google sheet當小型資料庫使用

use plugins

• tailwindcss
• vue-cli
• vue-sweetalert2

備註

1. 沒有做RWD
2. 每隔60秒會自動更新

Live Demo

vue2-google-sheet-api-demo

Project setup

npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build