小程序真的太火了,我18線小城市的朋友都知道了辜腺,知道我是程序員。遂找我開發(fā)一塊微信小程序商城乍恐。正如前面所說评疗,我網(wǎng)頁這一塊是欠缺的,一個完整的網(wǎng)頁都沒寫過的我茵烈,最終還是答應了這位哥們試試看百匆!主要處于兩個方面考慮:
- 別人在有需求的時候主動找到我,說明對我能力的信任呜投,不想辜負別人的信任加匈。
- 小程序確實是個引流的巨大入口,市場需求很大仑荐,可以嘗試學習下雕拼。
- 可以掙錢,下午茶有著落了粘招。
正如前面所說啥寇,我是找了個開源項目,差不多花了三天時間搞定洒扎。一天時間看找開源項目辑甜,一天時間部署運行環(huán)境,看了半天API文檔袍冷。差不多就是這么個進度磷醋。下面我們先來看下實現(xiàn)的效果:
小程序效果如下:
后臺管理系統(tǒng)效果:
下面我們進入正文:
[TOC]
項目介紹
我找的開源項目是李鵬軍開源的微信小程序商城,前后端開源胡诗。項目地址:platform-wechat-mall邓线,感謝鵬哥的無私奉獻,讓我坐享其成乃戈。當然褂痰,他也開通了QQ技術交流群,大家可以進群一起討論症虑。也和他微信聊過缩歪,感覺是很有想法,很nice的人谍憔。
關于這個項目的技術選型匪蝙,好吧主籍,大家還是看圖吧,我也不知道幾個逛球,了解下就好千元。
接下來我們主要是做一些軟件的安裝,如果各位有裝好的可以跳過對應的部分颤绕。
好了幸海,不多說了,下面是具體的軟件安裝步驟:
下載TomCat
-
點擊進入tomcat下載官網(wǎng)奥务,下載Tomcat,我這邊使用Tomcat 8.0.
20180717073914783.png -
解壓Tomcat壓縮包到指定文件物独,并運行bin目錄下的startup.bat文件
20180717074053537.png
這時候我們可以在瀏覽器輸入http://localhost:8080/,運行如下界面即啟動成功:
下載安裝MySQL
數(shù)據(jù)庫是后開開發(fā)必備氯葬,所以如果沒有安裝MySql的朋友挡篓,就先花幾分鐘將MySQl安裝一下。
- 下載安裝MySQL官方下載地址
-
下載打開安裝帚称,一直下一步即可官研,需要注意下面兩個點,一是賬號名密碼闯睹,二是服務器名戏羽。
20180717081602912.png
-
到MySQL的安裝目錄下,進行MySQL服務的啟動
20180717083728796.png
顯示服務啟動成功瞻坝,表示你的MySQL已經(jīng)安裝成功蛛壳,接下里我們安裝可視化管理工具。
下載安裝數(shù)據(jù)庫管理工具
數(shù)據(jù)庫管理工具有很多所刀,我這里用的Navicat來管理數(shù)據(jù)庫。如果你使用其他的亦可以捞挥,對項目無影響浮创。具體可以參考:SQlite數(shù)據(jù)庫查看工具軟件集。
- Navicat 官方下載地址滑到底部砌函,點擊下載斩披。這個只能試用14天,需要破解版的可以關注我公眾號“aserbao”回復“navicat”獲取讹俊。
安裝運行成功后垦沉,我們點擊連接上面啟動成功的數(shù)據(jù)庫,輸入數(shù)據(jù)庫密碼仍劈。
最終在當前數(shù)據(jù)庫下面有個platform-shop的包厕倍。及運行成功。導入數(shù)據(jù)庫也可以在下一步啟動后臺管理系統(tǒng)時再進行贩疙。這樣就能在當前下載的目錄下找到platform.sql文件讹弯。否則可以到開源項目地址中去下載platform.sql文件况既。
下載安裝IntelliJ IDEA
很多開發(fā)的朋友應該電腦中都裝有ItelliJ IDEA,如果你裝有IDEA可以直接跳過此步驟。
- 首先我們下載安裝IntelliJ IDEA官網(wǎng)下載组民,安裝到本地棒仍。IDEA安裝參考鏈接
- 激活IntelliJ IDEA。激活注冊碼獲取地址
啟動后臺管理系統(tǒng)
-
將項目導入到IDEA中臭胜,Check out from Version Control 選擇 git
20180717071702675.png
-
輸入項目倉庫地址https://gitee.com/fuyang_lipengjun/platform.git
20180717071916389.png -
配置tomcat
a. 打開Edit Configurations莫其,點+號,選中Tomcat Server 選中Local
20180717074555781.png
b. 配置之前下載的Tomcat耸三,點擊Configure配置Tomcat乱陡。如果是最新版本請在On"Update"action后選項選擇Update classes and resources,這樣每次修改js,html,java都不需要重啟。
c . 點Fix 選擇platform_framework:war exploded把項目部署到tomcat
部署完成之后吕晌,我們點擊運行按鈕蛋褥,運行整個項目:
等待運行完成。我們就可以看到效果了:
到這里睛驳,我們后臺管理的編譯運行就完成了烙心,我們通過登錄管理系統(tǒng)內(nèi)部對商品進行發(fā)布修改:
現(xiàn)在我們本地的數(shù)據(jù)庫已建立完成,現(xiàn)在我們可以開始建立前端界面對數(shù)據(jù)進行訪問了乏沸。接下來我們開始編譯運行小程序代碼淫茵。
下載小程序編譯器
當然,如果沒有注冊微信小程序的朋友請在微信開發(fā)平臺注冊自己的微信小程序
下載微信小程序開發(fā)工具蹬跃,下載匙瘪,填寫自己微信小程序APP ID及獲取AppSecert.
下面我們將請求鏈接設置為http://localhost:8080/api,獲取數(shù)據(jù)就是后臺管理器修改的數(shù)據(jù)。這時候我們打開瀏覽器登陸localhost:8080,進入綜合管理平臺蝶缀,就可以修改自己想展示的數(shù)據(jù)了丹喻。
總結
其實對于后臺一竅不通的我暫時還不知道如何通過自己域名訪問,之前計劃是這篇文章打算將上線的一塊總結出來供大家一起學習翁都,但是由于我的域名備案剛通過碍论,時間有限。還需要學習更多后臺及服務器方面的知識柄慰。下一步計劃準備學習下后臺開發(fā)鳍悠,這段時間搞了個自己的博客管理系統(tǒng)(www.aserbao.com)。當然坐搔,我也發(fā)了關于學習博客管理系統(tǒng)的Chat零基礎建立自己的博客網(wǎng)站藏研,有興趣的朋友可以關注下。當然概行,之后會將微信小程序開發(fā)學習的一些資料整理出來蠢挡,由于Chat文章無法修改,到時候就在公眾號aserbao進行發(fā)布,有興趣的朋友可以在微信公眾號給我留言交流袒哥。