fareise的博客

使用Vue.js搭建移动端购物车

进行Web开发，能实现基础功能，只是第一步。

一起来学ES6—let变量

介绍Promise概念和ES6中的用法

学前端，怎么能不会Linux服务器部署？

开始为大家回答各种Web前端问题啦～

手把手教你Web数据可视化平台搭建

讲解Flex Box 布局方式

p.p1 {margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Helvetica; -webkit-text-stroke: #000000}p.p2 {margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Helvetica; -webkit-text-stroke: #000000; min-height: 13

mongoose的一个快速上手教程～～～

前一段时间完成了一个数据可视化项目，由后台NodeJS＋Highcharts框架进行搭建。下面分享一下整个开发过程的流程，以及使用Highcharts框架的经验。一、数据的读取       由于数据库使用的是Mysql数据库，在NodeJS中，可以使用NodeJS中的mysql模块进行mysql数据库的相关操作，通过npm安装即可。       1.数据库基本配置   为了方便，我们最好先进行一个

模版对于前后端开发的分离十分重要，通俗的说，模版就是一种语法规则，前端在开发时只需要关注自己的部分，如样式、结构等。前端开发完成后，在需要进行后段数据渲染的时候，直接按照模版的特定规则，修改HTML代码的数据部分就可以了。这样可以使得前后端开发更高效，避免了前端依赖后端的情况。FreeMarker就是这样的一个模版，它针对的后台是Java。其工作流程为，前端通过HTML文件改造的FreeMarke

视频转码就是一个先解码，再编码的过程，从而将原来的视频转换成我们需要的视频。这种转换可能包括各式(mp4/avi/flv等)、分辨率、码率、帧率等。传统的视频转码中，很常用的工具是FFmpeg。FFmpeg是一套可以用来记录、转换数字音频、视频，并能将其转化为流的开源计算机程序。在nodejs中，也有FFmpeg，叫做node-fluent-ffmpeg。node-fluent-ffmpeg是一个

一、MongoDB必须理解的概念1.数据库：每个数据库都有自己的权限和集合。2.文档：一个键值对。3.集合：一组文档，即一组键值对。当第一个文档插入时，集合就会被创建。二、Mac下的MongoDB安装和启动1.使用brew进行安装：brew install mongodb。2.建立目录：mkdir -p /data/db。这样建立的是mongodb配置中的默认目录。3.设置/data/db的权限为

Grunt是现在非常实用的前端构建工具。所谓前端构建工具，就是可以帮助我们自动完成一些需要经常重复性的操作。比如代码压缩、代码合并等。除此之外，Grunt还有很多非常强大的功能，这些功能都得益于Grunt丰富的组件。

介绍Vue.js最基本的入门知识

1.concat()：将两个或多个数组合并成一个数组arrayObject.concat(arrayX,arrayX,......,arrayX)，返回一个新的数据，arrayX可以是数值也可以是数组如：var a = [1,2,3];   document.write(a.concat(4,5));2.join()：把数组中的所有元素放进一个字符串arrayObject.join(separat

一、基本结构index.html代码： {{ message }}app.js代码：new Vue({ el: '#app', //选定要使用vue的部分 data: { //定义数组，可以在该部分使用{{}}引用 message: 'Hello Vue.js!' }})二、双向数据绑定index.html代码： {{

异步编程其实很常见，特别是在出线Node.js之后，异步编程更是让很多开发者受益。那么回到最初的地方，传统的前端开发中如何实现异步编程呢？下面列举了js实现异步编程的四种方式。方法一：使用回调函数比如有两个方法f1()和f2()，f1()方法耗时较多，这时可以使用回调函数实现异步：function f1(callback){    setTimeout(function () {        /

1.数据绑定使用{{}}即可完成数据绑定，{{}}内也可以进行计算、逻辑判断、字符串运算等也可以为属性进行数据绑定，在引号内使用，如： ，在data中定义id＝1，就可以在这里绑定id为item-12.列表渲染使用wx:for后面接需要渲染的数组，示例如下： {{item}} // page.jsPage({ data: { array: [1, 2, 3, 4, 5] }

一、微信小程序项目基本结构微信提供了微信小程序专用的开发者工具必须文件：app.js/ app.json(配置文件) /app.wxss(样式文件)pages文件夹存放所有页面，每个页面的路径都要在app.json文件中配置，写在pages字段中每个页面由四个文件构成.js/.json/.wxss/.wxml，放在pages中的一个文件夹下.wxml是页面结构文件二、app.json文件app.j

一、let和constlet：声明变量，只在声明的块级作用域(大括号)内起作用［注意：let不向var那样可以自动提升］如果一个区块内存在let或const命令，该区块就被解析成封闭作用域（暂时性死区，必须先声明再使用）  ［所以一个区块内只要有let，就可能存在死区，就可能会出现变量声明使用顺序的错误］let为javascript增加了块级作用域ES6中在块级作用域声明的函数不能在外部被引用，但

一、video标签的基本属性1.autoplay=“autoplay”：规定一旦视频就绪马上开始播放2.control=“controls”：让浏览器为视频播放器提供默认的暂停、进度条等控件。如果设置了这个就不能使用自己定义的控件。3.width=“320” height=“240”：定义视频播放器的宽高。设置这个会让页面对视频播放器部分空间进行保留，入不设置一开始不会保留可能造成页面布局混乱4.

在搭建的环境基础上进行Demo实现。其中App.jsx用来定义组件，注意一个文件导出一个组件；main.js用来进行组件的渲染。最后利用webpack将源代码构建为index.js并引入index.html页面。Demo1：界面上显示秒表效果，实时更新定义组件部分：import React from 'react';//定义组件class Demo1 extends React.Compone

webpack是一个前端模块构建工具，它能够将原本一些有依赖关系的文件（源代码）构建成静态资源。1.webpack安装$ npm install webpack -g //进行全局安装$ npm install webpack --save-dev //进行项目本地安装$ npm install webpack-dev-server --save-dev //安装webpack-de

1.准备：配置好Node环境，并且安装npm工具2.安装依赖包npm install babel -gnpm install webpack -gnpm install webpack-dev-server -g上面这三个依赖包都需要安装到全局，因为需要使用它们的命令行工具。其中babel是一个可以将ES6代码转换成ES5代码，这样我们就可以在编写代码的时候使用ES6的一些新特性了。webpa

本周在应用宝前端分享会上分享了Web实时通信技术，分享内容整理如下。一、传统Web数据更新传统的Web数据更新，必须要刷新网页才能显示更新的内容。这是浏览器采用的是B/S架构，而B/S架构是基于HTTP协议的。HTTP协议的工作模式就是客户端向服务器发送一个请求，服务器收到请求后返回响应。所以这种工作模式是基于请求显示数据的。这样的工作方式有其自身的好处，但是也会导致很多问题。在Web应用越来越火

一、什么是IOS应用唤起IOS中的应用唤起用来实现以下功能：在浏览器中可以通过某些方式打开IOS手机本地的app，如果该app没有安装可以跳转到该应用对应的App Store的下载页。 二、App store下载页连接App store中某个应用的下载页连接形如：https://itunes.apple.com/us/app/id399608199。在PC端浏览器打开该连接会跳转到应用详情页的PC

1.介绍为了让Web应用能够和服务器进程之间保持双向通信，这里介绍WebSocket接口。注意：This interface does not allow for raw access to the underlying network. For example, this interface could not be used to implement an IRC client without

1.MessageEvent接口在HTML5规范中定义的新的通信方式，无论是WebSocket还是SSE，包括实现视频、音频通信的WebRTC，都是基于HTML5规范中定义的一个接口：MessageEvent。这是一个基于消息的事件。首先我们可以看一下在JavaScript中，传统的事件类型有哪些。传统的DOM事件的基类主要包括：(1)UIEvents：一般化的UI事件，其中鼠标事件和键盘事件都继

1.EventEmitterNode中很多模块都能够使用EventEmitter，有了EventEmitter才能方便的进行事件的监听。下面看一下Node.js中的EventEmitter如何使用。(1)基本使用EventEmitter是对事件触发和事件监听功能的封装，在node.js中的event模块中，event模块只有一个对象就是EventEmitter，下面是一个最基本的使用方法：var

1.WebSocket和HTTP的关系WebSocket只有在建立握手连接的时候借用了HTTP协议的头，连接成功后的通信部分都是基于TCP的连接。总体来说，WebSocket协议是HTTP协议的升级版。2.研究WebSocket的思路服务器端自己实现WebSocket非常复杂。我们虽然不求能够完全自己实现，但是还是应该了解一下后端实现WebSocket的整体思路。WebSocket的实现主要分为两

一、概述1.Web端即时通讯技术即时通讯技术简单的说就是实现这样一种功能：服务器端可以即时地将数据的更新或变化反应到客户端，例如消息即时推送等功能都是通过这种技术实现的。但是在Web中，由于浏览器的限制，实现即时通讯需要借助一些方法。这种限制出现的主要原因是，一般的Web通信都是浏览器先发送请求到服务器，服务器再进行响应完成数据的现实更新。2.实现Web端即时通讯的方法实现即时通讯

1.如何让文字在容器内垂直居中？(1)方法：为容器添加line-height属性，使得line-height的值等于容器的height。(2)代码无标题文档 .container{ width: 300px; height: 500px; margin: 50px; background: blue; line-height: 500px; text

1.使用nodejs-websocketnodejs-websocket是基于node.js编写的一个后端实现websocket协议的库，连接：https://github.com/sitegui/nodejs-websocket。(1)安装在项目目录下通过npm安装：npm install nodejs-websocket(2)创建服务器//引入nodejs-websoc

一、Javascript中的正则表达式在Javascript中，可以使用RegExp对象构造正则表达。我们需要新建一个实例化的RegExp()对象，可以传入两个参数：第一个参数是匹配的模式，第二个参数是一个可选项，可以传入三种参数。i表示不区分大小写，g表示全局匹配，即匹配所有的符合条件的字符串，m表示执行多次匹配。实例如下：var reg = new RegExp("Hello", "i

最近整体学习了一下正则表达式的知识，发现还是在例子中进行学习效率比较高，接下来分享一下正则表达式的经典例子并进行相关知识点的总结。例子1：匹配5-12位的数字：^\d{5,12}$首先介绍两个特殊符号，^表示字串开头，$表示字串结尾，这两个用来限定匹配的范围。接下来\d用来匹配一个数字，后面可以接一个{}，里面输入数字。当输入一个数字时，比如{3}，表示对数字进行3次匹配；当输入两

在阅读一本HTML5游戏开发相关书籍时发现一个很好的例子，通过这个例子可以对面向对象的开发进行更深入的理解。这个对象要实现的是：将一个CSS sprite中的图像绘制到canvas中。首先创建一个SpriteSheet对象，代码如下：var SpriteSheet = new function(){ this.map = { }; this.load = function(sprite

一、基本类型和引用类型概述js中数据类型的值包括：基本类型值和引用类型值基本数据类型：undefined;null;boolean;number;string引用类型值：保存在内存中，js不允许直接访问内存位置，因此时操作引用而不是实际对象二、如何检测数据类型1.基本数据类型的检测：使用typeofvar s = “AAA”;alert(typeof s);

一、横向条纹如下代码：background: linear-gradient(#fb3 20%, #58a 80%)上面代码表示整个图片的上部分20%和下部分20%是对应的纯色，只有中间的部分是渐变色。如果让中间的部分逐渐缩小，当中间部分变为0即上下两种颜色的七点和终点相同是，就没有了渐变而变成了两种颜色的色条:background: linear-gradient(#fb3 50