# 前言
mui是一款接近原生App體驗(yàn)的前端框架症汹，只需要掌握前端技術(shù)就可以開發(fā)APP應(yīng)用，官方有提供功能比較全面的demo版本，
但在實(shí)戰(zhàn)中總會(huì)遇到一些不可避免但坑，對(duì)于沒有接觸過mui的開發(fā)者母怜，難免會(huì)浪費(fèi)很多時(shí)間在踩坑上。
該項(xiàng)目以mui為開發(fā)框架缚柏，artTemplate.js作為js模版引擎苹熏，沒有繁瑣的配置和編譯過程，拿來就可以上手币喧，適合剛接觸mui的同學(xué)參考和學(xué)習(xí)
[項(xiàng)目地址](https://github.com/EasyTuan/mui-kidApp),如遇網(wǎng)絡(luò)不佳轨域，請(qǐng)移步[國內(nèi)鏡像加速節(jié)點(diǎn)](https://gitee.com/easytuan/mui-kidApp)
## 項(xiàng)目運(yùn)行
```
git clone https://github.com/EasyTuan/mui-kidApp.git
國內(nèi)鏡像加速節(jié)點(diǎn)
git clone git@gitee.com:easytuan/mui-kidApp.git
```
打開HBuider，打開項(xiàng)目
右鍵項(xiàng)目=>轉(zhuǎn)換為移動(dòng)App
運(yùn)行=>真機(jī)運(yùn)行(需要usb連接手機(jī))
注：服務(wù)器到期杀餐，接口服務(wù)不再支持干发，能正常登陸和退出，不影響正常功能但預(yù)覽和學(xué)習(xí)
# 目標(biāo)功能
- [x] 定位功能 -- 完成
- [x] 選擇城市 -- 完成
- [x] 展示所選地址附近商家列表 -- 完成
- [x] 在高德地圖中尋找店鋪 -- 完成
- [x] 搜索文章史翘，賽事 -- 完成
- [x] 商家列表頁 -- 完成
- [x] 店鋪評(píng)價(jià)頁面 -- 完成
- [x] 單張卡牌詳情頁面 -- 完成
- [x] 商家詳情頁 -- 完成
- [x] 登錄铐然、注冊(cè) -- 完成
- [x] 三方微信、QQ登陸 -- 完成
- [x] 修改密碼 -- 完成
- [x] 個(gè)人中心 -- 完成
- [x] 發(fā)送短信恶座、語音驗(yàn)證 -- 完成
- [x] 賽事列表 -- 完成
- [x] 賽事詳情 -- 完成
- [x] 添加、刪除沥阳、修改收貨地址 -- 完成
- [x] 帳戶信息 -- 完成
- [x] 服務(wù)中心 -- 完成
- [x] 紅包 -- 完成
- [x] 上傳頭像 -- 完成
- [x] 卡牌對(duì)戰(zhàn)發(fā)起 -- 完成
# 業(yè)務(wù)介紹
入口地址為 `html/main.html`
目錄結(jié)構(gòu)
? ? ├── css //css樣式文件
? ? ├── fonts //字體圖標(biāo)
? ? ├── html //頁面
? ? ├── images //圖片
? ? ├── js //js
? ? │? ? └── lib //js第三方庫
? ? ├── unpackage //App圖標(biāo)跨琳、啟動(dòng)頁
? ? └── manifest.json //App配置文件
## 部分截圖展示
### 首頁展示
<img src="https://easytuan.gitee.io/mywebsite/images/mui/1.jpeg" width="375px" height="667px" /> <img src="https://easytuan.gitee.io/mywebsite/images/mui/2.jpeg" width="375px" height="667px" />
### 對(duì)戰(zhàn)發(fā)起 && 官方資訊
<img src="https://easytuan.gitee.io/mywebsite/images/mui/3.jpeg" width="375px" height="667px" /> <img src="https://easytuan.gitee.io/mywebsite/images/mui/4.jpeg" width="375px" height="667px" />
### 論壇 && 帖子詳情
<img src="https://easytuan.gitee.io/mywebsite/images/mui/5.jpeg" width="375px" height="667px" /> <img src="https://easytuan.gitee.io/mywebsite/images/mui/6.jpeg" width="375px" height="667px" />
### 用戶中心
<img src="https://easytuan.gitee.io/mywebsite/images/mui/7.jpeg" width="375px" height="667px" /> <img src="https://easytuan.gitee.io/mywebsite/images/mui/8.jpeg" width="375px" height="667px" />
# 說明
>? 如果對(duì)您有幫助，您可以[點(diǎn)擊項(xiàng)目](https://github.com/EasyTuan/mui-kidApp) "Star" 支持一下 謝謝桐罕！ ^_^
>? 或者您可以 "follow" 一下脉让，我會(huì)不斷開源更多的有趣的項(xiàng)目
>? 如有問題請(qǐng)直接在 Issues 中提，或者您發(fā)現(xiàn)問題并有非常好的解決方案功炮，歡迎 PR
# 友情鏈接
[該項(xiàng)目基于Ionic3.x的實(shí)現(xiàn)](https://github.com/EasyTuan/ionic-cordova-demo)
