资讯专栏INFORMATION COLUMN

一个vue+express+nodejs爬虫构建的伪整站移动书城

levius / 2654人阅读

摘要:数据有了,接下来该构建了,谷歌了一下发现用好像不错,于是又学习了部分,构建了所需的。采用分离的写法,分开写,方便维护。另外本项目中还写了一些可直接迁移使用的组件比如组件左右弹出层的背景阴影组件。最后上点项目截图界面是抄起点的

项目地址:点击

预览地址:点击

api地址:点击

爬虫地址:点击

技术栈:vue + vue-router + vuex + webpack + axios + less + flex + express + nodejs + mysql + localStorage

这个项目很早以前就开始写了,算是用vue写的第一个项目,应该比较符合新手学习。所以代码还是有不少问题,但是应该很符合vue入门使用者的写法,比如直接修改state:this.$store.state.xx = xx。

最开始是用jQuery写了阅读器部分,后来为了学习,就尝试用vue重构,学习了整个vue技术栈。
后来想想阅读器写好了,没有书可不行,想想应该用爬虫爬点数据,于是各种查找node爬虫的资料,写了不少爬虫。

数据有了,接下来该构建api了,谷歌了一下发现用express好像不错,于是又学习了express部分,构建了所需的api。

有的同学刚开始学习vue的时候可能有点茫然,不光是vue本身的用法、api、组件等等,查资料后发现还有vue-router、vuex等等需要学习。

本项目就是那个阶段写的第一个比较完善的vue项目,现在才拿出来是因为中间有不少事耽搁了,如果你想看代码,可能会发现不少地方跟自己写得很像,一共只有四个路由,够简单吧,但是用到的东西在其他复杂应用中也是必需的,仔细想想其实vue也就那么点东西,多写就容易了。

vue-router方面,常用的内容基本都用到了,比如
动态路由、编程式导航、命名路由、重定向、数据获取时的loading、懒加载等等。

vuex采用分离的写法,state、mutation、action分开写,方便维护。

另外本项目中还写了一些可直接迁移使用的组件、比如loading组件、左右弹出层的背景阴影组件。

最后上点项目截图





PS:界面是抄起点的

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/83920.html

相关文章

  • 使用react技术栈完全重写一个vue书城项目

    摘要:本项目是在之前一个项目基础上,用技术栈重写的一个书城项目版本地址本项目地址预览地址项目说明本项目是一个构建的移动书城项目,数据是通过爬虫爬取,存储在中,项目通过构建,前端部分是技术栈。 本项目是在之前一个vue项目基础上,用react技术栈重写的一个书城项目 vue版本地址 本项目地址 预览地址 项目说明 本项目是一个react + nodejs + mysql构建的移动书城项目,...

    aaron 评论0 收藏0
  • 2017年2月份前端资源分享

    平日学习接触过的网站积累,以每月的形式发布。2017年以前看这个网址:http://www.kancloud.cn/jsfron... 1. Javascript 前端生成好看的二维码 十大经典排序算法(带动图演示) 为什么知乎前端圈普遍认为H5游戏和H5展示的JSer 个人整理和封装的YU.js库|中文详细注释|供新手学习使用 扩展JavaScript语法记录 - 掉坑初期工具 汉字拼音转换...

    lily_wang 评论0 收藏0
  • 2017年2月份前端资源分享

    平日学习接触过的网站积累,以每月的形式发布。2017年以前看这个网址:http://www.kancloud.cn/jsfron... 1. Javascript 前端生成好看的二维码 十大经典排序算法(带动图演示) 为什么知乎前端圈普遍认为H5游戏和H5展示的JSer 个人整理和封装的YU.js库|中文详细注释|供新手学习使用 扩展JavaScript语法记录 - 掉坑初期工具 汉字拼音转换...

    chengjianhua 评论0 收藏0
  • 2017年2月份前端资源分享

    平日学习接触过的网站积累,以每月的形式发布。2017年以前看这个网址:http://www.kancloud.cn/jsfron... 1. Javascript 前端生成好看的二维码 十大经典排序算法(带动图演示) 为什么知乎前端圈普遍认为H5游戏和H5展示的JSer 个人整理和封装的YU.js库|中文详细注释|供新手学习使用 扩展JavaScript语法记录 - 掉坑初期工具 汉字拼音转换...

    Anonymous1 评论0 收藏0
  • 2017年2月份前端资源分享

    平日学习接触过的网站积累,以每月的形式发布。2017年以前看这个网址:http://www.kancloud.cn/jsfron... 1. Javascript 前端生成好看的二维码 十大经典排序算法(带动图演示) 为什么知乎前端圈普遍认为H5游戏和H5展示的JSer 个人整理和封装的YU.js库|中文详细注释|供新手学习使用 扩展JavaScript语法记录 - 掉坑初期工具 汉字拼音转换...

    dreamtecher 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<