WebSocket

WebSocket

HTML5新特性之WebSocket
http://blog.csdn.net/liuhe688/article/details/50496780
在nodejs中使用websocket
https://github.com/websockets/ws

angular-websocket

angular-websocket
https://www.npmjs.com/package/angular-websocket
在angular工程中使用angular-websocket:

#index.html中 
#app.js中 angular.module('appmodule1', ['angular-websocket'])
#controller中
app.controller('UnitsReportsCtrl', function($scope, $websocket) {
        if(!$scope.ws) {
            $scope.ws = $websocket("ws://localhost:8181");

            $scope.ws.onOpen(function (e) {
                console.log('Connection to server opened');
            });
            $scope.ws.onMessage(function (e) {
                console.log('received',e);
            });
        }
        $scope.ws.send('test11');
}

目前WebSocket可以收发消息的类型有String、Blob和ArrayBuffer,后面两个主要用于收发二进制数据的,日常开发中使用String类型就足够了,如果想要发送自定义对象,只需将其转换成JSON字符串后发送,如果客户端和服务端是以JSON形式通信,客户端收到消息后在将其转换为JavaScript对象即可。

Blob

BLOB (binary large object),二进制大对象,是一个可以存储二进制文件的容器。
XMLHttpRequest 相关的数据类型:DOMString、FormData、Blob、File、FileReader这些类型,在XMLHttpRequest Level 2背景下,Ajax可以发送任意这些类型的数据。
可以在MDN Web API 接口页面中找到它们:https://developer.mozilla.org/zh-CN/docs/Web/API

Blob数据对象
http://blog.csdn.net/charlene0824/article/details/51340238
html上面通过websocket接收二进制图片数据并显示在页面上
http://blog.csdn.net/wushuang443/article/details/65442754
js中关于Blob对象的介绍与使用
https://www.cnblogs.com/wangfajing/p/7202139.html?utm_source=itdadao&utm_medium=referral
Blob/DataURL/canvas/image的相互转换,TypeArray、ArrayBuffer、Blob、File、DataURL、canvas的相互转换
https://www.cnblogs.com/jyuf/p/7251591.html
https://www.cnblogs.com/flicat/p/5337054.html

强类型数组

常用的Array并不是真正的数组,它其实是一个从哈希表扩展的结构体,因此Array可以提供push、splice等操作,但效率低。JavaScript中真正的数组是强类型数组。
由于现在JavaScript变得需要访问原始的二进制数据,这些底层的操作需要直接访问内存,因此引入了这些强类型的数组。
ArrayBuffer
Int8Array
Int16Array
Int32Array
Uint8Array
Uint8ClampedArray
Uint16Array
Uint32Array
Float32Array
Float64Array
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects

Android6.0

6.0权限

权限分为了普通权限和需要单独申请的权限.
http://www.jianshu.com/p/a51593817825
PermissionsDispatcher
https://github.com/permissions-dispatcher/PermissionsDispatcher
在运行时请求权限
https://developer.android.com/training/permissions/requesting.html

新技术

新语言 Kotlin
Android程序是运行在Java虚拟机之上的,因此从技术上来说,可以运行在JVM之上的一切都可 用于开发Android应用。现在已经有很多可以生成JVM能够执行的字节码的语言,其中一些语言开始崭露头角并逐步流行起来,Kotlin就是其中的佼 佼者。

新存储 Realm
Android平台有很多的orm框架可以对数据作本地存储,比如ormlite、greenDao、SugarORM等等,这些orm框架基本都是基于sqlite的。今天我要介绍的这个数据库Realm,是用来替代sqlite的一种解决方案,它有一套自己的数据库存储引擎,比sqlite更轻量级,拥有更快的速度,最重要的是跨平台,目前已有Java,Objective C,Swift,React-Native,Xamarin这五种实现。

网络通信
新的网络通信框架 Volley

新框架
RXJava,
订阅发布模式Otto,RXAndroid ,RXBus ,EventBus,android.database.Observable

Android应用获取通知栏权限是否开启–以及跳转到系统设置界面–解决方案
http://blog.csdn.net/qq_22637473/article/details/53466425

AngularJS

版本:
Angular2以后官方的称呼就叫Angular,不是Angular2,也不是Angular4,而1.x版本的老版本,叫AngularJS。

学习AngularJS 1.x:
https://hairui219.gitbooks.io/learning_angular/content/zh/chapter05_1.html

ng-app指令

一个AngularJS web应用中只能出现一个ng-app指令,它相当于main方法。
有两种写法,ng-app或者ng-app=”自定义的模块”,ng-app有一个默认的模块,ng-app=“自定义的模块” 是一个使用了自定义的模块,该自定义的模块继承了那个初始的默认的模块,可以调用初始的默认的模块的方法。
HTML5规范要求所有的用户自定义属性以”data-“开头,所以data-ng-app是符合HTML5规范的写法,用HTML Validator检查代码的时候,ng-app会报错,而data-ng-app不会。

控制器——controller

控制器——controller 是一种封装,是AngularJS设计模式的一种定义。
可以通过ng-controller指令来隐式为模板创建一个控制器,也可以通过$controller服务来创建一个控制器。
控制器的用于增强作用域,包括设置好作用域对象的初始状态,以及给作用域对象增加行为。
控制器通过AngularJS的另一个设计模式——依赖注入 来使用更多服务。比如$scope。可以将$scope理解为 页面与数据的高速通道、桥梁、连接、粘合剂,也就是控制器中定义的所有东西,想要反应到页面上,就必须通过$scope。

使用ng-init向controller中传递参数

使用ng-init向controller中传递参数,不能立即获取到,是因为 “the controller is being created before the variable is added to the $scope object”

<div ng-include="'modules/units/views/view.html"
     ng-controller="UnitsViewCtrl"
     ng-init="unitId = '123'">
</div>
$scope.setUnitId=function(unitId) {
    $stateParams.id=unitId;
    getData();
}
<div ng-include="'modules/units/views/view.html'"
     ng-controller="UnitsViewCtrl"
     ng-init="setUnitId('123')">
</div>

可以使用$watch,或者在ng-init中调用函数
http://corpus.hubwiz.com/2/angularjs/18608161.html

ng-template寄宿方式

<script type="text/ng-template" id="/tpl.html">
 Content of the template.
 </script>

angular.js 中 父级和 子集 controller 之间的通讯
http://yijiebuyi.com/blog/62f8daffb5c629e85de91ca0b3942985.html

AngularJs中的directive(一)
https://segmentfault.com/a/1190000007018923

$watch监听属性变动

$watch是一个scope函数,用于监听模型变化,当模型部分发生变化时通知。$watch函数会返回一个注销监听的函数。
示例:

$scope.multiModel = [];
var destroyWatch = $scope.$watch('multiModel.length', function () {
//如果不再需要监听,则注销。
destroyWatch();
})

angularjs-dropdown-multiselect

http://ngmodules.org/modules/angularjs-dropdown-multiselect

<script src="https://cdn.bootcss.com/angularjs-dropdown-multiselect/1.11.8/angularjs-dropdown-multiselect.min.js"></script>
angular.module('hxyclient', [
    'angularjs-dropdown-multiselect'
]).....
$scope.multiModel = []; 
$scope.multiModelOptions = [{id: 1, label: "text1"}];
<div ng-dropdown-multiselect="" style="float:left;" extra-settings="{ scrollableHeight: '500px', scrollable: true }"
     options="multiModelOptions" translation-texts="{buttonDefaultText:'选择属性',dynamicButtonTextSuffix:'选择属性',checkAll:'全选',uncheckAll:'重置'}"
     selected-model="multiModel" checkboxes="true">
</div>

ng-if中的ng-model值无效的问题

与其他指令一样,ng-if指令也会创建一个子级作用域,在ng-if中每个包含的元素都拥有自己的作用域,相对于控制器作用域来说,这个作用域属于一个子级作用域,所以要绑定控制器中的变量值必须添加$parent标识。

gulp编译后select控件缺失请选择项

查看编译后的html文件,发现option内容变成了

<option value>-- 选择所属工程 --</option>

在源码中把value的值由””(空白)修改为” “(空格)解决了问题。对取值做trim可使编译前的代码恢复正常工作。

<select ng-model="collector.projectId" ng-options="item.id as item.name for item in projects" required>
  <option value=" ">-- 选择所属工程 --</option>
</select>

指令

scope中不同类型配置,在html中传值的格式不同。
@ 直接传值 字符串单向绑定,
= 传引用,模型双向绑定,
& 方法绑定
bool值需要设置为=,如果出现值总是传不进去,尝试更换scope中的参数名。

app.directive('unitParaGroup', function() {
    return {
        restrict: 'E',
        templateUrl: 'modules/units/components/units.paraGroup.html',
        scope : {
            title : '@',
            unitData: '=',
            attributes:'=',
            column : '@',
        },
    };
})
<unit-para-group title="机组参数设定" attributes="analogSettingAttrs" unit-data="unitLastestData" column="{{unitParaGroupColumn}}" ng-if="!hideSettingGroup"></unit-para-group>

在angular1.5的版本之前,都是以directive作为组件化的形式,而directive本身是一个指令,而并非是一个组件,所以它并不能很好的承担组件这一个职责,所以google在angular1.5的版本中推出了component组件。

数据共享

在多个controller中共享数据的方式

  • 使用$rootScope
  • 使用service
  • 通过$scope的事件传播

要注意如果需要共享的数据是网络获取到的,并且多个controller同时发起请求,为了做到只需要一个实际请求即可,需要做请求状态判断处理。
在多个AngularJS controller之间共享数据
http://blog.51cto.com/xitongjiagoushi/1684429

双花括号:是angular内置的一种混合(Markup)指令,它会将表达式绑定到元素。
局部模板:模板片段
数据绑定是模型与视图间的自动同步,视图是模型的投影,当模型或视图改变时,它们会互相反映这种改变。

grunt或gulp Unknown provider: aProvider

多是因为使用了隐匿依赖,在代码压缩后会失效。解决办法,编写所有service、directive用数组注入。
http://tobato.iteye.com/blog/2116307

React Native

React Native

React Native 中文网
http://reactnative.cn/
https://facebook.github.io/react-native/
官方文档
https://facebook.github.io/react-native/docs/getting-started.html
http://www.jianshu.com/p/a4d16de07350
http://www.jianshu.com/p/7a4899bde137
http://www.reactnative.com/
react-navigation使用技巧
http://www.jianshu.com/p/2f575cc35780

To run your app on iOS:
   cd /Users/hycx/x_workspace/AwesomeProject
   react-native run-ios
   - or -
   Open ios/AwesomeProject.xcodeproj in Xcode
   Hit the Run button
To run your app on Android:
   cd /Users/hycx/x_workspace/AwesomeProject
   Have an Android emulator running (quickest way to get started), or a device connected
   react-native run-android

目前来说用rn对我来说最大的好处应该是同时开发android和ios,大部分代码通用,而且可以使用 code-push 来热更新。
https://www.zhihu.com/question/36722811

在Android手机上运行React-native项目时报错:unable to load script from assets ‘index.android bundle’ ,make sure your bundle is packaged correctly or youu’re runing a packager server

解决方案:
第一步:在 android/app/src/main 目录下创建一个 assets空文件夹
第二步:执行 下面这段命令

react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res/  

会发现 assets文件夹下多出两个文件
第三步:重新run程序。

总结:
index.android.bundle是用来调用原生控件的js脚本,每次改变了 index.android.js,都需要使用上面的代码片段更新index.android.bundle,然后打包才可以把新的index.android.js应用上,所以当没有index.android.bundle文件时,RN是无法运行的.

React Native BLE蓝牙通信
http://blog.csdn.net/withings/article/details/71378562?locationNum=3&fps=1
https://github.com/innoveit/react-native-ble-manager

安装chrome扩展程序: React Developer Tools
react-native run-android 命令只需要在手机上还没有安装项目软件时执行,如果已经安装了,只要在手机上手动打开app即可。
react-native start
ifconfig ,查看en0中对应的ip,
打开app,摇晃手机,或者按菜单,或者长按菜单键,打开帮助菜单,在Dev Settings/Debug server host & port for device中填写ip:port。

图片
安卓中使用资源图片:
把ic_launcher.png拷贝放到drawable-hdpi中,

学习React Native必看的几个开源项目
http://www.cnblogs.com/qiangxia/p/5584622.html

编译运行f8app
需要在android studio中安装 google repository 和 google play services,升级各种更新,修改compileSdkVersion等。
https://github.com/fbsamples/f8app/issues/154
http://www.jianshu.com/p/f7cb35436f9a
http://www.jianshu.com/p/3fd0203334fe

react-navigation 简单使用
http://www.jianshu.com/p/2ce08b92cf60
https://reactnavigation.org/docs/intro/
http://www.cnblogs.com/CrazyWL/p/7283600.html

StatusBar 使用
http://blog.csdn.net/mengks1987/article/details/71127885
http://www.hangge.com/blog/cache/detail_1613.html

SectionList
If you need sticky section header support, use ListView for now.

服务端消息框架

消息规范

JMS:Java Message Service,Java消息服务,是基于JVM消息代理的规范。
AMQP:Advanced Message Queuing Protocol,高级消息队列协议,也是一个消息代理的规范,它不仅兼容JMS,还支持跨语言和平台。2004年,摩根大通和iMatrix开始着手AMQP开放标准的开发。2006年,AMQP规范发布。2007年,Rabbit技术公司基于AMQP标准开发的RabbitMQ 1.0 发布。RabbitMQ采用Erlang语言开发。
AMQP与JMS不同,JMS定义了一个API和一组行为,而AMQP是一个线路级协议。线路级协议描述的是通过网络发送的数据传输格式,任何符合该数据格式的消息发送和接收工具都能互相兼容和进行操作,这样能实现跨技术平台的架构方案。
MQTT:物联网(Internet of Things,IoT)机器之间(Machine-to-Machine,M2M)的大规模沟通中使用传统的HTTP请求/回答(Request/Response)模式不再合适,取而代之的是发布/订阅(Publish/Subscribe)模式。这就是轻量级、可扩展的MQTT,即Message Queuing Telemetry Transport,消息队列遥测传输,是IBM开发的一个即时信息传输通讯协议,是一个客户端服务端架构的发布/订阅模式的基于TCP/IP的基于二进制的消息传输协议。在物联网开发中,MQTT不是唯一的选择,与MQTT互相竞争的协议有XMPP和CoAP协议等,MQTT如今已经成为OASIS规范。MQTT规范很简单,非常适合需要低功耗和网络带宽有限的IoT场景。
TCP/IP参考模型可以分为四层:应用层、传输层、网络层、链路层。TCP和UDP位于传输层,应用层常见的协议有HTTP、FTP、SSH等。MQTT协议运行于TCP之上,属于应用层协议,因此只要是支持TCP/IP协议栈的地方,都可以使用MQTT。

异步消息

异步消息中有两个很重要的概念,即消息代理(message broker)和目的地(destination),消息发送者发送消息之后,消息将由消息代理接管,再由消息代理负责保证消息传递到指定目的地。
目的地形式有两种:队列(queue)和主题(topic)。队列用于点对点(point-to-point)形式的消息通信,主题用于发布订阅式(publish/subscribe)的消息通信。队列中的消息一次取出即逝,主题形式的消息可以做到多次使用。

消息框架

ActiveMQ: Apache出品,是最流行的,能力强劲的开源消息总线,是一个队列项目,支持MQTT、AMQP等协议。ActiveMQ 是一个完全支持JMS1.1和J2EE 1.4规范的 JMS Provider实现,尽管JMS规范出台已经很久了,但是JMS在当今的J2EE应用中间仍然扮演着特殊的地位。

kafka同RabbitMQ,ActiveMQ等是分布式消息队列,或者叫分布式消息中间件,或者叫做一种MQ产品(Message Queue)。kafka不支持MQTT协议。

事件驱动框架

事件驱动框架的优势是耦合度很低、系统扩展性好,而且生产者无需关心消费者。事件驱动框架可理解为观察者模式的升级,而观察者模式是固定调用关系的解耦。

参考:
管中窥豹:一线工程师看MQTT,协议详解 http://blog.csdn.net/tangxiaoyin/article/details/76053348
MQTT-Node.js实现-Mosca简介
http://www.jianshu.com/p/8315acec4e6b
MQTT入门篇
https://zhuanlan.zhihu.com/p/20888181
物联网核心协议—消息推送技术演进
http://www.cnblogs.com/Free-Thinker/p/5559798.html
物联网MQTT协议分析和开源Mosquitto部署验证 mosquitto_sub -t topic_name
http://www.cnblogs.com/Free-Thinker/p/5559816.html
MQTT协议笔记之消息流
http://www.blogjava.net/yongboy/archive/2014/02/15/409893.html
MQTT协议通俗讲解
http://blog.csdn.net/u011216417/article/details/69666752

centos6.9下mosquitto搭建

1.下载libwebsockets和mosquitto
libwebsockets下载页面:https://github.com/warmcat/libwebsockets/releases
mosquitto下载页面:https://github.com/eclipse/mosquitto/releases
2.安装依赖
yum -y install gcc gcc-c++ openssl-devel c-ares-devel libuuid-devel wget cmake xmlto
3.增加websocket支持
cd /home
tar -zxvf libwebsockets-2.4.1.tar.gz
cd libwebsockets-2.4.1
mkdir bulid
cd bulid
cmake ..
make && make install
sudo ldconfig #If you’ve installed libwebsockets with make install then you probably just need to run sudo ldconfig to update the linker cache。
4.安装mosquitto
cd /home
tar -zxvf mosquitto-1.4.14.tar.gz
#添加websocket支持
修改config.mk文件以使后面编译的mosquitto文件支持websocket
cd mosquitto-1.4.14
找到mosquitto-1.4.14目录下的config.mk文件,把config.mk文件中的WITH_WEBSOCKETS:=no改为yes,如下:
# Build with websockets support on the broker.
WITH_WEBSOCKETS:=yes
#安装
make && make install
#如果安装过报错如下:
warning: failed to load external entity “/usr/share/xml/docbook/stylesheet/docbook-xsl/manpages/docbook.xsl”
compilation error: file manpage.xsl line 3 element import
xsl:import : unable to load /usr/share/xml/docbook/stylesheet/docbook-xsl/manpages/docbook.xsl
compilation error: file mosquitto.8.xml line 4 element refentry
xsltParseStylesheetProcess : document is not a stylesheet
make[1]: *** [mosquitto.8] Error 5
make[1]: Leaving directory `/home/mosquitto-1.4.14/man’
make: *** [docs] Error 2
,则修改/home/mosquitto-1.4.14/man/manpage.xsl中

修改为:
重新执行:make && make install
#如果执行程序时找不到libwebsockets的库文件,执行下面的命令为库做一下符号连接:
ln -s /usr/local/lib/libwebsockets.so.6 /usr/lib64/libwebsockets.so.6
#其它操作
groupadd mosquitto
useradd -g mosquitto mosquitto
#创建mosquitto.conf、pwfile文件
cd /etc/mosquitto/
cp mosquitto.conf.example mosquitto.conf
cp pwfile.example pwfile
cp aclfile.example aclfile
#mosquitto.conf修改配置如下,注意去掉每行前面的tab空白:

	# =================================================================
	# General configuration
	# =================================================================
	# 服务进程的PID
	pid_file /var/run/mosquitto.pid
	# 服务端口号
	port 1883
	# websockets端口号
	listener 9090
	# 添加websockets协议支持
	protocol websockets
	# 最大连接数,-1表示不限制
	max_connections -1
	# 服务进程的系统用户
	user mosquitto

	# =================================================================
	# Security
	# =================================================================
	# 不允许匿名用户
	allow_anonymous false
	# 用户/密码文件,默认格式:username:password
	password_file /etc/mosquitto/pwfile
	# 配置用户访问控制
	acl_file /etc/mosquitto/aclfile

	# =================================================================
	#Persistence configuration
	# =================================================================
	# 消息自动保存的间隔时间:默认30分钟往磁盘写一次,0表示mosquitto关闭才写到磁盘中
	autosave_interval 1800
	# 消息自动保存功能的开关
	autosave_on_changes false
	# 持久化功能的开关
	persistence true
	# 持久化DB文件
	persistence_file mosquitto.db
	# 持久化DB文件目录
	persistence_location /usr/mosquitto/

	# =================================================================
	# Logging
	# =================================================================
	# 4种日志模式:stdout、stderr、syslog、topic
	# 日志路径:none 则表示不记日志,此配置可以提升些许性能
	log_dest file /usr/mosquitto/mosquitto.log
	# 选择日志的级别(可设置多项)
	log_type error
	# 是否记录客户端连接信息
	#connection_messages true
	# 是否记录日志时间
	#log_timestamp true

#创建用户及密码,此处用户名是hthl_pub
mosquitto_passwd -c /etc/mosquitto/pwfile hthl_pub
输入命令后,控制台会提示输入新建用户的密码,连续输入两次密码后,则会生成一个pwfile文件。
注意:mosquitto_passwd -c 每次都只会生成只包含一个用户的文件,如果想在passwd.conf中存放多个用户, 可以使用mosquitto_passwd -b 命令:
mosquitto_passwd -b [最终生成的password_file文件] [用户名] [密码]
mosquitto_passwd -b /etc/mosquitto/pwfile hthl_sub 123456
mosquitto_passwd -D 命令删除一个用户
mosquitto_passwd -D [最终生成的password_file文件] [用户名]
#aclfile修改配置如下:

	#This only affects clients with username "hthl_pub".
	user hthl_pub
	topic write hthl/#
	# This only affects clients with username "hthl_sub".
	user hthl_sub
	topic read hthl/#

#创建存储目录
mkdir /usr/mosquitto
chown -R mosquitto /usr/mosquitto

5.启动 mqtt
mosquitto -c /etc/mosquitto/mosquitto.conf -d
6.推送测试
mosquitto_pub -h 127.0.0.1 -t topic1 -u hthl_pub -P 123456 -m “你好,世界!”
7.卸载
cd /home/mosquitto-1.4.14
make uninstall
reboot

8.Docker build file for mosquitto

sudo docker run -p 1883:1883 --name mosquitto --restart always -d ansi/mosquitto

https://hub.docker.com/r/ansi/mosquitto/

参考
http://www.voidcn.com/article/p-fjphobex-brk.html

mosquitto centos安装配置


http://www.cnblogs.com/littleatp/p/4835879.html

命令行发布测试:
mosquitto_pub -h localhost -t topic1 -u username1 -P password1 -m “你好,世界!”
命令行订阅测试:
mosquitto_sub -t topic1 -u username1 -P password1

Maven

主流的项目构建工具有:Ant、Maven、Gradle等。
Apache Maven是一个软件项目管理工具,基于POM(项目对象模型)的概念,管理项目的依赖、编译、文档等信息。
使用Maven管理项目时,项目依赖的jar包不必存在于工程内,而是集中放置在用户目录中的.m2目录中。

Apache Maven最初用于替代Apache Ant。相比Ant的指令方式,Maven采用了不同方式对项目进行构建进行抽象,比如约定源码、资源、目标文件的位置。

Maven中央仓库信息速查

http://mvnrepository.com/
http://maven.outofmemory.cn/

maven plugin中的概念

lifecycle:总任务,它是一系列的phase组成,它运行完后就得到了一个结果,中间的过程是phase完成的。
常见的lifecycle有 | clean | package ear | pageage jar | package war | site等等

phase:阶段任务,一个lifecycle可以包含任意个phase,phase的执行是按顺序的,一个phase至少绑定很一个goal,没有goal的phase是没有意义的。
常见的phase有package,install,deploy。

goal: 执行任务的最小单元,它可以绑定到任意个phase中,一个phase有一个或多个goal,goal也是按顺序执行的,一个phase被执行时,绑定到phase里的goal会按绑定的时间被顺序执行。

mojo: lifecycle与phase与goal都是概念,mojo才是做具体事情的,可以简单理解mojo为goal的实现类。

Maven的插件机制是完全依赖Maven的生命周期的,因此要先理解Maven生命周期。

Maven生命周期

Maven有三套生命周期,它们相互独立、负责软件工程的不同方面的工作。这三套生命周期分别是:

  • Clean Lifecycle 在进行真正的构建之前进行一些清理工作。
  • Default Lifecycle 构建的核心部分,编译,测试,打包,部署等。
  • Site Lifecycle 生成项目报告,站点,发布站点。

它们是相互独立的,可以仅调用clean来清理工作目录,调用site来生成站点。也可以直接运行mvn clean install site运行全部三套生命周期。

每套生命周期都由一组阶段(Phase)组成,我们平时在命令行输入的命令总会对应于一个特定的阶段。
例如运行mvn clean,这个的clean是Clean生命周期的一个阶段。Clean生命周期一共包含了三个阶段:

  • pre-clean 执行一些需要在clean之前完成的工作
  • clean 移除所有上一次构建生成的文件
  • post-clean 执行一些需要在clean之后立刻完成的工作

mvn clean中的clean就是上面的clean阶段,在一个生命周期中运行某个阶段的时候,它之前的所有阶段都会被运行,即mvn clean等同于mvn pre-clean clean,mvn post-clean 等同于 pre-clean clean post-clean。这是Maven很重要的一个规则,可以简化命令行的输入。

打包

使用mvn package进行编译打包时,Maven会执行src/test/java中的JUnit测试用例,使用参数-DskipTests和-Dmaven.test.skip=true可以跳过测试,这两个参数的主要区别是:
-DskipTests,不执行测试用例,但编译测试用例类生成相应的class文件至target/test-classes下。
-Dmaven.test.skip=true,不执行测试用例,也不编译测试用例类。

安装jar到本地Maven库

把生成的Jar文件放入本地库,以让其他项目使用。 /.m2/repository目录是Maven本地库的默认位置。
在项目目录下执行: mvn install
成功后输出:
[INFO] Installing /Users/hycx/i_workspace/yirui/yirui-common/target/yirui-common-1.0-SNAPSHOT.jar to /Users/hycx/.m2/repository/com/yirui/yirui-common/1.0-SNAPSHOT/yirui-common-1.0-SNAPSHOT.jar
[INFO] Installing /Users/hycx/i_workspace/yirui/yirui-common/pom.xml to /Users/hycx/.m2/repository/com/yirui/yirui-common/1.0-SNAPSHOT/yirui-common-1.0-SNAPSHOT.pom
[INFO] BUILD SUCCESS

mvn deploy:另外还可以把生成的jar放到远程仓库,例如可以用Sonatype创建一个私有的服务存放私有的jar。

打包时加入本地库

spring boot工程中pom.xml内容:

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>

<dependencies>
<!--local jar-->
<dependency>
<groupId>0</groupId>
<artifactId>0</artifactId>
<version>0</version>
<scope>system</scope>
<systemPath>${project.basedir}/lib/CCP_REST_SMS_SDK_JAVA_v2.6.3r.jar</systemPath>
</dependency>
</dependencies>

<!--springboot-1.5.x对应的springcloud的版本需要使用Camden.SR6-->
<dependencyManagement>
<dependencies>
<dependency>
<groupId>org.springframework.cloud</groupId>
<artifactId>spring-cloud-dependencies</artifactId>
<version>Camden.SR6</version>
<type>pom</type>
<scope>import</scope>
</dependency>
</dependencies>
</dependencyManagement>

<build>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
<!--指定includeSystemScope为true,打包本地库-->
<configuration><includeSystemScope>true</includeSystemScope></configuration>
</plugin>
</plugins>
</build>
</project>

Maven中模块间的关系

3种关系:继承、依赖、聚合。
继承是指子项目继承了父项目的Pom。
依赖即导入组合。
聚合是指一个聚合工程(aggregator),它也是Maven Project,其pom文件中打包方式(packaging)为pom。并且它引入了新的元素:modules—module,用来包含了多个子模块,每个子模块也是一个Maven Project。其pom内容示例如下:

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>

    <groupId>com.yirui.common</groupId>
    <artifactId>yirui-modules</artifactId>
    <version>1.0-SNAPSHOT</version><!--版本:聚合模块的版本和被聚合模块版本一致,如果被子模块继承,
这里就是唯一指定版本的地方-->

    <packaging>pom</packaging>

    <modules>
        <module>yirui-common</module>
        <module>yirui-common-database</module>
        <module>yirui-common-message</module>
        <module>yirui-common-security</module>
        <module>yirui-common-sms</module>
    </modules>

</project>

https://blog.csdn.net/wanghantong/article/details/36427411

在一些最佳实践中我们发现:一个POM可以既是聚合POM,又是父POM,这么做主要是为了方便。

pom文件配置说明

modelVersion: 表示pom文件的Maven版本。
dependency下scope:表示此类库在项目中的作用阶段范围,默认为compile,表示在编译和打包时都需要此类库。阶段分为编译、单元测试、打包、运行。scope 可选择项有compile、provided、runtime、test。
build:build下可以包含plugins,这些插件可以修改项目的构建方式。例如编译的java版本。

dependencyManagement与dependencies

dependencyManagement的特性:在dependencyManagement中配置的元素既不会给parent引入依赖,也不会给它的子模块引入依赖,仅仅是它的配置是可继承的。
dependencyManagement 元素用在父项目的POM文件中,用来统一模块间的依赖版本问题。子项目中可以引用一个依赖而不显示地指明版本号,Maven会沿着父子层次向上查找一个拥有dependencyManagement元素的项目,找到后使用在dependencyManagement元素中指定的版本号。
dependencyManagement里只是声明依赖,并不实现引入,因此子项目需要显示的声明需要用的依赖。
父项目中的dependencies被子项目全部继承。如果依赖只在某个子项目中使用,则可以只在子项目的pom.xml中引入,防止父pom的过于臃肿。

类似地,dependencyManagement 元素是用来管理插件的。

产品设计

商业计划书:BP

产品经理专业导读-李建忠

避免玩具项目

产品设计中的文档:
BRD:商业需求文档,制定方向,总监,VP来做,给决策人员,核心团队,VC看。制定战略,获取资源。
MRD:市场需求文档,制定产品,可能和BRD合并, 总监做,给市场研发运营职能部门看,研发看技术可行性,运营人员看资源调配。制定产品边界,建立共识。
PRD:产品需求文档,制定功能,给UI/UE开发看,产品经理做,制定功能细节。
ProtoType:线框图原型/高保真原型UI/UE:展现细节,产品经理或UI/UE实现,确定产品视觉和交互细节。

古董只能用来怀旧,不能用来使用。

微博早期只支持最多发一张图片。
要跟随产业规律,做早了死掉,做晚了没机会。
行业规律:去中心,自组织,碎片,快速。

书:
启示录-打造用户喜爱的产品
从0到1-开启商业与未来的秘密
精益创业-新创企业的成长思维
浪潮之巅-吴军著
失控-凯文凯利著
奇点临近-2045年,当计算机智能超过人类
人人时代-无组织的组织力量、
维基经济学-大规模协作如何改变一切。
定位-有史以来对美国营销影响最大的观念
创新者的窘境-就算我们把每件事情都做对了,仍有可能错失城池
免费-商业的未来
长尾理论
系统化思维导论
交互设计精髓
赢在用户-Web人物角色创建和应用实践指南
用户体验要互-以用户为中心的产品设计
设计心理学-日常的设计
Don’t make me think
重来-rework
人月神话
人件
消费者行为学
引爆点 Tipping Point
怪诞行为学
影响力
乔布斯传
facebook效应
腾讯传

要有产业基础,才不会人云亦云、飘忽不定。
iPhone4 2010年出现,微信2012,微软一些产品却按年出。

你的灯亮着吗?-发现问题的真正所在h1

axure

master 母版
http://www.woshipm.com/rp/420885.html

APP原型实战
http://www.maiziedu.com/wiki/prototype/app/
https://www.axure.com.cn
http://www.mobileui.cn/add-some-animation-effects-for-prototype-design.html

做移动应用有什么好的原型工具?OmniGraffle
https://www.zhihu.com/question/19688700

justinmind

justinmind学习站
http://www.jmstu.com/
justinmind中文网
http://www.jmfans.com/
justinmind零基础系列教程之编辑原型

justinmind零基础系列教程之编辑原型


MAC版JustinMind延长30天试用期的方法 justinmind破解

MAC版JustinMind延长30天试用期的方法 justinmind破解


名词对照:
master 母版
widget 部件
数据母版即数据库
母版即一个通用的模板

原型设计到底是用Justinmind还是Axure?

原型设计到底是用Justinmind还是Axure?

Axure学习笔记:手机APP微信读书原型设计

Axure学习笔记:手机APP微信读书原型设计

移动APP:2015 UI/UX 趋势,Material design布局未来!
https://www.iamue.com/7797
https://www.zhihu.com/question/24874514

在开始设计原型之前我们需要做的第一步是选择合适的设计分辨率,目前使用Axure设计移动端原型时普遍采用的是(宽)375px*(高)667px和(宽)414px*(高)736px两种分辨率尺寸,这两种尺寸分别是由目前主流的移动设备Iphone7和Iphone7 PLUS的屏幕分辨率尺寸等比缩放而定义出来的,同时也是Iphone7和Iphone7 PLUS的逻辑分辨率。

有朋友可能会疑惑在设计原型的时候为什么不直接采用移动设备实际的分辨率呢?因为这主要考虑到设计时的便携性,毕竟我们输出的原型主要是用于演示而不是视觉稿,所以不需要达到那么高的精度,另外如果按移动设备实际的分辨率进行设计,在对元件进行编辑和排版的时候会是一件很耗费时间的事情,同时也不方便在电脑浏览器上进行查看。

本人在进行原型设计的时候一般用的是375px*667px这个分辨率尺寸,因为Axure常用的元件默认的字号一般是14px或18px,这两种字号也刚好匹配Iphone7上常用字号的比例,而且这个分辨率尺寸在电脑浏览器上刚好一屏就可以显示完整。

http://www.woshipm.com/rp/692285.html?utm_source=itdadao&utm_medium=referral

阿里图标库
http://www.iconfont.cn/

web主题

主页

推荐:5款最好用的AngularJS程序构建框架
http://www.cocoachina.com/webapp/20150930/13625.html

16个良好的 Bootstrap Angularjs 管理后台主题
http://www.open-open.com/news/view/a364b

Mockplus

MindMaster

ProcessOn

 

效果图截图留存

Javascript

判断对象类型

#判断是Buffer
Object.prototype.toString.call(obj1) === '[object Uint8Array]'
#判断是Array
Object.prototype.toString.call(obj1) === '[object Array]'

JS判断字符串结尾

  String.prototype.endWith=function(endStr){
      var diff=this.length-endStr.length;
      return (diff>=0 && this.lastIndexOf(endStr)==diff)
  }

ES6中export及export default的区别:
但在一个文件或模块中,export、import可以有多个,export default仅有一个。
对于export default,导入的时候没有花括号;对于export,导入的时候有花括号;
http://blog.csdn.net/zhou_xiao_cheng/article/details/52759632

遍历对象

for (var key in obj){
      var value=obj[key];
    }

触发其它元素的点击

//IE浏览器
if(document.all) {
document.getElementById("clickme").click();
}
//其它浏览器
else {
var e = document.createEvent("MouseEvents");
e.initEvent("click", true, true);
document.getElementById("clickme").dispatchEvent(e);
}

MDN : Mozilla 开发者网络学习平台
https://developer.mozilla.org

slice与splice的区别
slice() 选取数组的的一部分,并返回一个新数组。
splice() 从数组中添加或删除元素。

数组

#插入元素 array.splice(pos, length, object);
#插入元素到数组头
array.splice(0, 0, “three”);
清空数组
array.length=0;
克隆数组
var clone = myArray.slice(0);

日期时间

var datetimeMonthAgo=new Date(new Date().getTime()-30*24*60*60*1000).toISOString();

合并对象

Object.assign(target, …sources),返回target。

正则

var reg = /url=\”(.*?)\”/g;
var arr = str.match(reg);//得到整个reg匹配的内容
var arr = reg.exec(data.value);//得到reg匹配的内容和子内容
str=arr[1].replace(/&/g,””);//使用正则做全部替换

Post提交方式下载文件
https://blog.fedepot.com/postti-jiao-fang-shi-xia-zai-wen-jian/

Vue

Vue学习要点记录:

Vue 实例暴露了一些有用的实例属性与方法,这些属性与方法都有前缀$,与代理的 data 属性区分。
Vue.js 没有“控制器”的概念。组件的自定义逻辑可以分布在这些钩子中。
钩子:create, mounted、 updated 、destroyed等。
在底层的实现上, Vue 将模板编译成虚拟 DOM 渲染函数。结合响应系统,在应用状态改变时, Vue 能够智能地计算出重新渲染组件的最小代价并应用到 DOM 操作上。如果熟悉虚拟 DOM 并且偏爱 JavaScript 的原始力量,也可以不用模板,直接写渲染(render)函数,使用可选的 JSX 语法。
Mustache语法,胡子语法:{{}}
v-bind:指令可以省略为一个冒号
v-click指令可以省略为一个@
模板内的表达式只能包含单个表达式,应只用于简单的运算。
计算属性:在computed中声明并实现属性值的计算方法。与methods的区别是:计算属性是基于它们的依赖进行缓存的。计算属性只有在它的相关依赖发生改变时才会重新求值。
大括号有时显示在界面上的原因,是因为框架未加载完成,使用v-text可以避免这个问题。

& 父级作用域: 传递进来的参数必须是父级的函数方法, 然后在指令中,通过 test() 获取到 传递进来的函数,这个还不够,还必须再执行一次 test()() 才是真正的执行这个方法。
@ 本地作用域: 只能传递字符串进来,对于方法或者对象是传递不进来的。
= 双向属性: 可以传递对象进来,也可以是字符串,但是不能传递方法。 同时可以在指令中修改这个对象,父级里面的这个对象也会跟着修改的。

手摸手,带你用vue撸后台 系列一(基础篇)
https://segmentfault.com/a/1190000009275424#articleHeader16

vue-element-admin
vue-element-admin技术栈基于 ES2015+、vue、vuex、vue-router 和 element-ui,提前了解和学习这些知识会对使用本项目有很大的帮助,是一个企业级中后台前端的集成方案,不适合当基础模板来进行二次开发。模板建议使用: vueAdmin-template。可以把 vue-element-admin当做工具箱或者集成方案仓库,在 vueAdmin-template 的基础上开发,要什么就去 vue-element-admin 那里复制过来。
https://panjiachen.github.io/vue-element-admin-site/#/zh-cn/README

vuejs 和 element-ui 搭建的一个后台管理界面
http://www.cnblogs.com/taylorchen/p/6083099.html

ES6:

ES6提供的许多新特性。这些新特性中包含一些简便书写的方法:
箭头函数
默认参数
不定参数
解构赋值
模板字条串

ECMAScript 6 入门
http://es6.ruanyifeng.com/

vue 常用组件库
http://blog.csdn.net/zhouzhiwengang/article/details/72621219

Mint UI 基于 Vue.js 的移动端组件库
http://mint-ui.github.io/#!/zh-cn

Vue-strap, Bootstrap components built with Vue.js.
https://github.com/yuche/vue-strap
http://yuche.github.io/vue-strap/#modal

vue相关错误

执行npm run dev报错:
events.js:160 Error: listen EADDRINUSE :::8030
原因可能是端口被上一次启动占用

执行npm run dev报错:
Vue packages version mismatch:
原因是vue 和 vue-template-compiler版本不对应,执行 npm update vue-template-compiler

Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中。
http://www.kancloud.cn/yunye/axios/234845