本部落格 貓叔的部落格，轉載請申明出
閱讀本文約“3分鐘” 適讀人群：Java後端、Java初級、小程式前端
本文是兩個GitHub專案的序章，旨在指導初級程式設計師完成一個企業級共享專案的前後端程式碼實踐，豐富自身的實戰經驗與知識。
專案介紹，這個一個企業級的共享圖書專案，涉及部分Iot實踐環節，整個專案主要以SpringBoot為後臺提供API，前端小程式呼叫介面，同時專案會涉及共享書櫃硬體的通訊環節，其中涉及netty知識，整個專案大致的技術棧應該會有小程式原始碼MVC開發模式、ES6基 礎能力提升、共享書櫃二維碼生成、圖書管理系統、圖書業務知識、netty構建簡易Iot通訊，SpringBoot實現基本的業務功能。
業務具體介紹，本系統是一個共享圖書的小程式專案，企業級，創業專案。類似共享自行車，投放自行車，本專案投放圖書書櫃（小型快遞櫃），書櫃內部有24本圖書，每個書櫃會有定位，可以在小程式搜到距離你最近的書櫃，並且每個書櫃會有專屬的二維碼，因為每個書櫃存放的圖書不一樣，你可以在A書櫃掃碼借書，之後在B書櫃還書，前提是B書櫃有空餘格子。具體業務流程類似共享自行車，也有設計押金、月卡、季卡等等。
先看看專案的效果吧，暫時給前端小程式，因為從零帶著敲，所以原本的後端是SSM的，我將重新改為SpringBoot，後端的管理平臺就暫時沒有給gif了。
前後端專案的地址
前端知識盤點
因為我前端的基礎不行，所以說得不好的，還請各位碼字留情。
前端的目錄是比較簡單的，各位後端的同學也可以簡單學習，畢竟到時會給原始碼，所以大家可以調式試試。imgs是主要小程式的靜態資源，即圖片什麼的，因為小程式自身本來就有限制，所以如果載入大量的圖片就直接用url去載入，小業務的話，可以和業務伺服器一起，如果資料量大，就自己做一個ftp的檔案伺服器或者使用阿里的檔案儲存oss，其他平臺的也有很多，這裡就不一一介紹了。
以上是單個頁面的實現基本檔案目錄。整個前端沒有使用什麼便捷的框架生成，而是原生以MVC的思路去敲，這也是我推薦的，具體理由，...一下省略一萬字。
我也是採用後端的MVC模式，xsml是頁面骨架，wxss就是H5的css，就是我們的炫酷外表，而內容展示什麼，是由js而定，wxml會資料繫結js裡面的欄位，而js會呼叫*-model.js裡面的方法，*-model.js就是請求我們的後臺伺服器的具體業務呼叫端。
雖然大家看到小程式前端都寫好了，不過秉承教學目的，所以還是要分步驟，加註釋，一步一步的上傳GitHub。
後端知識盤點
後端本身是SSM的框架，不過比較久遠，大家可能除錯不便，所以就整改為SpringBoot版本，還有資料庫設計，這一塊我也暫時還沒整理出一個結構圖，下一篇預計會出，或者下下篇。（本系列因為秉承開源，免費的原則，所以更新時間可能會有波動，個人能力有限，還請見諒。）
後端會使用到freemarker框架來生成後端管理頁面，主要是管理圖書庫存，還有二維碼生成子系統是針對書櫃設計的，不同書櫃會有對應的圖書。而系統會以原生netty對接微控制器。（因為硬體不屬於軟體部分，而且微控制器一塊的基本上有經驗的都可以做到，所以到時會用普通的程式碼模擬）
後端會出兩套API，一套是針對小程式的，一套是後臺管理系統的。其中還涉及微信支付環節。
具體大家可以關注一下。
公眾號：Java貓說
學習交流群：728698035
現架構設計（碼農）兼創業技術顧問，不羈平庸，熱愛開源，雜談程式人生與不定期乾貨。