Skip to content
第0适合后端程序员的前端小程序开发框架
JavaScript CSS HTML
Branch: master
Clone or download
kala888 更新login的实现。
修改部分element的ui和回调方法
Latest commit 545388a Nov 18, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
config
docs 干掉没用的log Nov 12, 2019
src 更新login的实现。 Nov 18, 2019
.editorconfig
.eslintrc first initial Nov 5, 2019
.gitignore
.prettierignore first initial Nov 5, 2019
.prettierrc
.stylelintrc.json first initial Nov 5, 2019
README.md Update README.md Nov 15, 2019
_config.yml Set theme jekyll-theme-cayman Nov 5, 2019
jsconfig.json
package.json fix eslint version Nov 7, 2019
project.config.json 干掉没用的log Nov 12, 2019

README.md

第0适合后端程序员的前端小程序开发框架。

nice-router包含两部分:

nice-router-taro

nice-router-react-native (暂未开源, 稍等片刻)

多端统一开发体验

满足前端页面驱动和后端路由驱动的需求

给予后端开发页面控制权(方便实现客CS程序的千人千面,业务变更)

nice-router-taro

基础知识:React + DVA + Taro + TaroUI

Taro 是京东家的小程序开发框架,基于react的语法,跨多端开发框架(微信小程序,支付宝小程序,RN,抖音小程序......)

  • 目前来说Taro可能是综合评分最高的第三方小程序开发框架(相比wepy和mpvue)

DVA 基于redux + saga的轻量级react开发框架

如何开始

1.环境与知识准备
  1. 下载安装 Taro cli

  2. 成为开发者(找到您的小程序应用的管理员,把你的微信添加到开发者列表里就行)

  3. 下载 nice-router-taro

git clone https://github.com/kala888/nice-router-taro
  1. 修改小程序AppId (project.config.json)
    "appid": "wxff........07",
  1. 修改 默认title和theme (可选)

修改主色:通过 Taro UI 填入主色后,下载并打开文件 修改./src/styles.theme.scss中的三个值就行了

  $color-brand: #6dbb4d;  
  $color-brand-light: #92cc7a; 
  $color-brand-dark: #57963e;

修改navigationBarBackgroundColor和tabBar的颜色(app.js中)

  1. 修改服务端地址 (可选)

./src/utils/config.js

const baseURL = 'https://demo2.doublechaintech.com/storedev/wxappService/'
  1. 编译,启动开发环境
#下载相关的依赖,可以用npm install或者yarn
yarn
#启动小程序 可以用npm run dev:weapp或者yarn dev:weapp
yarn dev:weapp
  1. 微信开发者工具中,导入项目 查看效果

小提示:

1.以集成prettier,提交代码前,先 'yarn format' 一道,有助于团队成员间代码merge.

2.文档中提到的“服务端”是指供前端开发使用Façade层,根据项目架构不同可能指代的是后台或者中台应用。(Façade 读音: 法萨)

老铁,都看到这了,点个赞呗

2.我需要一个后端服务,最好搭配一个中台
  • 这里推荐使用自动代码生成框架 DaaS Start Kit,可以与nice-router完美配合。
已经上线的小程序

开发手册

新增简单页面

让页面与后端进行数据交互

来几个概念和约定

简单使用listof组件

如何创建新的line-item

图片上传

提交一个Form

[Step-Form]

ServerImage

使用后端驱动Toast消息

使用后端驱动的Popup消息

使用后端驱动的登录跳转

NavigationService

view-mapping

nice-router.model

几个内置页面

混搭H5页面

断网重试network-exception-page

使用HomePage

使用LoginPage

使用Listofpage

使用GenericPage

内置的Genericpage UI Element

内置的Listof lineitem

......
100. Tips

nice-router 已经组件共享提供了基础的支持。希望各位兄弟贡献各种常用的组件,尤其是那些促销组件。让体力活变为OOTB。

nice-router-taro 开发文档

nice-router-react-native 开发文档

You can’t perform that action at this time.