一、環境搭建

參考教程：https://blog.csdn.net/u012888052/article/details/79623229

二、根據上方教程新建的專案，編寫對應程式

        第一次做的小程式，是一款閱讀器軟體，包括了簡單的文章瀏覽、歷史回顧、簽到功能、繫結賬號等功能。

        1、專案結構如圖：

        第一個小程式專案，功能相對簡單，練手足以。

        2、專案程式碼結構：

        3、專案配置相關檔案：

        app.js 用於儲存共有的、全域性的js函式

        app.json 用於儲存全域性變數，用於配置屬性

        app.wxss 用於儲存全域性樣式

        project.config.json 用於配置專案屬性，專案名稱等

        4、樣式由於比較生疏，大家別介意~還是那句話，功能實現就好。。。

              主要頁面（很多樣式沒有調整）：

歡迎頁是拷貝的其他專案，原因是：我不會做動態效果，但又想用動效

需要改動三個檔案，原始碼可以慢慢研究，最下面會貼出原始碼：

        首頁：

微信小程式，可以獲取到微信基本資訊，包括頭像、暱稱等，專案中放置在了app.js檔案中，呼叫了微信內部的介面。

分類頁：

頁面初始資料沒有寫，所以是空白頁，點選左上方選單按鈕，或者向右滑，主頁面會左移，展示出科目選單。

點選對應選單，會顯示對應分類的文章，如下圖：

點選文章列表，可進入對應的文章閱讀，下面是閱讀頁（還是那句話，樣式醜點沒關係，先實現功能。。。再調整）：

在分類主頁右上方，有主題選項，對應了8種主題背景，是比較溫和護眼的主題，點選喜歡的顏色主題，可進行切換。

“我的”頁：

以上，是專案主要頁面，原始碼地址：

小程式前端講解地址：https://blog.csdn.net/u012888052/article/details/79623292

小程式原始碼地址：https://download.csdn.net/download/u012888052/10297406

GitHub原始碼（最新程式碼）：https://github.com/HappyWjl/learn.mini（喜歡的朋友，幫忙點個star）

java後臺專案講解地址：https://blog.csdn.net/u012888052/article/details/80015340

java專案地址Gradle版本（程式碼中含資料庫）：https://download.csdn.net/download/u012888052/10362246

GitHub原始碼（最新程式碼）：https://github.com/HappyWjl/learn.break（喜歡的朋友，幫忙點個star）

vue後臺管理講解地址。。。這個還沒有寫，敬請期待，可以先看程式碼，還在優化中。

預覽地址：http://www.5iwyx.xyz:9999/#/articleList   賬號admin   密碼admin

功能還不完善，正在努力優化，有想加功能的同學，可以留言，我根據需求試著加上。

GitHub原始碼（最新程式碼）：https://github.com/HappyWjl/learn.web（喜歡的朋友，幫忙點個star）

vue前臺瀏覽講解地址。。。這個還沒有寫，敬請期待，可以先看程式碼，還在優化中。

預覽地址：http://www.5iwyx.xyz:8888/#/index

功能還不完善，正在努力優化，有想加功能的同學，可以留言，我根據需求試著加上。

GitHub原始碼（最新程式碼）：https://github.com/HappyWjl/learn.blog（喜歡的朋友，幫忙點個star）

專案還需優化、完善，部落格寫的不完善的地方，還請多多包含~ 錯誤的地方，還請留言指正。

作者：Happy王子樂

QQ：820155406

(近期迷上地下城，有富裕金幣的同學，給點金幣用，ID：血色冥靈，古靈精怪，跨六)

下面放上相關福利資源：

    一個牛人的總結地址（我轉載的），需要的可以照樣式copy，再改成自己需要的樣式：http://blog.csdn.net/u012888052/article/details/79623346

如果覺得本博文有用的話就多多點贊關注轉發，您的鼓勵是我最大的創作動力！