如何快速從零打造智能物聯網管理介面 How to build an IOT Admin Panel from Zero to Hero!

videoQuality
Tags
Property
影片進度
我們學會了如何使用 Arduino 等小型的開發板來偵測我們所需要的數據,接下來,我們要將這些數據串起來做成一個好用的管理介面,方便我們管理大量的設備與數據

使用程式打造

不同的應用場景都會有特殊且特定的需求,使用商業軟體可以快速的逼近這些需求,但在獨樹一幟的獨家賣點便會難以打造,開發成本非常昂貴。相對良好的辦法,便是掌握技術,用最簡單的工具打造最小可行性產品 ( MVP, minimum viable product ),驗證了可行性與簽訂了數家商業備忘錄後,才開始找齊產品工程師,打造更完整的產品。

介面: 網頁

開發 App 所需要的開發費用十分的高,建議使用網頁與自適應網頁設計 ( RWD, Responsive web design),來符合客戶多裝置的需求。在桌面主機是一般的傳統網頁,在手機平板上,變形成接近 App 的設計。

網頁背景知識

HTML: 網頁的架構,大多是標題文字等等。
CSS: 網頁的設計,各式元件的顏色排列來達到美觀的效果。
Javascript:網頁的程式邏輯,如何讓元件動起來,與使用者操作的邏輯。

網頁前端

我們可以先把網頁前端的介面先設計好,再把一些文字的欄位挖空透過 Javascript 填入資料庫取得到的資料即可完成我們的管理系統

Bootstrap:

Bootstrap 是一個好用美觀的網頁模版系統,可以快速的打造各式的網頁。
 
關鍵字: Boostrap Admin
一些免費的 Bootstrap 模版
 

資料儲存

資料是物聯網非常重要的基礎,使用符合需求的儲存方式才能高速的使用有正確且可靠的資料。資料庫的種類繁多,若是要處理即時串流的數據,資料庫更是複雜。以下會對於幾種較為常用的做一些介紹:
  1. MySQL: 結構化的資料庫,發展較為成熟,當數據有較多空欄位的情況下,會浪費較多的空資料傳輸,造成傳輸數據較大,好處是資料庫結構固定且完整。
  1. MongoDB: 非結構化的資料庫,在手機移動網路剛出來的情況下,為了節省傳輸數據所設計的一種資料庫,好處是指傳輸必要的資料,缺點是若沒有良好的資料庫欄位設計,可能會造成資料結構不一等問題。
  1. Firebase: Google 推出的即時資料庫,好處在可以快速的打造可互動的網路應用程式,而且資料都是即時同步,不需要刷新頁面。缺點是量大到一個程度會比自己打造還要昂貴。
  1. Meteor: Meteor 是一個同時打造前後端的一個網頁框架,使用 MongoDB 做為資料庫,可以輕鬆的讓 MongoDB 變成即時同步的資料庫,同時,有內建好的會員系統可以快速的將會員系統建好。好處是您可以自己設定 MongoDB 的伺服器位置與架構,缺點是要對於 MongoDB 有一定的瞭解比較好讓效能與價格得到良好的優化。
 

Google Spreadsheet 當作資料庫

Google Spreadsheet 在初期可以提供免費且大量輸入輸出的即時同步資料庫的需求,但當資料量大到一個程度的情況下,Google 也是會收費的,在開發前需評估資料量以及數據的使用費用
 
一些使用 Google Spreadsheet 當作資料庫的文章
 
NodeMCU + Google Sprreadsheet 英文範例
 

資料視覺化

Graphana

notion image
 
 

使用商業套裝軟體

微軟 PowerBI

什麼是 Power BI | Microsoft Power BI
optimize relationship roadmap optimize 使用方便好用的自助和企業商業智慧 (BI) 統一可調式平台,連線並將所有資料視覺化,協助您取得更深入的資料見解。 創造令人驚豔的資料體驗 輕鬆連線、建立模型及視覺化資料,以您的 KPI 和品牌建立令人難忘的個人風格報表。為商務問題取得快速的 AI 技術支援解答,即使閒聊式的語言也能詢問。 從您最大的 BI 部署取得見解 連線到所有資料來源,並在整個組織中分析、共用和推廣見解,同時保有資料的正確性、一致性和安全性,從您的巨量資料投資獲得最大收益。 放心大膽地制定決策 在相同的資料上輕鬆合作、在報表上共同作業,以及透過 Microsoft Teams 和 Excel 等熱門的 Microsoft Office 應用程式分享見解,讓組織中的每個人都能快速作出資料驅動決策,進而採取策略性的動作。 端對端資料保護 透過與組織外部共用資料,或匯出為 Excel、PowerPoint 和 PDF 等格式時仍繼續運作的持續保護,為您的 Power BI 報表、儀表板和資料集提供更好的保護。 合用更加強大 當您將 Power BI 搭配 Azure 及 Office 一起使用時,可從技術與資料中獲得最大價值。因為 Power BI 與已獲得您信任的 Microsoft 技術可相互操作,所以您可以有效率地使用所有資料。 大量資料連接器 隨著 120 個以上的免費連接器 程式庫的成長,大家都清楚如何制定資料驅動決策。直接連線到數百個內部部署及雲端資料來源,例如 Dynamics 365、Azure SQL Database、Salesforce、Excel 與 SharePoint。 觀看 Power BI 的實際運用 了解使用方便好用的自助與企業 BI 工具,在組織內外建立報表、在儀表板上共同作業以及分享見解,是多麼簡單的一件事。 探索 Power BI 在這個 Power BI 完整指南中,觀看、閱讀和探索如何將見解轉化為行動,並建立令人驚嘆的資料體驗。 開始建立 使用 Power BI Desktop 免費取得所需一切資源,建立及儲存無限制的互動式報表。 共用與共同作業 在雲端使用 Power BI,可透過 Professional 和 Premium 版本輕鬆共用報表及共同作業。 隨時隨地工作 取得 Android、iOS 和 Windows Mobile 版的免費 Power BI 行動應用程式,在任何地方檢視報表和視覺效果並共同作業。
什麼是 Power BI | Microsoft Power BI