我来了……

所有文章 第3页

脚本语言|必杀技

Dock应用与思考

3

chalecao 发布于 2017-10-21

  Node.js Best Practices – How to Become a Better Developer in 2017提到的几点,深有同感: 使用ES6 使用Promise 使用LTS 使用Docker … 想必大家都知道ES6,Promise以及LTS,那Docker是啥玩意啊?翻遍Node文档也没见踪迹啊! GitHub仓库: nodejs-docker 什么是Docker? Docker是最流行的的容器工具,没有之一。本文并不打算深入介绍Docker,不过可以从几个简单的角度来理解Docker。 从进程的角度理解Docker 在Linux中,所有的进程构成了一棵树。可以使用pstree命令进行查看: pstree i...

阅读(826)

脚本语言|必杀技

MAC 安装 Docker

6

chalecao 发布于 2017-10-21

部署标准 【环境稳定】 我们选用:阿里云 的ECS服务器 【业内标准】 应用上云后,后期不管迁移到AWS,还是腾讯云,都一样了。 【易扩展】 上云后,每一台机器,都涉及到Tomcat, MySQL,JAVA,Ubuntu 等一系列环境,实在是太麻烦,这个问题要解决。 【易部署】 上面解决了环境问题,那我们的代码怎么上传到云上呢?直接通过scp 传递一个 war 包到云服务器,然后再启动应用,如果发布的war包有问题,要回滚,还要去自己再去找历史的war包文件回滚回来。这个问题也要解决。 Docker神器 + 阿里云 ECS 一统江湖 Docker配图,容器装载一切 什么是Docker? 第一次听说这个名词,我也蒙逼了,如果你也是初次接触,那就听我来打个比喻吧! 近期房地产...

阅读(1044)

脚本语言|必杀技

阿里云ECS Docker搭建WEB

20

chalecao 发布于 2017-10-21

容器选型Docker MAC 安装 Docker: http://www.fed123.com/2017/10/21/mac-anzhuang-docker/ 安装好了,我们就开始在阿里云上跑WEB应用,以及MySQL,绑定域名等一系列的事情了。 下一个战场:阿里云服务器购买和安装Docker。 环境准备 阿里云帐号,支付宝的钱。 搞阿里云ECS服务器。 进入阿里云ECS后台截图如下: 进入阿里云ECS后台 点击创建实例按钮后截图如下: 选择主机位置 配置网络和安全组,勾选80端口 操作系统这里选ubuntu 因为是测试使用的,时间就选一周吧 最后一定要记好你设置的密码噢! 订单确认页面截图如下: 订单确认页面 其他就付款,然后等着阿里云创建实例就可以了。 然后再到实例列...

阅读(747)

HTML5|CSS3

CSS 变量(CSS Variable)

1

chalecao 发布于 2017-10-16

这是一个令人激动的革新。 CSS 变量,顾名思义,也就是由网页的作者或用户定义的实体,用来指定文档中的特定变量。 更准确的说法,应该称之为 CSS 自定义属性 ,不过下文为了好理解都称之为 CSS 变量。 一直以来我们都知道,CSS 中是没有变量而言的,要使用 CSS 变量,只能借助 SASS 或者 LESS 这类预编译器。 但是新的草案发布之后,直接在 CSS 中定义和使用变量已经不再是幻想了,像下面这样,看个简单的例子: 1 2 3 4 // 声明一个变量: :root{   --bgColor:#000; } 这里我们借助了上篇文章 结构性伪类 中的 :root{ } 伪类,在全局 :root{ } 伪类中定义了一个 CSS 变量,取名为 --bgColor 。 定...

阅读(601)

HTML5|CSS3

伪类与伪元素的用法

4

chalecao 发布于 2017-10-16

熟悉前端的人都会听过css的伪类与伪元素,然而大多数的人都会将这两者混淆。本文从解析伪类与伪元素的含义出发,区分这两者的区别,并且列出大部分伪类与伪元素的具体用法,即使你有用过伪类与伪元素,但里面总有一两个你没见过的吧。   1. 伪类与伪元素 先说一说为什么css要引入伪元素和伪类,以下是css2.1 Selectors章节中对伪类与伪元素的描述: CSS introduces the concepts of pseudo-elements and pseudo-classes  to permit formatting based on information that lies outside the document tree. 直译过来就是:css引入伪类和伪元...

