查看详情

[译]开始对Angular App进行单元测试(1)

这是一些列文章,陆续翻译整理中... 原文地址:http://www.bradoncode.com/blog/2015/05/12/angularjs-testing-getting-started/ @ Bradley Braithwaite 前言 在写测试之前,我们还得对基础的JS的单元测试框架和如何写测试用例等一些问题做一个简要的介绍。 先说说 jasmine ,它算作一个行为驱动开发(behaviour driven development,BBD)的 JavaSciprt的框架,会让人困惑的是,它也可以用测试驱动开发(test driven development,TBD)的思想来写测试。 BBD和TBD两种风格会有些区别,但是使用jasmine确实可以用TBD的方式。jasmine会提供一种结构去组织你的测试以及一些函数来进行代码输出的断言。究竟是TBD还是BBD实际取决于开发者自己的如何去组织自己的测试,当然下文我们仅仅用TBD来进行讲解。 开始你的第一个测试 先建一个项目文件比如jasmine-test,然后粘贴下面的代码到一个html文件中。 <html> <head> <link rel="stylesheet" type="text/ 详情 »

查看详情

使用 JavaScript 进行语音识别

之前写过了语音合成,即是进行文字发音,当然现在也支持了语音识别, 即将你所说的转化成文字。Chrome 浏览器在版本25之后开始对这一特性的支持。 基础用法 var recognition = new webkitSpeechRecognition(); recognition.onresult = function(event) { console.log(event) } recognition.start(); 这里操作实际会让用户授权页面开启麦克风,如果用户允许的话,用户可以开始说话了,如果你停说话了,onresult注册的时间 则会被触发,并会讲捕获的音频返回成一个JavaScript对象。 响应流 DEMO地址 你需要等待用户准备好对话,并且知道对话结束; var recognition = new webkitSpeechRecognition(); recognition.continuous = true; recognition.interimResults = true; recognition.onresult = function(event) { console.log(event) } recognition.start(); 这样你可以在用户开始讲话时,提前渲染结果。 你可以自动以识别的语言,默认情况为所在地区语言。 x-webkit-speech Webkit 详情 »

查看详情

OAuth2 学习笔记

在日常的网站中,我们经常会看见一些来自社交网站的登录按钮,类似使用facebook,twitter登录等。而在这背后则是建立在OAuth基础之上。OAuth2是一套提供授权功能的框架,通过它我们可以使第三方站点获取到我们的用户授权,就像可以拿到facebook 或者微博的用户昵称和头像。OAuth2 提供了包括桌面,web以及移动端应用的授权功能。 授权角色 授权一般会定义下面四种身份: 用户 客户端 资源服务器 授权服务器 用户 我们通常定义资源的所有者(Resource Owner)即是我们的用户,是他们允许这些应用去访问他们自己的账户信息。当然这些应用所能访问的权限是有限的,它被限制在一个受保护的作用域内(比如只能读取信息,当然这取决于我们自己的设计). 授权服务器和接口服务 用户请求授权服务后成功后,会返回一个aceess token给应用,这样应用再访问其他接口服务时候都需要这个凭证. 客户端应用 客户端应用既是用户当前所用的这个产品了。它通过它用户授权成功后,可以对用户的一些信息进行访问或者修改,但无论如何,再请求用户信息的时候,我们的api和授权服务必须对它进行合法性验证。 授权流程 应用注册 使用授权之前,你必须让这些客户端应用登记在案,你需要它提供一些基本的信息名称比如,应用名称,网站地址,回调地址等等。其中回调地址既是用户完成授权后跳向的地址,在那里应用能够处理我们返回的授权代码以及access tokens. Cient ID 以及 Client Secret 详情 »

查看详情

# 10个值得深思的PHP面试问题

本文翻译自:https://www.toptal.com/php/interview-questions ,文章所罗列的问题虽然看似简单,但是每个背后都涵盖了一个或几个大家容易忽视的基础知识点,希望能够帮助到你的面试和平时工作。 Q1 第一个问题关于弱类型 $str1 = 'yabadabadoo'; $str2 = 'yaba'; if (strpos($str1,$str2)) { echo "\"" . $str1 . "\" contains \"" . $str2 . "\""; } else { echo "\"" . $str1 . "\" does not contain \"" . $str2 . "\""; } 正确运行的输出结果: "yabadabadoo" does 详情 »

查看详情

SVG Sprite 入门(SVG图标解决方案)

