用户
 找回密码
 立即注册

QQ登录

只需一步,快速开始

扫一扫,登录网站

小程序社区 首页 教程 查看内容

北京快3有网址吗:基于Taro的小说阅读小程序

北京快三最新开奖结果 www.6z8dk.cn Rolan 2019-3-7 00:12

先讲一下如何将本项目起来。 第一种方式:如果不进行授权,则无法使用书架和个人书架页,使用方式如下:## clone git clone https://github.com/k-water/taro-reader ## install deps npm install ## compile npm ru ...

先讲一下如何将本项目起来。 第一种方式:如果不进行授权,则无法使用 书架 和 个人书架页,使用方式如下:

## clone
git clone https://github.com/k-water/taro-reader

## install deps
npm install

## compile
npm run dev
复制代码

然后将 dist 文件夹导入微信开发者工具即可预览。

第二种方式:如果进行授权,涉及到微信北京快三最新开奖结果登录,需要多一些数据,在 /src/cloudFunctions/userLogin 中创建一个 config.js 文件,内容如下:

const config = {
  appid: 'your appid',
  secret: 'your secret',
}

module.exports = config
复制代码

然后将云函数上传并部署,记得安装依赖,接下来的操作同第一种方式。

前言

Taro是一个遵循React语法规范的多端开发的框架。自从其开源以来,就一直关注,从一开始0.x版本,到后来的1.0版本。时至今日,Taro已经发展成为一个成熟的框架,社区也逐渐完善。有一点值得点赞的是,Taro的维护人员处理问题很快,开发者很快能得到响应,专注认真的开源态度,我觉得是Taro发展好的原因之一。

数据源

此项目是一个阅读类的小程序,基于Taro开发。大概的初衷就是想试用一下Taro,熟悉Taro的开发流程等。抛开Taro,既然是阅读类的小程序,那么数据源要从何获???一开始思考的就是这个问题,有过几个想法:

  • 写一个爬虫试试
  • 浏览github看有没有合适的API
  • 有没有第三方免费的API

经过自己的搜索,加上个人时间上的限制,最终选择了第三个方案。github上确实有相关的项目可供使用,但是大部分都是基于Python,对Python不太熟悉,有一定的学习成本,故舍之。而爬取整站的书源对于我一个写页面的来说,也有点不太实际。最后在网上看到了 追书神器 的API,进行一番搜索和思考后,觉得这个东西可以作为数据源,毕竟我主要是想尝试Taro,所以数据源方面能简单解决最好了。网上关于追书神器API的说明也有很多,自己通过搜索整理后,总结成了以下几个部分:

  • 主题书单
  • 分类
  • 精选书籍
  • 书籍排行榜
  • 书籍详情
  • 书籍点评
  • 搜索

大大小小API大概有20+个,实现的功能基本与之相关。由于接口是 HTTP 的,所以通过自己的服务器做了一层 HTTPS 的代理,方便使用。后端项目为: reader-api

此项目并没有什么逻辑,只是对参数做了下简单的处理,通过 curl 发送请求拿到数据。

界面设计

数据源解决了,下一步就是页面如何设计,UI怎么写等问题。对于一个不擅于设计的前端er来说,这方面还是稍微有一些阻滞的。一开始,通过墨刀画出了初始的原型图,在画原型图的过程中,脑中思考的是页面的布局和要实现的功能,对于UI方面,则到了实际代码开发中才实现。初始界面设计如图所示:

在实际开发中,页面UI和布局参考了微信读书,实现上可能没有那么精细,但也可以接受。

项目开发

有了以上准备,就可以进入写代码的阶段了。在初始化项目前思考,需不需要状态管理,要初始化什么样的项目。由于本项目页面与页面之间的数据共用的可能性不大,一些页面跳转的参数可以放在路由参数上,所以没有使用redux。

目录结构

