F2e踩坑之路让前端飞Vue.js开发技巧

vue技术栈

2017-12-21  本文已影响593人  5fc9b6410f4f

Vue2 实战:模仿卖座电影

一个使用 Vue2 全家桶高仿卖座电影网的项目


进阶 vue 全家桶


本项目可以作为一个前端 vue 进阶项目


Vue.js - 起手式


请各位读者添加一下作者的微信公众号,以后有新的文章,将在微信公众号直接推送给各位,非常感谢。 0x00:前言 这次前言不想扯太多。 本文主要是记录一下自己的学习历程,顺带做一个总结。 其中有参考 Vue.js 的中文文档,也有去查看其它大大们给出的总结。 最后也是一个期盼,希望…


[vue 最新实战] gank 客户端(vue2 + vue-router2 + vuex +webpace + es6)新手福利,干货多多


本项目是基于 vue2 最新实战项目,是适合新手进阶的绝佳教程。代码简单易懂,注释多多。实现了移动端使用最多的 无限滚动,图片加载,左右滑动,等待。先发布预览版本,后面更多更全的功能和教程将会陆续发出。


karma+webpack 搭建 vue 单元测试环境


最近做了一次关于 vue 组件自动化测试的分享,现在将 vue 组件单元测试环境搭建过程整理一下。这次搭建的测试环境和开发环境隔离,所以理论上适用所有使用 vue 的开发环境。


Vue.js 学习系列二 —— vuex 学习实践笔记(附 DEMO)


本文介绍了作者在学习 vuex 过程中所获的经验,用简洁的语言解释 vuex 的用法


Vue + webpack 项目实践


最近在内部项目中做了一些基于 vue + webpack 的尝试,在小范围和同事们探讨之后,还是蛮多同学认可和喜欢的,所以通过 blog 分享给更多人。


使用 vue2+Vuex+Router 重写饿了么点餐系统和 vue 插件简析


最新写的 Demo,技术分享


vue2 + vuex 高度还原饿了么 App,与官方后台真实数据交互,获取商品信息,实现登陆、购物车、下单等功能


vue2 + vuex 高度还原饿了么 App,与官方后台真实数据交互,获取商品信息,实现登陆、购物车、下单等功能


用 VUEJS 做一个网易云音乐


VUEJS 写的一个小项目,求 star


Vue 2.0 服务端渲染怎么玩?


Vue 2.0 发布了也有一段时间了,新版本比较大的更新就是支持服务端渲染,最近有空折腾了下 Vue 的服务端渲染,记录下来。


vue+node 实现的一套博客系统, 包括博客前端展示页和博客后台管理页


一个完整的博客系统


使用 Vue.js 实现论坛客户端


一个 Vue.js 练习项目,从零开发到部署上线,代码开源在 https://github.com/crazy0x/vue-nga,本文主要记录了项目中遇到的一些问题以及使用 docker 进行打包部署的主要过程。


搭建 vue+webpack+mock 脚手架(一)


本文适合第一次搭建项目的朋友,讲讲我是怎么从零开始摸索着搭建一个项目框架的,属于总结归纳性质的文章。

  1. 基于 vue 的多页应用
  2. 支持自定义 mock 数据
  3. 支持热加载
  4. js 打包成多个


    适用于 vue-cli 的,用于编写 vue 组件的项目模板

适用于 vue-cli 的,用于编写 vue 组件的项目模板


全栈开发实战:用 Vue2+Koa1 开发完整的前后端项目


本文从一名新手的角度(默认对 Vue 有了解,对 Koa 或者 Express 有了解)出发,从 0 开始构建一个数据通过 Koa 提供 API 的形式获取,页面通过 Vue 渲染的完整的前端项目。可以了解到 Vue 构建单页面的一些知识以及前端路由的使用、Koa 如何提供 API 接口,如何进行访问过滤(路由)、验证(JSON-WEB-TOKEN)以及 Sequelize 操作 MySQL 数据库的一些知识和技巧,希望能够作为一篇入门全栈开发的文章吧。



2017 Vue.js 2 快速入门指南


