用VUEJS做一个猫眼电影web app

时间:2024-07-24 08:36:26

  之前一直在学习原生js,可是发现原生js虽然很好,但是想实现一个稍微复杂一点的项目都很麻烦。直到遇见了vue.js,发现vue是真的很好用,而且很简洁,利用组件化开发能够快速做出项目,所以为了学习vue,我决定利用豆瓣电影的api做个电影查询web app,说干就干!

  首先看一下demo: https://zhixuanziben.github.io/gouyan-demo/dist/index.html#/inTheaters

  github地址:https://github.com/zhixuanziben/gouyan-movie-vue

  用VUEJS做一个猫眼电影web app

  技术栈:

    HTML5 + CSS3 + JavaScript + es6 + vue + vue-router + vue-resource

     由于数据都是直接从豆瓣api获取的,所以并不需要考虑太多的数据存储和共享问题,因此没有使用vuex。

  项目截图:

    用VUEJS做一个猫眼电影web app用VUEJS做一个猫眼电影web app用VUEJS做一个猫眼电影web app用VUEJS做一个猫眼电影web app用VUEJS做一个猫眼电影web app用VUEJS做一个猫眼电影web app用VUEJS做一个猫眼电影web app用VUEJS做一个猫眼电影web app

  功能分析:

    利用豆瓣api的接口获取数据,模仿猫眼电影制作的webapp,实现了当前热映电影,即将上映电影,电影详细信息,短评和长评论信息,影星个人信息,以及电影查询的功能。

所有的数据都是ajax请求得到,所有没有后台的支持,直接在前端发送ajax请求!

  主体目录:

  用VUEJS做一个猫眼电影web app

  

  github项目地址: https://github.com/zhixuanziben/gouyan-movie-vue

  目前只完成前端页面展示部分,后台功能将会持续田间。这个项目会一直更新!如果觉的不错就给个star吧!