├─ config
├─ dist
└─ src
      ├─ app.js
      ├─ app.scss
      ├─ cloudFunctions   ##  云函数
      ├─ components       ##  公用组件
      ├─ index.html
      ├─ pages            ##  主页面
      │    ├─ book
      │    ├─ class
      │    ├─ index
      │    └─ person
      ├─ static           ##  静态资源
      │    ├─ icon
      │    └─ image
      ├─ subpages         ## 子包
      └─ utils.js         ## 工具函数
├─ package.json
├─ project.config.json
├─ .editorconfig
├─ .eslintrc
├─ .gitignore
├─ LICENSE
├─ README.md

复制代码

从目录结构看出,主页面有四个,即

  • 书城
  • 分类
  • 书架
  • 个人中心

因为 书架 和 个人中心 这两个页面涉及到用户的信息存储,所以这里结合了小程序云开发,通过调用云函数的方法进行数据通信,方便开发。 根据实际情况,其他的页面即通过分包的方式进行加载,减少小程序首屏的加载时间。

实现的功能

根据已有的API,实现的功能有:

  • 主题书单
  • 排行榜
  • 精选书籍
  • 书籍详情
  • 书籍点评
  • 点评详情
  • 书籍搜索
  • 阅读功能
    • 阅读模式切换
    • 保存阅读进度
  • 书架功能

这样说可能有点抽象,看一张GIF展示图:

由于个人开发者不能上传阅读类的小程序,再者这个小程序本就是来练手的,所以更多功能请下载使用。

开发总结

总体来说,Taro的开发体验是很不错的。由于个人之前写习惯了React,所以基本看一下文档就上手了。根据文档来开发,效率还是不错的。对于Taro不支持的小程序API或者语法,可以通过直接书写原生小程序代码实现。并不影响代码编译和功能开发。在代码校验方面,Taro重新定义Eslint规则,遇到不合理的代码规范,会有详细的中文提示,这位开发者节省了不少功夫。 由于社区的活跃和维护者处理issue神速,整体没什么阻滞,没遇到什么坑,也许可能是我还没有用到那么多特性吧(~ ̄▽ ̄)~ 。接下来有机会还会继续实践,持续关注ing。

分享至 : QQ空间
收藏
原作者: water_ 来自: 掘金
  • 【十九大·理论新视野】为什么把“建设美丽中国”作为现代化目标之一 2019-05-21
  • 【奋斗者说】银河麒麟孔金珠:核心技术只有靠自己干出来 2019-05-20
  • 大阪发生6.1级地震 至少造成3人死亡 2019-05-20
  • 南通如皋为应对督察“回头看”违法掩埋危险废物 2019-05-19
  • 海融口腔“免费看牙”惠民活动启动 惠及乌鲁木齐市民 2019-05-18
  • “改革开放40年山东教育成就展”启动 2019-05-17
  • 南昌重拳整治酒驾毒驾 2019-05-16
  • 守土有责守土尽责 扎实做好水污染 防治各项工作 2019-05-15
  • 广东水漫大街市民触电身亡,是天灾还是人祸? (原创首发) 2019-05-14
  • 统计局解读8月PMI:制造业增长动力不足 2019-05-13
  • 世界读书日 山西推出245种优秀书目助力全民阅读 2019-05-13
  • 北京赛车pk10 75秒极速赛车34567规律破解开奖结果历史记录查询 2019-05-12
  • 马克思主义通过指导无产阶级革命建立起部分社会财富公有制而改变了人类历史发展进程,离开部分社会财富公有制的建立来谈“改变人类历史发展进程”纯粹是无稽之谈。 2019-05-11
  • 利好不断!新能源汽车正在迎来春天 2019-05-10
  • 全世界人民都要尊重人类社会发展规律即从过去资本主义社会财富私有制经过现代社会财富公有制和私有制并存而发展到未来共产主义社会财富公有制。 2019-05-10
  • 226| 263| 754| 257| 701| 204| 978| 217| 815| 400|