关于浏览器图标解决方案,一直就有很多 CSS Sprite,Icon Font,CSS Icon以及SVG.相对而言svg矢量图标以及支持浏览器自身解析的优点,很多团队都已经在使用了。这篇文章主要说明svg图标的使用和制作。 演示地址 代码 SVG Sprite 传统的做法 使用AI或者合并SVG图像,然后用background-postion; 打开AI,新建一个30 * 60(px)的画布,设置好网格和参考线. 用AI打开svg文件,然后复制路径到画布上调整大小 其他就和css-sprite没有差异了 .icon-bg{ display: inline-block; width: 30px; height: 30px; background: url(./res/svg-sprite-background.svg); background-size:100% 100%; vertical-align: middle; } .icon-facebook-logo{ background-position: 0 0; } .icon-earth{ background-position: 0 -30px; } .icon-like{ background-position: 0 -60px; 详情 »

查看详情

使用JavaScript 进行单词发音

在w3c草案中增加了对Web Speech Api的支持;主要作用在 两个非常重要的方面: 语音识别 (将所说的转换成文本文字 / speech to text); 语音合成 (将文本文字读出来 / text to speech); 而chrome在版本33发布后宣布对该特性的支持;今天重要介绍第二部分。 演示地址 文档和演示代码 开始使用 // 你可以直接打开你的控制台粘贴下面代码 var words = new SpeechSynthesisUtterance('Hello captain'); window.speechSynthesis.speak(words); 当然你还可以修改很多参数去调整你的发音: volume:声音; rate:发音速度; pitch:音调; voice:声音; language:语言(en,zh,ja...更多参考) var msg = new SpeechSynthesisUtterance(); var voices = window.speechSynthesis.getVoices(); msg. 详情 »

查看详情

React Native最佳学习模版- F8 App开源了

在刚刚结束的Facebook f8开发者大会不久。FB开源了自己的f8 App。 界面和体验都是相当精美的。 React Native 项目用的自己啊的React Native,可以同时build iOS和 Android.相信不少学习react native的人也希望看看FB团队自己怎样去写App的吧。正如介绍中一样,我们可以看到他们所用到的一些关键词:React Native, Redux, Relay, GraphQL。 开始构建 环境需要React Native,CocoaPods 1.0+ (only for iOS),MongoDb(服务端使用) git clone项目 $ git clone https://github.com/fbsamples/f8app.git $ cd f8app 安装依赖 (npm v3+): $ npm install $ (cd ios; pod install) # only for iOS 详情 »

解决git Unable to create temporary file ...

搞计算机的总会莫名奇妙的遇到一些问题,之前做了那么多的项目,突然就出现了,在push 时候抛出这样的错误 fatal: Unable to create temporary file: Permission denied error: pack-objects died of signal 13 搜索后,发现也挺频繁的。大致就是这样: // 登录git服务器,进入你的项目 cd your_rep.git chmod -R g+ws * chgrp -R git * git config core.sharedRepository true 然后再回到你本地目录,输入 git repack master 参考: http://stackoverflow.com/questions/1918524/error-pushing-to-github-insufficient-permission-for-adding-an-object-to-reposi git 常用命令:http://www. 详情 »

(转)React Native: Bringing modern web techniques to mobile

本文是Facebook发布在code.fb上的一篇关于React Native诞生的文章,由于被墙了,所以转过来,方便阅读。 If you're new to React, you can read more about it on the React website. You can also get started with React Native for iOS, which was released at F8 2015 on the React Native website. It started with React We introduced React to the world two years ago, and 详情 »

查看详情

使用Vagrant + webpack开发踩过的坑

团队的移动项目采用了webpack + vue作为前端架子,然而我们同时在Vagrant开发时却遇见了不少问题。 webpack-dev-server 8080端口 我们在linux 上一般默认启用了 127.0.0.1:8080作为我们的webpack dev server的服务,但是127.0.0.1对外并非可以访问的,这个时候我们需要更改两件事情,一件事情是增加vagrantfile里的端口, config.vm.network "forwarded_port", guest: 8080, host: 8080 第二件事情是修改启动命令 webpack --host 0.0.0.0 --port 8080 webpack-dev-server 不能自刷新 webpack-dev-server非常方便的一个功能就是检测文件变化,然后刷新项目,这样我们可以即时看见文件变化,然而在vagrant什么都没有发生!!!!!! 于是搜索资料,参考 wiki 里面的一段话: Notification via inotify requires the kernel 详情 »