(转)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 详情 »

查看详情

Git 中必须记住的命令

提交流程相关 查看文件改动以及新增的文件 git status 添加新增文件 git add your_file_path // 添加全部文件 git add * // 添加某类型文件 git add dir/*.js 简单的提交文件 git commit -m "Commit message" 提交你所有的修改文件以及添加的文件 git commit -am 'your message' 撤销修改某个文件 git checkout -- <filename> 放弃本地所有修改 git fetch origin git reset --hard origin/master 更新相关 更新远程代码 git pull 显示合并冲突文件 git diff 查看某个合并冲突文件 详情 »

解决PHP获取不了 React Native Fecth参数的问题

React Native 使用 fetch 进行网络请求,推荐Promise的形式进行数据处理。官方的 Demo 如下: fetch('https://mywebsite.com/endpoint/', { method: 'POST', headers: { 'Accept': 'application/json', 'Content-Type': 'application/json', }, body: JSON.stringify({ username: 'yourValue', pass: 'yourOtherValue', }) }).then((response) => response.json()) .then((res) => { console.log(res); }) .catch((error) => { console.warn(error); }); 但是实际在进行开发的时候,却发现了php打印出 $_POST为空数组。这个时候自己去搜索了下,提出了两种解决方案: 构建表单数据 function toQueryString( 详情 »

查看详情

使用 react-native-simple-router 组织你的React Native 页面

React Native Simple Router是一款第三方导航组件。你可以通过它进行合理的视图组织。 项目地址 安装 进入你的项目目录,如过没有初始化项目可以react-native init your_project,然后在项目目录安装react-native-simple-router。 npm install react-native-simple-router --save 使用 import Router from 'react-native-simple-router'; 修改的你的index.ios.js,如果是Android修改对应文件即可。 import React, { StyleSheet } from 'react-native'; // 初始化页面 class HelloPage extends React.Component { render() { return <Text>Hello world!</Text>; } } const styles = StyleSheet.create({ header: { backgroundColor: '#5cafec', }, }); // 在这里定义你的路由 详情 »

(译)一篇非常不错的前端面试文章

原文地址:http://blog.sourcing.io/interview-questions 文章来自翻译,其中忽略了一些无关紧要的内容直入主题。 作者先后在twitter,Stripe工作,期间会参加面试工作。实际上参加面试工作的人都知道要想在一个较短的时间内(30min-1h)就对一个应聘者做出判断其实是很难的,因此我们不得不想尽办法去更加合理的去判断面试者。下面是作者理出的一个思路: 如果对方有github账号,我们会尽可能的去了解TA在开源项目上的动态和他的开源项目。我们也会从中挑出一些切入点,通过交流他做这个项目的出发点也能够更好的了解面试者的设计思路,也可以初步的去判断该人是不是适合团队。如果双方交流顺畅,接下来会直接进行到代码等一些基础问题上来。 自己的面试会很实际,几乎全部都是coding,很少会提到算法和一些抽象的概念。自己提出的问题看似简单,但是每一点都涉及到javascript的一些知识领域。 面试的时候并不建议使用白板,通常希望面试者自己带上自己的笔记本,或者就使用自己的。我会将他们的代码运行,并告知结果。 Object prototype 我起初会提出一个非常简单的问题就是定义一个函数spacify ,将一个字符串作为参数传入,然后返回一个字符串,不过该字符串相对原有传入参数的变化是字母与字母之间多了一个空格。 spacify('hello world') // => 'h e l l o w o r l d' 虽然问题很简单,但这却是一个很好的开始,我们接下来的问题便可以围绕此展开, 详情 »

[转]单点登录的三种实现方式

文/JC_Huang(简书作者) 原文链接:http://www.jianshu.com/p/613e44d4a464 著作权归作者所有,转载请联系作者获得授权,并标注“简书作者”。 单点登录SSO(Single Sign On)说得简单点就是在一个多系统共存的环境下,用户在一处登录后,就不用在其他系统中登录,也就是用户的一次登录能得到其他所有系统的信任。单点登录在大型网站里使用得非常频繁,例如像阿里巴巴这样的网站,在网站的背后是成百上千的子系统,用户一次操作或交易可能涉及到几十个子系统的协作,如果每个子系统都需要用户认证,不仅用户会疯掉,各子系统也会为这种重复认证授权的逻辑搞疯掉。实现单点登录说到底就是要解决如何产生和存储那个信任,再就是其他系统如何验证这个信任的有效性,因此要点也就以下两个: 存储信任 验证信任 如果一个系统做到了开头所讲的效果,也就算单点登录,单点登录有不同的实现方式,本文就罗列我开发中所遇见过的实现方式。 以Cookie作为凭证媒介 最简单的单点登录实现方式,是使用cookie作为媒介,存放用户凭证。用户登录父应用之后,应用返回一个加密的cookie,当用户访问子应用的时候,携带上这个cookie,授权应用解密cookie并进行校验,校验通过则登录当前用户。 Auth via cookie 不难发现以上方式把信任存储在客户端的Cookie中,这种方式很容易令人质疑: Cookie不安全 不能跨域实现免登 详情 »

[转]说说Code Review

最近团队开始code review,其实对于一个成熟或者走向成熟的团队而言,这都是十分必要的,顺手转一篇关于code review 的文章。 原文出处:https://segmentfault.com/a/1190000004502976 一、目的是什么 做任何事情都要有一个目的,那么我们做code review的目的是什么呢?本来开发工期就非常紧了,特别是身处中国这个大环境下的互联网公司,老板恨不得要你二十四小时连轴转,为什么还要花那么多时间去做code review呢?我认为code review的目的在于提升代码质量。 前几天看了篇文章,里面有这么一段对我触动很大: 在这种业务需求紧张的模式下,Facebook一些开源技术方案是如何产出的,是非业务团队专门做的么? 我想说的是即使业务需求紧张,也一样把代码好好写好,另外有牛逼的tech lead和严格的code review,总的质量也不是很差。国内有一点很不好:经常没有code review;而且技术人员观念不好,把要写的代码当差事,只要能完成能用就好。所以就越来越操。 (Code reivew一直是硅谷一线互联网公司的质量控制法宝,从Apple到Google,从Facebook到现在的Airbnb和Uber。可悲的是,国内的人都太聪明,觉得这东西没用繁琐,而且减慢开发速度。有时,我们就是太过聪明。) 所以我们不要总是拿没时间来当做借口,如果对代码质量没有一定的追求,给再多时间也是没用的。 详情 »

使用React-router和Webpack快速构建一个react程序

初始化项目 我们先创建个空文件夹,然后初始化 package.json ,填写一些基本信息。 $ npm init 接下来我们开始安装依赖项,我的 package.json 的依赖项如下 "devDependencies": { "babel": "^5.5.6", "babel-core": "^5.5.6", "babel-loader": "^5.1.4", "history": "^1.13.1", "react": "^0.13.3" 详情 »

让你的 highcharts支持maxPointWidth属性

我们在设置图表时候经常会动态设置数据列的宽度,但是如果数量较少的话,经常会比较难看,于是我们会想到限制一个最大宽度。这段代码应该适合你。 (function(H) { var each = H.each; H.wrap(H.seriesTypes.column.prototype, 'drawPoints', function(proceed) { var series = this; if (series.data.length > 0) { var width = series.barW > series.options.maxPointWidth ? series.options.maxPointWidth : series.barW; each(this.data, function(point) { point.shapeArgs.x += (point.shapeArgs.width - width) / 2; 详情 »