前端

学习vue的一些资源

下图仅仅是给入门vue的同学一个参考,若有错误和建议欢迎指出 一些参考资料: 官方教程 什么是双向绑定 vue生态 vue 常用ui组件 使用webpack构建vue vue的小demo vue路由例子 vue跨组件通信的几种方法 Vue.js——60分钟快速入门 到底vuex是什么? VUE资源列表 Vue.js——60分钟组件快速入门(上篇) Vue.js——60分钟组件快速入门(下篇) 采用vue+webpack构建的单页应用——私人博客MintloG诞生记 在多页面项目下使用 Webpack + Vue *文章首发于公众号:研发课堂,

  • yubang
1 min read
前端

让我们一起拆解VUE

本文章仅仅写给后端或者准备学习vue的前端同学,大牛就忽略本文吧,因为本文只想无经验的同学快速入门vue。 什么是vue? vue就是一个js库,并且无依赖别的js库,直接引入一个js文件就可以使用,你就当它跟jquery差不多就好。 版本选择? 现在vue分为vue1和vue2这两个大版本,然而现在有一些基于vue的框架还不兼容vue2,不过自己折腾可以随意选择一个的,反正文档还算挺详细。 为什么我们要使用vue? 其实跟jquery差不多,都是简化我们的开发。例如我们可以用vue实现像后端模板渲染的功能,可以更加便捷的绑定dom事件,可以把一些页面的组件打包重复使用。下面我们看看如何简单粗暴的使用vue。 看我们如何优雅的使用vue当成模板引擎 后端的同学想必挺清楚模板引擎是什么玩意了,而对于刚入门前端的同学来说,往往渲染页面会使用字符串拼接(非常不推荐)或者dom的clone来动态生成html,但是这两种方法写法都很麻烦,而vue却能十分优雅的实现模板渲染这种功能。 我们拿官方的例子来看看,如下图: 我们可以看到,el里面跟jquery的元素选择标识符是一样的,这个就是选择要渲染的区域。

  • yubang
5 min read
前端

前后端分离的必要性

前后端分离之前 在前后端分离观点出现之前,我们往往都是后端直接使用后端模板引擎渲染出html页面,当然这个时候对于前端来说是异常痛苦的,他们不仅需要学习后端模板引擎的语法还得配置后端的开发环境。 前后端分离的萌芽 为了让前端无需配置后端开发环境和学习后端的模板引擎,一个简单的前后端分离方案出现了,它就是前端编写静态页面,然后通过ajax从后端拉取数据,然后渲染页面即可,而渲染方法往往就是拼接字符串或者使用js的dom操作。 前端模板渲染的进化 拼接字符串的方法对于后期维护来说是灾难性的,根本没有可读性。而js操作dom需要大量的代码量,对于开发效率来说是低效的。所以前端模板引擎应运而生,使用模板引擎往往只需要引入一个js即可,学习门槛也非常低,渲染出html之后,只需要替换特定的dom元素即可。 前端工程化 在前端进入ajax拉取数据,通过模板引擎渲染页面的时期之后。前端还存在一个亟需要解决的问题,就是多个页面之间往往存在重叠的部分,一开始前端是copy重叠部分代码到每一个页面,弊端也显而易见,就是这重叠部分一旦需要需改的话,每个页面都会被牵连到,这工作量是巨大的,这个时候前端打包技术出现了,

  • yubang
3 min read