阅读(569)

Javascript|Nodejs

Node.js 代码规范约定

chalecao 发布于 2017-10-13

Node.js 代码规范 这里只是简单约定,并不是强制。 空格缩进 使用2个空格而不是 tab 来进行代码缩进,同时绝对不要混用空格和 tab 。 Sublime Text 2 设置(Preferences > Settings – User): "tab_size": 2, "translate_tabs_to_spaces": true 换行 使用 UNIX 风格的换行符 (\n),同时在每个文件的结尾添加一个换行符。 Windows 风格的换行符 (\r\n) 是绝对禁止出现在任何项目中的。 Sublime Text 2 设置(Preferences > Settings – User): "default_line_ending...

阅读(591)

Javascript|Nodejs

使用 Service Workers提升体验

2

chalecao 发布于 2017-10-12

有一个困扰 web 用户多年的难题——丢失网络连接。即使是世界上最好的 web app,如果下载不了它,也是非常糟糕的体验。如今虽然已经有很多种技术去尝试着解决这一问题。而随着离线页面的出现,一些问题已经得到了解决。但是,最重要的问题是,仍然没有一个好的统筹机制对资源缓存和自定义的网络请求进行控制。 之前的尝试 — AppCache — 看起来是个不错的方法,因为它可以很容易地指定需要离线缓存的资源。但是,它假定你使用时会遵循诸多规则,如果你不严格遵循这些规则,它会把你的APP搞得一团糟。关于APPCache的更多详情,请看Jake Archibald的文章: Application Cache is a Douchebag. 注意:  从Firefox44起,当使用 A...

阅读(785)

认真学习快乐工作

大前端资源合集(转)

chalecao 发布于 2017-10-01

综合 名称 URL 简介 W3C www.w3.org www.chinaw3c.org 万维网联盟官方网站 MDN developer.mozilla.org Mozilla Developer Network,Mozilla 开发者网络 StackOverflow stackoverflow.com 最大最全的技术问答社区 SegmentFault segmentfault.com 中国开发者社区,国内的SO GitHub github.com 开源代码库,源码托管协作必备 码市 coding.net 国内代码库,源码托管协作必备,私有仓库免费 CanIUse caniuse.com 兼容性速查 知乎 www.zhihu.com 每日必刷,可以关注前端开发等话题 In...

阅读(1254)

Ionic2|PWA

ionic 3 中文教程

1

chalecao 发布于 2017-09-28

时隔三年,记得我最早翻译ionic中文教程的时候,是在2014年秋,一个偶然的机会接触到了ionic,我觉得这家伙简直就是未来。后来因为工作的原因,偏离了这个方向,主要去做web了。如今又回到H5的怀抱,决定重新翻译一下最新的ionic3教程,目前版本ionic 3.12.0, 大致规划一下教程内容(为了和之前的教程区分,这里统一为ionic3): 第一章 ionic3 起步 1.1 搭建ionic3环境 1.2 ionic3介绍 第二章 ionic3 组件   第三章 ionic3 API   第四章 ionic3 native   第五章 ionic3 主题   第六章 ionic3 优化 6.1 ionic3 使用 WKWeb...

阅读(2169)

认真学习快乐工作

开发联调的正确姿势

3

chalecao 发布于 2017-09-08

每天对着电脑坐着,要有正确的姿势,否则一天下来,可能腰酸背痛腿抽筋。这就是姿势不对,造成的人体内耗。晚上睡觉也是一样,睡姿不正确,醒来发现更累,都不愿意起床。对于我们这些屌丝程序员来说,开发程序联调的时候也需要有正确的姿势,否则真的会事倍功半,走上不少弯路。 关于自动化测试,大家可以参考我的另外一篇文章:斑马模块测试工具 这里我还是总结一下关于开发联调的一些事情。正如上面图所示,其实开发过程的调试主要有两部分:开发调试和测试调试。 开发调试:主要是开发时本地mock数据,这些数据分为两个部分,同步的数据和异步的数据。主要是开发自己在开发过程中模拟数据来编写程序代码,实现需求效果。这个过程中由于数据都是开发自己模拟的,所以模拟的数据特征很可能都比较主观,很难涵盖所有的数据特...