2017 Vue.js 2 快速入门指南翻译自 Vue.js 2 Quickstart Tutorial 2017 从属于 Web 前端入门与工程实践。Vue 与 React 都是非常优秀的前端界面辅助库,笔者在工作中使用 React 会多一点,不过在学习 Vue 的过程中也得到了很多启发。Vue 和 React 在功能的完备、社区的活跃与性能的比较上笔者觉得毋庸多言,不过从笔者个人来看觉得二者的某些优势也是其劣势。Vue 是渐进式的 JavaScript 库,可以在项目扩展的过程中逐步添加所需要的模块,但是相对约束就较弱,并且强耦合于基于 DOM 的 Web 平台。React 则是更多的关注于跨平台与大型 Web 应用的工程实践,但是学习曲线比较曲折,入门门槛相对较高,对于活动页、移动 Mobile 也有点过重。详细讨论参考笔者的 2016 - 我的前端之路: 工具化与工程化。


Vue.js 学习系列四——Webpack 学习实践


要想学好 Vue 组件化开发,必先对 webpack 有充分的了解。


3-vuejs2.0 实战:仿豆瓣 app 项目,创建 Swipe 图片轮播组件


swipe 图片轮播不管是在 pc 端,还是移动端都是常见的效果,在这一章将用开源插件 swiper 完成一个比较简单的 swipe 循环轮播组件


Vonic 2.0 全新文档站上线


just title。


VueJS 组件编码规范


VueJS 组件编写规范,组件编写,从规范开始。


Keen UI - 基于 Vue.js 的 Material Design 前端组建库


支持几乎所有 Material Design 基础样式,代码组建格式优美


Vue.js 学习系列三——axios 学习实践


本文介绍了 Vue 推荐网络通讯库 axios 的使用


基于 vue2 + vuex 构建一个具有 45 个页面的大型单页面应用


vuejs 目前为止最大的开源单页面项目


这可能是目前最新的 Vue 相关开源项目库汇总


在 Github 上做了一个很新的 Vue 相关开源项目汇总。对 Vue 开发感兴趣的欢迎 Star ,后续也会定期维护更新这个列表。当然,你也可以去 opendigg 上查看。



掘金阴明:后端渲染实践


Vue.js、React.js 及 Angular.js 等等前端开发框架引入了 UI = framework(State) 的前端编程逻辑,大范围降低了前端业务开发的难度,尤其是面向复杂前端应用。而这些优质开源框架的普及、多端业务统一、前后端分离的需求让越来越多的架构设计将大部分业务逻辑写在了前端。

但是,纯前端产品也有着它的问题。上述的几个前端框架都支持了后端渲染的功能,从而融合了前后端的问题。如何有效地整合现有前端逻辑实现后端渲染、如何优化后端渲染性能、如何实现服务器流式吐内容更快地渲染页面的经验,会成为新一代 Web 开发的方向,提高前端业务开发的效率。在由七牛云主办的 ECUG 十周年盛会上,阴明为大家带来了他的实践分享。


webpack -> vue Component 从入门到放弃(二)


上一篇简单介绍了 webpack 的打包功能,应该说是比较无意义的打包,对于开发人员来说,这种效率是非常低的。所以我们来点升华。


简约至上,美炸了的 Vue 圆环菜单组件


一个开源的基于 vue 写的圆环菜单,可自定义多种了类型和动画,追求一中简约的风格


从零搭建 vue2+vue-router2+webpack2 工程


适合新手,vue-cli 可以很方便的初始化一个工程,但是如果想自己动手从零搭建一个工程该如何开始?这篇博客提供了非常详细的步骤。


[使用 Weex 和 Vue 开发原生应用] 0 项目介绍和文章目录


Weex 和 Vue 已经互相支持,Vue.js 也因此具备了开发原生应用的能力。Vue 官方仓库中包含了适配 Weex 平台的代码,Weex 也引入了 Vue Runtime 并集成进了 SDK 中,第一个支持 Vue 的 WeexSDK 版本是 v0.9.5,后续版本也都将会支持,建议保持更新。


从 react-start 到 co 源码 (三)


这是一个系列文章,分为三篇。主要介绍了 react 开发环境的简单搭建,react 开发环境脚手架开发以及 co 的源码分析。这是系列的第三篇,主要对 co 源码进行的简单分析。


基于 vue2.0+axios+vue-router 的斗鱼项目


调用斗鱼的 API 编写的


手把手教你用 es6+vue2+webpack2+vue-router2 搭建个人 blog


手把手教你用 es6+vue2+webpack2+vue-router2 搭建个人 blog


Vue.js 组件库 Rubik UI 开发心得总结


Rubik UI 是一套基于 Vue 2.0 和 Material Design 开发的桌面端、移动端组件库


webpack -> vue Component 从入门到放弃(三)


