# webAppReader

**Repository Path**: hotsuitor/webAppReader

## Basic Information

- **Project Name**: webAppReader
- **Description**: h5 web app 阅读器
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2018-11-23
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README





## 技术选型



nodejs

koa web框架

vuejs 前端框架

EJS 模板引擎（后端）





## 10-1 服务端搭建



- 目录结构
- nodejs基础开发
- 接口

### 项目目录搭建

* package.json
* static    ——>   src
* service
* mock
* app.js



## 10-3 构建中间组件

* koa  web框架引入使用
* 路由配置 `koa-route`
* 静态资源访问 `require('koa-static-server')`



## 10-4 mock数据接口





## 10-5 添加线上接口，http接口调用

* 使用qs解析json字符串为querystring的形式
* `qs.parse(this.req_parsedUrl.query)`



## 10-6 ajax接口



id传参





## 10-7 页面路由完整开发

ejs模板渲染方法



## 11-1 页面基础架构搭建



主页

书籍列表页

详情页

个人页面

搜索页面



## 11-2 代码模块拆分

## 11-3 header 样式和结构实现

## 11-4 首页顶部功能区域html结构实现（上）

## 11-5 首页顶部功能区域html结构实现（下）

## 11-6 首页书籍列表的结构和样式

## 11-7 首页其他模块的静态结构和实现（上）

## 11-8 首页其他模块的静态结构和实现（下）

## 11-9 首页细节调整和vue数据绑定

## 11-10  首页动画效果和书架实现（上）

## 11-11  首页动画效果和书架实现（下）

## 11-12 书籍详情页静态实现（上）
## 11-13 书籍详情页静态实现（中）
## 11-14 书籍详情页静态实现（下）

## 11-15 书籍详情页的数据绑定

## 11-16 集成阅读器的代码到项目中 TODO

## 11-17屏幕自适应

## 11-18搜索功能的思路

* 传递关键字
* 调用线上接口
* 返回数据绑定

## 项目总结

    * 2016年10月买的课程，当初只有H5阅读器部分，一开始不是很懂为什么这样写，只是跟着实现了阅读器的大部分功能。
    * 2017年更新了课程，增加了书城模块，有看了一下，看不懂，跟着敲代码出错了也不知道是哪里的问题，如何debug。
    那时工作是在做网管管理，有一段时间没接触开发了，在学习网络方面的知识，开发方面就落下了。
    * 2018年10月份开始，再回头看了一下，发现书城模块讲的koa，vue数据绑定，是当下非常流行的技术。觉得自己错失了很多，
    明明自己花点时间再努力一点，就可以超越那么多人了，却没有坚持下去。
    * 2019-1-2，今天总算把项目课程都看完了，项目也跟着做下来，遇到问题，自己可以debug，算是完成一桩心愿吧。
    总耗时140h32min

## TODO
- [ ] jsonp获取不了数据，无法在阅读器展示
- [ ] 二级页面未完成