Z( S2 G4 P7 s( b8 c$ L; b9 A1 d+ {6 L
〖课程介绍〗) q; ~$ ?; ^6 s3 z3 W
运用Vue最新技术开发一个可商用、各项功能完备、媲美原生App的Web阅读应用。在开发中,将各种知识点穿插应用,让你真实感受到一个明星产品开发的全过程,项目对阅读器有着较为深入的研究,对各种复杂功能有从原理到实现的详细教学。同时,项目提供一流的用户体验和交互水准,在实现功能之外带你探究各种优秀前端交互的设计和实现
) y5 ?) e- _9 ^% J2 h# w( w( {5 T* S3 l$ o' X* H
〖课程目录〗
/ r$ @ T2 q- m' L1 ]% ?& h* ^第1章 课程介绍( q8 q2 ^1 r0 X
介绍阅读器项目背景、功能结构、技术栈和功能演示,快速了解整个课程安排和内容。
1 x5 \7 h/ V# T; P6 K1-1 导学 试看
9 `! K7 }5 k, w W. h4 U1-2 课程学习指南
% L8 m% J5 a+ T9 l9 E
7 d+ n8 j+ Q: B( q! O+ W) ?第2章 项目需求及阅读器引擎介绍, [* ]# I! O: b4 ?, C
介绍项目需求和阅读器的开发原理,并搭建Node.js和vue-cli 3.0开发环境。
+ P Q8 w/ o9 i+ ]6 W6 z" A2-1 项目需求分析
5 R5 c1 ?% n# h4 z) w' X2-2 阅读器原理介绍
! P* b1 G' w0 i& p# `2-3 ePub标准介绍, b) f; I& x/ s5 k3 b: N2 y
2-4 epubjs阅读器引擎介绍/ o+ G G" o! z
2-5 安装Node.js环境9 f: h$ Q' K7 e, K+ ]' r" r$ r# F
2-6 vue-cli 3.0搭建方法(原型开发)
& @' ?$ C7 f) M2-7 vue-cli 3.0搭建方法(脚手架创建项目)
2 A' U( Y2 Q, J" o* q4 [2-8 项目技术难点分析2 g7 ~# |" {9 e. g% A, s
' J0 c. v ~8 u/ d' A第3章 项目准备0 o- A: l+ c4 m1 J9 K" s
完成项目开发前的准备工作,讲解如何引入字体图标、Web字体、rem、样式重置表,详细介绍vuex的基本原理及mapGetters的实现原理,搭建基于Nginx的静态资源服务器。
. H: v% w6 v0 U3-1 准备工作说明
! h# O6 _" }7 Z3-2 字体图标准备
# G8 e* ]3 l0 N3-3 项目依赖包下载
|# ]- W! \9 c* Y( A4 m2 |3-4 准备Web字体6 m. k2 }- F; j! J
3-5 viewport配置和rem设置
: [! ~8 T( U5 Z5 ~0 l9 t& E3-6 global.scss和reset.scss设置
6 V( A) ~7 k/ \1 m3-7 引入vuex+vue-devtools 试看3 w6 t0 E. d7 m2 Z3 N w |$ Y, _$ `
3-8 搭建静态资源服务器
& e2 M, A& q3 X- x- b3 e7 K1 R
$ X& R% f0 X) h5 f4 R; e第4章 阅读器--标题菜单、字号字体及主题设置功能开发
1 W& J( J. E' h讲解如何实现阅读器的解析和渲染、手势翻页操作、标题栏和菜单栏组件的解耦,并实现字号字体设置和阅读器全局主题设置功能。+ p" Y, s. x) Q" B! Y! O/ B
4-1 阅读器需求分析
9 ^+ ?3 t- h1 F8 y" i5 Y n, U; x4-2 阅读器解析和渲染. C _7 {! _" O5 z& c
4-3 阅读器翻页功能实现* c+ N! m# x0 W5 j
4-4 标题栏和菜单栏实现
! P/ N8 W j j; G4-5 字号设置 UI 实现
8 Z. k4 Y9 }/ n( h1 O4-6 字号设置功能实现; b# N8 V! J0 J8 Q$ p5 Q A r- R4 O
4-7 字体设置功能实现: o) p2 W! L# e$ M R
4-8 字体设置弹窗UI实现
: o& L+ n7 Z7 z8 |' T2 \/ m% [5 Q4-9 字体设置弹窗功能实现
+ \1 G; T1 Q, Q+ D% o4-10 字号和字体设置离线存储0 }: ^8 V$ W# K+ z8 |. N2 Y
4-11 字体设置标题国际化& I# f2 E) v5 w J/ o7 T9 B
4-12 阅读器主题设置功能实现) g" G3 h1 G, ~2 O9 x8 s( b! o
4-13 全局主题设置功能实现% N/ _# K; D. I$ Z! I
* |, e1 a9 c, H. _8 s2 S [( c
第5章 阅读器--阅读进度、目录、全文搜索功能开发
7 S- h/ B, A$ N/ x' F9 I) L' e讲解如何实现阅读器的阅读进度、阅读时间统计、章节切换、多级目录展示、全文搜索和目录加载动画。7 x+ q, X9 O* D& C
5-1 阅读进度功能实现(进度面板+分页逻辑)
( c# V j5 l9 A% T- |' U5-2 阅读进度功能实现(进度拖动功能)0 O4 N L, M( w K7 z/ U
5-3 阅读进度功能实现(上下章节切换功能)( {. ?! E) H! I) ~2 L7 J
5-4 阅读进度功能实现(章节切换和进度同步)
8 N# Y A* v+ a1 @- Z5-5 阅读进度功能实现(保存阅读进度功能)
8 c) [' d7 y- c) e$ J7 O5-6 目录功能实现(目录浮出效果)
% C% @# s8 ~3 i! l( K5-7 目录功能实现(Tab选项切换和搜索效果)1 ]8 i! Z" I1 Z, i0 G" {
5-8 目录功能实现(图书内容布局)
% V. U0 K, s3 l) l) E5-9 目录功能实现(图书内容样式)
, K0 {+ a( W* s$ T5-10 目录功能实现(目录数据结构开发)
4 y; T* [. b8 ~ m8 X8 n/ c5-11 目录功能实现(多级目录功能). P. I' n" C# Z' }
5-12 全文搜索功能实现(搜索算法+数组降维)
1 N& R, i% G- b5-13 全文搜索功能实现 (搜索关键字高亮+搜索结果高亮显示)1 I$ [4 L' y/ h8 Z2 z
5-14 目录加载动画实现(原理分析+布局实现) a2 V' J8 o' R! _
5-15 目录加载动画实现(动画效果实现)
, [* @( U' ~' c* {) L3 K% I
( S$ n6 g/ C, ~+ x/ v第6章 阅读器--书签功能、页眉页脚及兼容性优化
7 R3 u, ^5 X Y0 _0 g讲解如何实现阅读器的手势操作,详细介绍了复杂手势交互的实现思路及原理,为阅读器加入页眉和页脚,并优化了移动端和PC端兼容性问题,使阅读器可以更好的支持PC端和移动端使用。$ T; A$ c- Y2 B- A: K2 V! p
6-1 书签手势实现(页面下拉)5 x) |8 O; Q1 X
6-2 书签手势实现(书签组件)- ]; Y9 k9 ?9 Z- `8 D
6-3 书签手势实现(下拉状态管理)
2 y2 ]* g8 h) _0 Z' L6 B6-4 书签手势实现(书签添加删除交互)5 A4 O6 h, E+ \" C8 [, K
6-5 EpubCFI原理介绍: u% F* b& V8 F' M
6-6 书签功能实现
! y1 \" }. ^; @3 L o E6-7 页眉和页脚功能实现
6 q. Y% f! d8 q6 [6-8 阅读模式介绍" C. w( @' N2 i( X+ b
6-9 微信兼容性调整
1 ^9 q M) v! X/ A: w6-10 自适应布局优化(PC端布局优化) F( h' l% N& s% j( e+ K+ t
6-11 自适应布局优化(书签支持鼠标事件)
1 \5 ` G# B$ S2 f. b6-12 阅读器分页算法实现/ B# m" m1 ~( o! \, J
6-13 阅读器相关知识点总结
% [$ [ t$ _- l& u7 L" F! \; o
! B+ ^6 Z: [9 x/ l9 @/ W: d第7章 书城首页、搜索页、列表页和详情页开发
# F8 j8 ]7 V }讲解书城首页、搜索页、列表页和详情页的开发过程,详细介绍首页的推荐动画、标题栏和搜索框的交互动画实现原理,并引入Mock.js实现API数据模拟。
5 _5 _0 R4 {* {5 i4 M6 Z. P7-1 书城开发需求分析6 d# W b' M, ?2 f
7-2 书城首页开发(框架页面+路由配置)
- X9 x% }) M7 L+ A$ B& L8 z8 a6 n$ Q7-3 书城首页(标题+搜索框布局)" v% g! Q6 ^8 H) I2 S6 e
7-4 书城首页(标题+搜索框交互设计分析)
6 S9 b0 I: ^6 |) ~7-5 书城首页(标题交互动画实现) 试看
( w; o! w% N3 W7-6 书城首页(搜索框交互动画实现)* W: ^6 X) t+ r7 m
7-7 书城首页(热门搜索布局). ^) U; {+ k( ^. H) D
7-8 书城首页(热门搜索交互)3 ]0 E) |- _2 ]
7-9 书城首页(推荐页面布局). p' m) D6 }' y, c$ g
7-10 书城首页(卡片翻转动画实现)4 l& K+ [7 u8 ]4 ~% @+ _% G
7-11 书城首页(卡片翻转动画重置)
% \" T6 B e* H8 X& c7-12 书城首页(卡片登场keyframes动画讲解)* ~- }+ N1 [, m- b. a5 k7 F% p
7-13 书城首页(烟花动画实现)
" t$ k5 |- S; b: l4 h6 P7-14 书城首页(mockjs使用方法讲解)9 g8 G$ ?: N7 z) T3 B e% W
7-15 书城首页(推荐图书布局+动画): f! F' O, Z! a0 N: b/ F
7-16 书城首页(首页图书布局实现)
# ^ v' B3 [! p4 \/ x! q( y7-17 书城详情页开发5 X3 r* D! [. S% c# [, R7 L5 B
7-18 书城列表页开发1 O+ R4 M# @( b2 M2 z. P
7-19 第七章总结
* d% W+ t# x" Q+ k, Y9 s4 t" Q" S ~0 s( P+ C+ o
第8章 书架页面开发
' _' s. i: V/ S! Z0 F讲解书架页面的开发过程,包括:书架数据结构设计、九宫格布局的实现、私密阅读功能实现、离线存储功能实现、分组功能实现、移出书架功能和动画实现。
/ c# ^; z6 a: u7 v8-1 书架标题组件布局实现
# G$ k, K* ^3 T* {8-2 书架标题组件交互实现
( ^9 P: L5 [; T. F9 I8-3 书架搜索框布局实现" @% F5 F9 `' f: ^6 h2 d
8-4 书架搜索框交互实现(上)
1 |9 v; [8 e0 X6 T( P7 c M3 q8-5 书架搜索框交互实现(下)
$ @- B4 ?% c+ Y+ O& i% c8-6 书架数据结构设计+数据获取
% E7 \ Y n( |8 a7 I8-7 书架标题+搜索框样式优化(固定标题+滚动阴影)/ U; }# D* x8 y" s
8-8 书架图书列表实现(组件设计+动态组件应用)
+ Q, D( _3 C) N7 ^8-9 书架图书列表布局7 M3 e, u2 g% E1 w9 }* H8 v8 p
8-10 书架图书组件开发(单书封面+分类书籍封面实现)
; i& c/ a) ^0 v: {* l- H1 {8-11 书架图书组件开发(添加+编辑实现)
! F! y6 C) w8 M/ A+ R2 u7 L8-12 书架编辑模式开发) M8 g8 w& B5 [3 k3 D& I: M
8-13 书架弹出框组件开发 X! K) C0 k9 {% ~1 l1 |- y% P5 H9 K3 ?
8-14 书架弹出框功能开发(1)
{- N! F( {: t4 [- L8-15 书架弹出框功能开发(2)! m7 @! i7 O* L4 q" W4 h; m( s
8-16 电子书离线缓存功能开发(1)0 w( B {- A7 w4 N e1 K
8-17 电子书离线缓存功能开发(2)
; D5 u6 A% W* z& y' n8 ?2 G8-18 电子书缓存删除功能开发7 V( O0 t9 T( O( f1 R/ |" [
8-19 书架缓存+离线阅读功能开发
; i; P3 W! o5 s5 C5 e% e" Q8-20 书架分组功能开发( ?- {) W" B1 R! i( v8 l& T, Z
8-21 书架列表过渡动画开发3 I- n; j/ E7 d9 e
8-22 书架分类列表开发
- V: Z1 p* z& {% ^. P4 @' {8-23 书架分组功能优化
6 o& Z% U! U/ A* `( E+ h# ^8-24 书架修改分组功能开发(1)) c6 ]3 r' f! F: a
8-25 书架修改分组功能开发(2)
& s: V) Y6 p: ]- |' J3 O+ x+ s. y5 i) W4 A, o) A6 _
第9章 听书页面开发
! s7 }) n9 {# d8 m! R1 R讲解听书页面的开发过程,详细讲解科大讯飞在线语音合成API的对接方法、播放器面板的布局实现、播放器的实现原理和方法。6 k# \; N. G% u* i' p' l+ h' F5 @2 G
9-1 听书功能介绍
' l) c) f- \( a9-2 听书组件集成
# ]* i1 z! f. M" ^! c- d$ z' }9-3 听书组件源码分析5 j+ |4 A. U a- p5 A
9-4 听书播放器源码分析. g' W; n7 q' p& F& j
9-5 播放器面板源码分析
/ {' Z2 v3 I, u c) u. {1 }9-6 听书功能开发要点总结7 r4 |; Q$ V2 f D3 ~# A
& u( u; l. l, \0 \$ Q/ e第10章 项目发布, e H( h: i: P. D9 B: u8 m
利用Node.js开发简单的api,并通过阿里云的ESC进行项目发布,在CentOS操作系统上搭建Nginx服务,将代码上传至Git,通过编写自动化更新脚本实现代码的自动更新与发布。8 F5 L( X8 D' h) e# ]+ j, U
10-1 Vue项目构建1 A$ _* D& f1 x: h' x6 {
10-2 功能优化+构建问题处理
; x0 R1 v- D9 X+ a3 r- Y10-3 数据库环境准备
2 i N3 \! w. f10-4 Node.js+express编写API' [& @5 D" G- e$ \
10-5 书城首页API开发(1)
H1 s; U' H$ [ u) O10-6 书城首页API开发(2)
/ P$ R7 X! `$ x% ^10-7 书城首页前后端API联调(解决CORS跨域)" m1 `2 B7 _) C1 C+ Z
10-8 电子书详情API开发* k; w/ S! ~4 x- J
10-9 电子书列表API开发2 T+ ~7 U' T9 I3 {, o( P+ `3 O5 O
10-10 科大讯飞在线语音合成API对接(上)& [- c$ ]) [# y# P* K: \
10-11 科大讯飞在线语音合成API对接(下)/ E% K- n, m: K2 y4 {$ h& Q
10-12 后端API源码上传git演示
# i+ O t1 b) X7 t7 t6 c- g10-13 阿里云ECS服务器开通* i# Z0 E! D1 Q+ c7 s
10-14 CentOS Node.js环境搭建9 k. o4 |0 ~# B! A: F
10-15 CentOS Ngnix环境搭建- p# p' z. G6 u8 B
10-16 CentOS git部署+免密更新" {9 o* M) R; [' y
10-17 CentOS 前端项目构建和发布3 V2 N& y+ f0 [) @- L9 s& B$ R
10-18 CentOS MySQL环境安装- w7 V, g7 h6 _6 `) z( T) ^0 Y8 e# P
10-19 CentOS 一键部署脚本开发. O1 a, w g; C( [5 ~
10-20 阿里云域名注册、解析与备案流程6 g3 i9 C9 E/ |/ l. Q# d1 w
1 N" i8 s }" w7 q$ I( B第11章 课程总结
) M& S4 O' ^* D' \# o整理回顾与总结课程中的知识点。0 f2 ~. c2 ~3 G! w& h( @4 t
11-1 课程总结/ [* b: [! J/ W
: Z9 K" }3 |4 D
〖下载地址〗3 s$ F: ?$ d" Q! s2 N0 W' K9 M0 m
3 q7 u2 |5 n% q6 o! Q
; }+ T/ j8 v5 L----------------华丽分割线-------------------------华丽分割线-----------------------华丽分割线-------------
# B4 o6 `/ }) l! \; C8 w6 T
* N6 n q0 \' ~〖下载地址失效反馈〗' N6 h) B m) Y8 a' _; @; `
如果下载地址失效,请尽快反馈给我们,我们尽快修复。请加QQ邮箱留言:2230304070@qq.com8 @& o2 t, E. Z8 J* o) }- v( w
" \) V; E1 o* \$ z7 ^6 E9 K: @
〖升级为终身会员免金币下载全站资源〗
& u4 ?) m4 i5 \( `& R" ~全站资源高清无密,每天更新,vip特权了解一下:http://www.mano100.cn/rjyfk_url-url.html( H* F( Q( P( ]7 f% h% a
) ~ O6 o, ]5 N7 ]6 P# d〖客服24小时咨询〗
& W/ U) i8 W* l: I* O5 q3 E: w有任何问题,请点击右侧QQ邮箱:2230304070@qq.com 咨询。
& w) n3 r: P9 T+ }
& V6 n# p: P/ u7 `( X) d |
|