离上一篇已经一个星期了,人的拖延症是没法救的,今晚趁着蒙蒙春雨,来抒发抒发情感。上一篇简单介绍了 webpack 的配置,这里稍微再做一一下延伸


vue.js 异步组件


一个跑得起来的案例,快速了解异步的 vuejs 组件


Rubik UI 一个 Material Design 风格的轻量 Vue.js 组件库


一个基于 Vue.js 2.0+ 和 Material Design 规范 的开源 UI 组件库


Vuex2 与 Axios 开发


Vuex2 与 Axios 开发的那点事


使用 vue.js 构建一个知乎日报


使用 vue 全家桶搭建的一个知乎日报


高仿饿了么 app 商家详情 (vue 2 +vue-router 2 + es 6 + webpack )


高仿饿了么 app 商家详情 (vue 2 +vue-router 2 + es 6 + webpack )。


Vue.js 组件库 Rubik UI 开发心得总结


又一个基于 vuejs 的 ui 轮子


Vue.js 项目使用 Karma 做自动化 UI 测试


关于使用 Karma 做自动化测试的小结


2-vuejs2.0 实战:仿豆瓣 app 项目,创建组件 header,tabbar 路由跳转


vue 仿豆瓣 app 项目,创建组件 header,tabbar 路由跳转


paco-ui-vue:一套基于 Vue 的移动 UI 组件库


paco-ui-vue 移动端的 ui 组件
特性

使用单文件的 Vue 组件化开发模式
基于 npm + webpack + babel 开发,支持 ES2015
高质量、功能丰富
友好的 API ,自由灵活地使用空间


vuex2 实战之购物车


这是一个基于 vue2+vuex2 实现的购物车 demo,想学习 vuex 伙伴的可以来看看。


基于 vue2+vue-router+vuex2+axios+elementUI 做的自动化后台基础模板


此项目重点突出在于架构模式,基于这个模式,可以快速方便的开发出可维护性可拓展性的后台项目。


Vue2+Echarts 实现多种图表数据可视化 Dashboard 详解(附源码


将数据通过图表的形式展现出来将大大的提升可读性和阅读效率
本例包含柱状图、折线图、散点图、热力图、复杂柱状图、预览面板等


Vue-Cli + ElementUI 试水感受


春节前使用 Vue-cli + ElementUI 将以前的项目添加新功能后,在使用过程中产生的一些思路、坑还有疑惑,与大家分享一下


详解 Vue & Vuex 实践 - 某熊的全栈之路 - 知乎专栏


详解 Vue & Vuex 实践翻译自 Vue + Vuex — Getting started,承接自 2017 Vue.js 2 快速入门指南,从属于 Web 前端入门与工程实践。


Vue.js 富文本编辑器


A wysiwyg editor written in Vue.js and Vuex.js, only support Vue.js 2.x.x


Vue.js 学习系列一 —— vue-router2 学习实践笔记(附 DEMO)


记录了作者在学习 vue-router 过程中的经验,并附带学习 demo。


Vue 2.0 起步 (7) 大结局:公众号文章抓取 - 微信公众号 RSS


综合应用 Flask、Vue 实现微信公众号文章的抓取


Vue-Blu 发布啦!基于 Vue2.x 和 Bulma 的 UI 组件库


Vue-Blu 是一款基于 Vue2.x 和 Bulma 的 UI 组件库。目前已有近 30 个组件, 基本覆盖常见的场景。后续也会不断完善和增加。特点是基于 Bulma css 框架,本身具有了很好的布局和样式的基础、支持定制化、 API 友好、灵活。是前端快速开发的利器!


vue 2.0 用 cNode 社区的接口编写的单页面应用


1、Vue2.0 + Vue-Router+ Vuex + ES6
2、有做响应式布局
3、搜索框用百度搜索 API
欢迎大家来 issue,若对大家有帮助的话,还望 star 一波,哈哈哈!
个人技术博客 damonlw.github.io


Vue 2.0 起步 (6) 后台管理 Flask-Admin - 微信公众号 RSS


Flask-Admin 权限管理 定制显示格式 显示关系表外键内容 显示多对多 (M2M) 内容


Vue 单元测试 case 写法


书接上文,karma+webpack 搭建 vue 单元测试环境介绍了 vue 单元测试环境搭建及查看源文件的测试覆盖覆盖率。今天来说一下 vue 单元测试思路和 case 的写法。测试框架使用 jasmine,语法参考。

上一篇下一篇

猜你喜欢

热点阅读