DietLens WeChat MiniProgram 2nd version is built for gathering user food intaken information by TextSearch/Image Recognition to generate food recommendation. main feature/module following:
- foodDiary (image upload, recognition process)
- user profiling (onBoarding, userInfo)
- recommendation report (daily report, weekly report)
- home (Intaken Chart)
-
loginService: handle miniProgram login/registration, Provide Networking WebAPI for valid client JS code thus get the token for AppService.
-
AppService: handle miniProgram all the business service, Provide Networking API based on token.
-
ProtoAPI: these api code is generated by protoAPI - https://github.com/yoozoo/protoapi, change the baseURL and configure Domain in 微信公众平台 to make Http Request work.
-
ENV change: when switching between test env and product env, we supposed to change the baseUrl in AppService.ts and LoginService.ts, change the cosSignUrl in uploader.js
- Put all the local used icon here. Notice: only images(icons) below 20KB allows to be put here. For large size image,need to upload image to tencent cloud and miniprogram load it from Internet.
- Home: First Tab page, Including the weekly calorie intake chart.
- FoodDiary: Second Tab Page, The entrance of food record.
- Report: Third Tab Page, The Tab for Daily/Weekly report.
- More: Forth Tab Page, The Tab that display user portrait, it's also the entrance of the user profile.
- Login: User WeChat authentication page, invoke the wx.authorize to user info.
- WebView: WebView that able to load web page from self host domain or the article that published from public account.
- ImageTagging: The page that load image in, get the image recognition result, return in tags. User should finish food tagging within this page.
- TextSearch: The page that user can search recipe/ingredients and add to food record accordingly.
- FoodDetail: The page that require user to adjust portion of the recipe/ingredients that match their meal intake then record these information into foodDiary.
MiniProgram-npm library used:
-
[moments] (https://momentjs.com) - Parsing epoch time to date
-
[wx-f2] (https://github.com/antvis/wx-f2) - The f2-chart that support mini program for drawing all kind of chart.
source-code library used:
- under folder /components/ - calendar, modal-input, xing-scroll-view is the lib that open for modification.
- Try to avoid using native components: textArea, canvas , camera, map due to layout and compatible issue.
- 工具 -> 项目详情 -> 启用自定义处理命令 to enable pre-tsc auto compiling ,编译前预处理 npm run compile.
- enable 不校验合法域名、web-view(业务域名)、TLS 版本以及 HTTPS 证书 when develop, disable this option when release for testing.
For set up npm dependency
npm install
then "构建npm" to load library at dependency lib folder.