9 b9 k8 N2 i0 v) ]7 g+ Z, k6 \
# G- m- L. `/ X a4 d8 w3 G6 L〖课程介绍〗3 H& Z' R5 ?9 l5 Y9 A0 d1 K3 N5 s0 q6 {
运用Vue最新技术开发一个可商用、各项功能完备、媲美原生App的Web阅读应用。在开发中,将各种知识点穿插应用,让你真实感受到一个明星产品开发的全过程,项目对阅读器有着较为深入的研究,对各种复杂功能有从原理到实现的详细教学。同时,项目提供一流的用户体验和交互水准,在实现功能之外带你探究各种优秀前端交互的设计和实现
c8 b, J# W* P) q8 d; ] Q% _( E
( \; I {/ F( x* G〖课程目录〗+ ?# M4 y7 L5 a4 F
第1章 课程介绍# Y/ e6 y, J7 Y% B
介绍阅读器项目背景、功能结构、技术栈和功能演示,快速了解整个课程安排和内容。( C$ ^- H! L( j. V- p, ^
1-1 导学 试看
5 `: Q% c, r( O! w1-2 课程学习指南3 F9 a( a, o8 M, F: G9 K
/ p: @* O: F9 |( _0 q
第2章 项目需求及阅读器引擎介绍
+ u! l9 _2 Z! [) k S% Z介绍项目需求和阅读器的开发原理,并搭建Node.js和vue-cli 3.0开发环境。1 v( l+ F# o& W! @1 y
2-1 项目需求分析
" q: m9 M5 @ U! b2-2 阅读器原理介绍
1 `* y' R, `( b1 F2-3 ePub标准介绍
7 ^ G& I" g1 m6 N4 u+ f2-4 epubjs阅读器引擎介绍; }: N# x3 G. `; \' X* m
2-5 安装Node.js环境: s3 ^; F3 u7 X0 V8 @9 m+ \
2-6 vue-cli 3.0搭建方法(原型开发)$ S" K) x* j* n* K7 W
2-7 vue-cli 3.0搭建方法(脚手架创建项目)
! B0 K( a% P1 x8 {2-8 项目技术难点分析$ q3 z& s& B! A/ F
: i0 f4 c) Q* ^( F第3章 项目准备$ q: h) p8 y, b
完成项目开发前的准备工作,讲解如何引入字体图标、Web字体、rem、样式重置表,详细介绍vuex的基本原理及mapGetters的实现原理,搭建基于Nginx的静态资源服务器。
! i( T$ p6 ]( E- J3-1 准备工作说明
7 v! y3 j' g. F3-2 字体图标准备
) w2 i9 m( h3 ?3-3 项目依赖包下载# P: z. a& R" |# r/ U# v$ {( u
3-4 准备Web字体
6 O7 t& g0 U3 x# y3-5 viewport配置和rem设置3 h2 `1 j+ j' Y0 i. q) I1 @
3-6 global.scss和reset.scss设置
7 v9 Y3 G h5 u- |( L3-7 引入vuex+vue-devtools 试看
- ?; `* Y) {. D' t. k9 u3-8 搭建静态资源服务器
8 k2 e9 k5 S9 P1 H+ `
8 H. a/ l0 f+ j. ~# z- g% C第4章 阅读器--标题菜单、字号字体及主题设置功能开发
! i' b9 L1 @. T/ K8 ^) X9 n5 m) y讲解如何实现阅读器的解析和渲染、手势翻页操作、标题栏和菜单栏组件的解耦,并实现字号字体设置和阅读器全局主题设置功能。% r+ U0 q1 D4 m( [
4-1 阅读器需求分析! Q( f9 K1 e9 u7 v3 ~. i- F3 s* a Z
4-2 阅读器解析和渲染; B( ^# E/ i. j( w3 W5 `
4-3 阅读器翻页功能实现2 |7 {; b% ~! s4 A" ^& z* g' P
4-4 标题栏和菜单栏实现7 B* ~: `% r2 C* ]
4-5 字号设置 UI 实现
4 z) Y* H% C/ M! U: V4-6 字号设置功能实现/ \$ s. T$ P2 N
4-7 字体设置功能实现
2 I0 r6 g1 m% g- }7 ^/ i4-8 字体设置弹窗UI实现
. {1 K# ~4 ]* |5 D* m4-9 字体设置弹窗功能实现* @, e/ S- a s+ @
4-10 字号和字体设置离线存储$ G* N/ M$ c/ ^ q+ A/ u
4-11 字体设置标题国际化
- q C+ s3 k; C; b2 s) y8 F4-12 阅读器主题设置功能实现; U6 x" d( l3 `
4-13 全局主题设置功能实现
2 i$ o5 _" O; h: g+ O) s' A/ b( Y
第5章 阅读器--阅读进度、目录、全文搜索功能开发
% S* E+ n. H) v, I7 }讲解如何实现阅读器的阅读进度、阅读时间统计、章节切换、多级目录展示、全文搜索和目录加载动画。% H& M) i% `8 g% V$ _
5-1 阅读进度功能实现(进度面板+分页逻辑)' r! N/ h# \9 {+ ~. O5 E g8 C
5-2 阅读进度功能实现(进度拖动功能)6 j! L; v0 V& I
5-3 阅读进度功能实现(上下章节切换功能)
! l+ X3 j2 u" Y8 o( r* X5-4 阅读进度功能实现(章节切换和进度同步)
5 i9 `, t* C: ]; V" |- I5-5 阅读进度功能实现(保存阅读进度功能)
7 y" @; U: A) F& H( E- @5-6 目录功能实现(目录浮出效果)+ G7 f4 m2 C( w# F- c
5-7 目录功能实现(Tab选项切换和搜索效果), r( G5 D; W! n9 Y1 [1 T
5-8 目录功能实现(图书内容布局)' n( s/ J7 ~0 c W* g4 y
5-9 目录功能实现(图书内容样式)% R# }) M8 E, q
5-10 目录功能实现(目录数据结构开发)
& T$ U( N1 ?; L# W5-11 目录功能实现(多级目录功能)( Y% P- n4 X1 u& w' G* J- b( V1 x: ~
5-12 全文搜索功能实现(搜索算法+数组降维)" ^9 v* E; E( _3 j. C% _
5-13 全文搜索功能实现 (搜索关键字高亮+搜索结果高亮显示)
/ X/ q2 f4 B3 {5-14 目录加载动画实现(原理分析+布局实现)
: s, {% b: P& N; z2 ]5-15 目录加载动画实现(动画效果实现)- p& s1 k% K+ |% h7 n2 q
6 @+ O* _. M) W第6章 阅读器--书签功能、页眉页脚及兼容性优化5 @" T) C! N/ E7 o$ X
讲解如何实现阅读器的手势操作,详细介绍了复杂手势交互的实现思路及原理,为阅读器加入页眉和页脚,并优化了移动端和PC端兼容性问题,使阅读器可以更好的支持PC端和移动端使用。
3 d1 I5 G1 o4 A# w5 i- w+ }6-1 书签手势实现(页面下拉)+ P! F9 I. g% z: K8 N% _% l) ]
6-2 书签手势实现(书签组件)/ B5 l8 k" ?+ k' H9 h
6-3 书签手势实现(下拉状态管理)6 W) d! D: J) y7 y
6-4 书签手势实现(书签添加删除交互); ?/ Z" g6 }& n. y2 [4 S# s7 Q
6-5 EpubCFI原理介绍
+ q6 ]; ~4 X+ Z* @4 I0 r% c6 f$ |6-6 书签功能实现
. ~( T5 k/ d8 i7 K+ ^6-7 页眉和页脚功能实现
$ e& M: f- _" Z5 m( @9 Y2 b6-8 阅读模式介绍
0 Z1 @+ q0 S1 b8 Z8 \6-9 微信兼容性调整/ i- u( f! E. l; Y( G6 U
6-10 自适应布局优化(PC端布局优化)
: ^" |' V+ a8 {1 I0 [) a6-11 自适应布局优化(书签支持鼠标事件)- [8 I; l- J; @2 x: M; e, T7 Y' H# T
6-12 阅读器分页算法实现$ `: Q5 ~/ ^, D% T. X
6-13 阅读器相关知识点总结
2 x% ^/ s, u J% {, S( A' k, `# g8 L j& t! p! u
第7章 书城首页、搜索页、列表页和详情页开发
4 {3 M9 B$ n6 C6 E5 }, X5 f7 N/ o2 n讲解书城首页、搜索页、列表页和详情页的开发过程,详细介绍首页的推荐动画、标题栏和搜索框的交互动画实现原理,并引入Mock.js实现API数据模拟。* i5 {. @( @9 S- I6 X% R8 ]7 [
7-1 书城开发需求分析( O, {! s6 O7 E4 z4 v1 p* v) R; B
7-2 书城首页开发(框架页面+路由配置)
- y) Y8 D7 j$ A0 t7-3 书城首页(标题+搜索框布局)
$ q. Y+ z4 k) ]6 V4 m' j! y7-4 书城首页(标题+搜索框交互设计分析)
6 Y. z% [( A4 t- B7-5 书城首页(标题交互动画实现) 试看" Y( Y0 R8 g( B
7-6 书城首页(搜索框交互动画实现)
" m, e) d$ m% h1 j3 h7 @7-7 书城首页(热门搜索布局)' t) \& w5 e+ P0 |
7-8 书城首页(热门搜索交互)1 k. h! E4 G3 y9 T8 i$ s
7-9 书城首页(推荐页面布局)
8 G8 z- Y5 p/ k2 J: F1 i7-10 书城首页(卡片翻转动画实现)
# f3 [% L$ b# s% H& q0 y( l7-11 书城首页(卡片翻转动画重置)# B( w; a) v* z- u
7-12 书城首页(卡片登场keyframes动画讲解) |8 ^: m4 W) {$ B
7-13 书城首页(烟花动画实现)8 e7 z5 C+ G; j! c5 p. o- i6 [; K
7-14 书城首页(mockjs使用方法讲解)
' d( {6 E( J6 ~% N; I; S* |" E7-15 书城首页(推荐图书布局+动画)# `6 ~7 J6 T- B8 X
7-16 书城首页(首页图书布局实现). s1 e( p% A3 V5 n4 q/ T
7-17 书城详情页开发
4 M- c5 D: o) h' O1 s u7-18 书城列表页开发( j: x8 ?7 }1 `: g: ~
7-19 第七章总结7 X2 A& L" i7 Q9 }
" n* s$ e: q& v2 A/ h1 G: ~第8章 书架页面开发
6 c' U4 o3 g& n$ z讲解书架页面的开发过程,包括:书架数据结构设计、九宫格布局的实现、私密阅读功能实现、离线存储功能实现、分组功能实现、移出书架功能和动画实现。
! k* ~- D' ?0 i+ A8-1 书架标题组件布局实现
8 m' a. q5 ^ p/ ~5 g8-2 书架标题组件交互实现" @6 ?1 L& H& J% m( I
8-3 书架搜索框布局实现2 E: [3 c7 ]) P4 |- y1 M
8-4 书架搜索框交互实现(上)
) O. y3 k2 q4 j0 p) U8-5 书架搜索框交互实现(下)( ^% s8 K# k" N' W% F( ], n
8-6 书架数据结构设计+数据获取2 A- n5 k( ]) z0 B, p5 ^+ {( }
8-7 书架标题+搜索框样式优化(固定标题+滚动阴影)
; v; V8 ?. c7 }9 {& P$ [, N6 {$ y8-8 书架图书列表实现(组件设计+动态组件应用)
0 n7 z& j! K: ]: _8-9 书架图书列表布局. T( [; l/ j/ z! W( G
8-10 书架图书组件开发(单书封面+分类书籍封面实现)3 ~9 I7 L: }" }+ [) c* G. j
8-11 书架图书组件开发(添加+编辑实现)5 \1 S1 I n# c" g, p) t
8-12 书架编辑模式开发
# w6 d) d' d! }8-13 书架弹出框组件开发+ f" |# e8 U6 `$ v: @4 [
8-14 书架弹出框功能开发(1)1 ]+ y+ [2 m, g4 i& Z
8-15 书架弹出框功能开发(2)
8 t; f, W/ `6 v% g& Y8-16 电子书离线缓存功能开发(1)
3 W% X' `* S2 u% p$ }7 F8 |9 o8-17 电子书离线缓存功能开发(2)
# r# F1 }+ w8 N' E2 ~* U0 Y8-18 电子书缓存删除功能开发
3 l. G5 y2 @* q+ B" g& P8-19 书架缓存+离线阅读功能开发/ S1 j) M0 z* E
8-20 书架分组功能开发
" N3 w; c0 W; Q+ J! P! C7 O8-21 书架列表过渡动画开发
. ~' m8 }3 l, u& w8 \8-22 书架分类列表开发) n Y3 U. X* q4 {2 R
8-23 书架分组功能优化
& z! f9 E3 K% X, y' O- ~1 F4 \; _2 J8-24 书架修改分组功能开发(1)
& v! a2 L& W5 ]( d& Z0 d3 O8-25 书架修改分组功能开发(2)+ H2 k/ H6 u/ y; b8 g- p
7 b! b- z- v r第9章 听书页面开发
% i3 z. j0 \$ ]7 L |讲解听书页面的开发过程,详细讲解科大讯飞在线语音合成API的对接方法、播放器面板的布局实现、播放器的实现原理和方法。
( X9 c3 S! P2 v3 u ]9-1 听书功能介绍$ R% b2 I3 D7 |
9-2 听书组件集成% M( `8 N7 l; H+ i: X0 G
9-3 听书组件源码分析5 X$ L, F: k3 s; R
9-4 听书播放器源码分析
1 W1 p W, R- e+ `5 B* V9-5 播放器面板源码分析
: W9 x |6 L2 z7 D# Q9-6 听书功能开发要点总结
( D7 l) F8 q! ^/ B( U
$ O4 @/ ?3 i% {第10章 项目发布% f2 P. ~( C7 x Z+ A3 U/ P) \
利用Node.js开发简单的api,并通过阿里云的ESC进行项目发布,在CentOS操作系统上搭建Nginx服务,将代码上传至Git,通过编写自动化更新脚本实现代码的自动更新与发布。& p6 f8 h; C! Y i
10-1 Vue项目构建
9 Q; @% c3 i5 E10-2 功能优化+构建问题处理# V1 ]3 G' a( T/ C
10-3 数据库环境准备) Y7 v3 e& ^6 m! K6 m
10-4 Node.js+express编写API
& C4 \" Y& p, q e2 b10-5 书城首页API开发(1)
# U+ |# y$ o' w6 c: X10-6 书城首页API开发(2)3 I9 Z( \8 d2 a# V6 R% h! b
10-7 书城首页前后端API联调(解决CORS跨域)
0 d/ c+ C! {( b" d: l y/ f( K: x5 v10-8 电子书详情API开发
$ D, A; t$ K. f& w0 {10-9 电子书列表API开发! T# w0 s5 a1 t$ J
10-10 科大讯飞在线语音合成API对接(上)
( d# G9 V( R! V* I& p- r10-11 科大讯飞在线语音合成API对接(下)
. g5 l6 c! L$ x: B: a10-12 后端API源码上传git演示
# ~; e/ J$ E/ S1 q$ w10-13 阿里云ECS服务器开通
2 c% O" O/ v: \, D2 V1 a2 J10-14 CentOS Node.js环境搭建0 E& z: z8 `+ J9 c
10-15 CentOS Ngnix环境搭建/ B6 M" S( R4 h% b6 J
10-16 CentOS git部署+免密更新
- f: p9 z4 e7 E& _- g6 [7 d+ `0 i; z' l10-17 CentOS 前端项目构建和发布* E" x. w }# T' } x {
10-18 CentOS MySQL环境安装 ]2 [; G @7 t1 f" A$ A2 N* v
10-19 CentOS 一键部署脚本开发
+ \+ i/ Q: B: ~4 {! {0 K' f10-20 阿里云域名注册、解析与备案流程1 H0 {9 ]( g5 m' k( O% F
* Y% d) c! k5 ]7 I" {( O' \2 y- ]; j第11章 课程总结
) ?, i. h' g$ j: w0 p1 P整理回顾与总结课程中的知识点。
3 I: d- B' }9 L- T11-1 课程总结
. h: F4 l" Y* ^# ^" W6 ~% U3 W+ T7 [. s( Q/ h* d
〖下载地址〗$ v; |0 @, T8 K; R" b/ @
& b; S: E5 v. ^+ y; u0 Z
$ B" R3 C& a# H' G----------------华丽分割线-------------------------华丽分割线-----------------------华丽分割线-------------* n: [, H4 \5 a- f; X/ s
) H% n- m6 |+ P
〖下载地址失效反馈〗
3 Z- I! w( G& W& d) G" S' [! m如果下载地址失效,请尽快反馈给我们,我们尽快修复。请加QQ邮箱留言:2230304070@qq.com
& l; ]* a+ i$ ]- }6 V1 R/ t O+ I0 O4 [% V0 ^
〖升级为终身会员免金币下载全站资源〗9 e# E! b) a- I) w% W
全站资源高清无密,每天更新,vip特权了解一下:http://www.mano100.cn/rjyfk_url-url.html
8 i7 f V7 X" k" b% }5 L
$ `! u; O+ L/ W3 a# d+ h〖客服24小时咨询〗
1 @; y1 ?5 B5 _. j2 I9 C有任何问题,请点击右侧QQ邮箱:2230304070@qq.com 咨询。4 C# d6 E6 u& }' r7 Z
1 j- k, ^) U! j& r$ h N |
|