阅读(1022)

HTML5|CSS3

H5兼容性问题总结

3

chalecao 发布于 2017-09-06

文字问题 1.文字顶部被截掉,这个很坑,常见于android手机     机型:android手机,红米note4x, 小米6 原因: 文字大小和行高一样的时候,会出现这个问题 字体的font-size不等于最终显示的大小,取决于字体设计师的定义,以Catamaran字体为例,当我们设置100px的字号时,大写字母的高度(Capital Height)是68px,小写字母的高度(X-Hegiht)是49px,整体的高度是164px(Ascender 1100 + Descender 540),要了解任意字体的相关属性可以使用(fontforge)[https://fontforge.github.io/en-US/] 我们日常使用的CSS单位em对应f...

阅读(898)

Javascript|Nodejs

基于node开发的http请求代理程序proxy-ajax

2

chalecao 发布于 2017-09-05

今天把项目中的反向代理脚本程序抽成了一个插件,通过配置文件配置代理的http请求,这样使用起来比较方便,每位开发成员都可以用自己配置的代理调试代码。

阅读(1943)

HTML5|CSS3

学习和使用flexbox布局

1

chalecao 发布于 2017-09-04

是时候好好学习flex布局了,之前的开发经验主要集中在web pc端开发,现在主要集中在H5页面的开发,既然H5基本都支持flex布局,为什么不熟练使用呢?这里借用下阮老师的图,我也自己谢谢学到的flex布局的知识,作为补充。 知识运用:   垂直居中: 记得上次我写个垂直居中,由于图标的形状看起来偏下一些,所以用了margin/top+relative的方式来写,结果H5下面出了一堆兼容的问题,后来还是改成vertical-align的方式来写。同一父元素下所有子元素如果都是inline-block,那么采用vertical-align是比较好的垂直居中方式,当然vertical-align的值需要都是middle即可。   参考文献: Flex 布...

阅读(567)

认真学习快乐工作

如何应对前端疲劳

2

chalecao 发布于 2017-09-03

我最近和一个做后端开发的朋友讨论我在工作之余花了多长的时间去写码和学习写码。他给我看了Uncle Bob的《Clean Code》这本书中的一段话,它将音乐家们为准备音乐会而花费的时间与开发者让代码正确执行所用的练习时间进行了比较。 我喜欢这个类比,但是我不认为我完全认同它;首先这种想法会导致疲劳。我认为如果你想进一步磨练你的技术并扩大你的技能集,那么这是很好的,但是要一天中每个小时都这样做是很难持续的。 前端疲劳是非常真实的。 我看到过一些关于JavaScript疲劳的文章,但我认为问题远不止于这种特定的语言。 先澄清一下,这篇文章不是在抱怨前端疲劳如何糟糕,以及技术发展太快—— 我喜欢技术迅速发展。同样的,我可以感受到它是如何的势不可挡,也会时不时地感觉自己要落伍了。...

阅读(588)

认真学习快乐工作

方向对了,路就不怕远

2

chalecao 发布于 2017-09-01

这几天在接受公司的百阿培训,真真切切的感受到了阿里巴巴独特的商业文化,阿里人一脉相承的拼搏精神与工作品质。这是一代又一代阿里人汇聚在一起,大家共同沉淀下来的精神财富,不管你从事什么行业,都能在职业生涯中受用一生。 [youku]http://v.youku.com/v_show/id_XMTY1Mzk5MzY0MA==.html[/youku] 上面这段视频是介绍阿里巴巴从无到有,从有到优的发展历程。记得当时班主任给我们留的作业是: 1.你看到了什么? 2.你感受到了什么? 学习分享 我不知道大家看这段视频会有怎样的感受,但是真的的确很让人兴奋和感动。就像我们班里的一位同学说的那样“有好几次都快要出来了”。我在看的时候记下了一些关键字:坚持、梦想、面对、改变、机遇、执行。...

阅读(867)

脚本语言|必杀技

Ubuntu 16.04 LTS 上安装WordPress

7

chalecao 发布于 2017-08-30

最近把博客从hexo迁移到wordpress,主要是为了降低维护成本,方便团队记录学习成果! 安装wordpress 因为FACEBOOK这是一个很牛逼的项目,HHVM 比Zend的PHP引擎更快,它让脸谱网每天能够承受数十亿的访问量。 首先先决条件,你的 Ubuntu 必须是 Ubuntu 16.04 Server 64位,这是 HHVM 的运行的先决条件。 我们需要安装的程序: 安装 Nginx. 安装和配置 MariaDB. 安装和配置 HHVM 安装和配置 WordPress 首先切换到系统根账户,以方便安装过程不出错: sudo -s 安装 Nginx apt-get update apt-get install nginx systemctl start ng...

阅读(1146)

Javascript|Nodejs

React属性(propTypes)校验

1

chalecao 发布于 2017-08-30

随着应用不断变大,保证组件被正确使用变得非常有用。为此我们引入propTypes。React.PropTypes 提供很多验证器 (validator) 来验证传入数据的有效性。当向 props 传入无效数据时,JavaScript 控制台会抛出警告。注意为了性能考虑,只在开发环境验证 propTypes。下面用例子来说明不同验证器的区别: 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859React.createClass({ propTypes: { // 可以声明...

阅读(647)

WebAR|深度学习

WebGL入门ThreeJs中文笔记教程

1

chalecao 发布于 2017-08-29

学习WebGL很长时间了,但是总是东拼一下,西凑一点,没有系统总结。趁现在经济危机,俺要发奋图强。这里总结一下,基于ThreeJs官网(http://www.threejs.org ) 和其他网上看的博客内容,定期更新本系列课程。今天突然发现,博客写了两三年了,人还是没变。我还是坚持做自己喜欢的事情。可是现在觉得自己越走越远,总结更新一下最近学习的知识。

阅读(1068)

脚本语言|必杀技

git其他技巧

1

chalecao 发布于 2017-08-29

在这个安静的深夜,翻开我的博客,本想着记录一下看到的git的知识点,却无意中找到了3年前写的一篇博客,恍如隔世啊。生活真的需要有勇气作出改变。最喜欢GitHub了,能找到许多很好的项目,真的可以学到好多知识,节省时间。虽然自己也在黑gitHub的免费空间的功能,但是真心谢谢GitHub。好长时间都想写个自己用git的经验和总结,都没时间,今天必须写写。

阅读(771)

HTML5|CSS3

SVG的视窗与宽高比控制

14

chalecao 发布于 2017-08-29

SVG元素不像HTML元素一样由CSS盒模型管理。这使得我们可以更加灵活定位和变换这些元素-也许一眼看上去不太直观。然而,一旦你理解了SVG坐标系和变换,操纵SVG会非常简单并且很有意义。本篇文章中我们将讨论控制SVG坐标系的最重要的三个属性:viewport, viewBox, 和 preserveAspectRatio。

阅读(1196)

Javascript|Nodejs

Angular中模型监听之$watch

1

chalecao 发布于 2017-08-29

在编写Angular的应用中,有时候需要把两个不相干的事件关联起来,但是又没有回调函数可以用。这时候$watch就派上用场了。我们可以监听某个动作的数据模型,然后在模型数据变化时,做出对应的响应。

阅读(949)

HTML5|CSS3

SVG的牛B之处,你造吗

2

chalecao 发布于 2017-08-29

SVG能干啥,想干啥就干啥。可以用来做贴图,做纹理,做动画,甚至做背景图片,你想要的都可以,关键是操作灵活,和别是和canvas又可以相互转化使用,简直是居家旅行必备神器,作为前端工程师,你学会了吗?不会,就抓紧开始吧。

阅读(687)

WebAR|深度学习

3D模型的加载与使用

5

chalecao 发布于 2017-08-29

既然在讲3D世界,那么我们这里提到的模型就是3D模型。我不想将一些书上的定义摘抄给大家,那些概念对大家的理解帮助并不大,而接下来,我会将我最直接通俗的理解告诉大家。

阅读(1072)

Javascript|Nodejs

AngularJS与Backbone谁更适合

7

chalecao 发布于 2017-08-29

将不同的思想和工具进行对比,是一种更好地理解它们的方式。在本文中,我首先将列举在创建web应用程序时需要重复进行的各项任务,随后为你展现Backbone和Angular将如何帮助你完成这些工作。

阅读(874)

< Blog