随笔分类 -  前端技术思想

摘要：目前已知的有腾讯、新浪、网易、搜狐和Google提供IP地址查询API，但是找得到的只有腾讯、新浪和网易的，Google的貌似要用Google Maps所以没有研究。看了下国内的几个腾讯提供的是JavaScript的，网易提供的是XML，而新浪的有多种格式可以用，注意非XML的数据源都是GBK格式的... 阅读全文

摘要：当Cordova 程序打包并安装到手机中后，我们会发现启动程序时，会有数秒的黑屏现象，常见的解决方法则是设置闪屏后面。这里以 Android 程序为例，介绍Cordova设置启动画面的方法。1. 添加动画闪屏支持打开cmd，进入项目目录下，执行命令：cordova plugin add org.ap... 阅读全文

摘要：1. 去除页面的右键菜单$(document).ready(function(){ $(document).bind(“contextmenu”,function(e){returnfalse;});});2、搜索输入框文字的消失当鼠标获得焦点、失去焦点的时候，input输入框文字处理：$(docu... 阅读全文

摘要：WebGL开启了网页3D渲染的新时代，它允许在canvas中直接渲染3D的内容，而不借助任何插件。WebGL同canvas 2D的API一样，都是通过脚本操纵对象，所以步骤也是基本相似：准备工作上下文，准备数据，在canvas中绘制对象并渲染。与2D不同的就是3D涉及的知识更多了，例如世界、光线、纹... 阅读全文

摘要：现在敏捷开发是越来越火了，人人都在谈敏捷，人人都在学习Scrum和XP...为了不落后他人，于是我也开始学习Scrum，今天主要是对我最近阅读的相关资料，根据自己的理解，用自己的话来讲述Scrum中的各个环节，主要目的有两个，一个是进行知识的总结，另外一个是觉得网上很多学习资料的讲述方式让初学者不太容易理解；所以我决定写一篇扫盲性的博文，同时试着也与园内的朋友一起分享交流一下，希望对初学者有帮助。什么是敏捷开发？敏捷开发(Agile Development)是一种以人为核心、迭代、循序渐进的开发方法。怎么理解呢？首先，我们要理解它不是一门技术，它是一种开发方法，也就是一种软件开发的流程，它会指 阅读全文

摘要：越来越多的人开始意识到，网站即软件，而且是一种新型的软件。这种"互联网软件"采用客户端/服务器模式，建立在分布式体系上，通过互联网通信，具有高延时（high latency）、高并发等特点。网站开发，完全可以采用软件开发的模式。但是传统上，软件和网络是两个不同的领域，很少有交集；软件开发主要针对单机环境，网络则主要研究系统之间的通信。互联网的兴起，使得这两个领域开始融合，现在我们必须考虑，如何开发在互联网环境中使用的软件。RESTful架构，就是目前最流行的一种互联网软件架构。它结构清晰、符合标准、易于理解、扩展方便，所以正得到越来越多网站的采用。但是，到底什么是RESTf 阅读全文

摘要：Aug 17, 2013Tags:gruntJavascriptnodejsComments:9 Commentsgrunt让Nodejs规范起来从零开始nodejs系列文章，将介绍如何利Javascript做为服务端脚本，通过Nodejs框架web开发。Nodejs框架是基于V8的引擎，是目前速度最快的Javascript引擎。chrome浏览器就基于V8，同时打开20-30个网页都很流畅。Nodejs标准的web开发框架Express，可以帮助我们迅速建立web站点，比起PHP的开发效率更高，而且学习曲线更低。非常适合小型网站，个性化网站，我们自己的Geek网站！！关于作者张丹(Conan 阅读全文

摘要：Aug 19, 2013Tags:bowergruntJavascriptjsnodejsyeomanyoComments:10 CommentsYeoman自动构建js项目从零开始nodejs系列文章，将介绍如何利Javascript做为服务端脚本，通过Nodejs框架web开发。Nodejs框架是基于V8的引擎，是目前速度最快的Javascript引擎。chrome浏览器就基于V8，同时打开20-30个网页都很流畅。Nodejs标准的web开发框架Express，可以帮助我们迅速建立web站点，比起PHP的开发效率更高，而且学习曲线更低。非常适合小型网站，个性化网站，我们自己的Geek网站 阅读全文

摘要：作为一名前端开发人员，HTML，HTML5以及网站优化都是必须掌握的技术，下面列举一下HTML， HTML5, 网站优化等常见的面试题：HTML常见面试题：1. 什么是Semantic HTML（语义HTML）?Semantic HTML是一种编码风格, 它通过添加能够被计算器所理解的语义(Meta data)，从而使HTML成为一个通用的信息交换媒介。在语义HTML中，,这类其中的内容不具有实际意义的标签是不应该被使用的，因为他们只是为了进行格式化，没有提供要表达的意义及页面结构。2. DOCTYPE 有什么作用？DOCTYPE主要作用是告诉浏览器这个网页是哪种HTML， 浏览器根据这个标示 阅读全文

摘要：今天 ,Web 组件已经从本质上改变了HTML。初次接触时，它看起来像一个全新的技术。Web组件最初的目的是使开发人员拥有扩展浏览器标签的能力，可以自由的进行定制组件。面对新的技术，你可能会觉得无从下手。那这篇文章将为你揭开Web组件神秘的面纱。如果你已经熟知HTML标签和DOM编程，已经拥有了大量可用的Web组件，那么你已经是Web组件专家了。Web组件的现状随着各式各样的用户需求，浏览器的原生组件已经无法满足需求。Web组件也就变得越来越重要。我们将以自定义一个传统三方插件为例来介绍Web组件。首先，需要引用插件的CSS和JavaScript资源：接下来，我们需要向页面中添加占位符。最后， 阅读全文

摘要：yeoman是什么yeoman主要包含了三个工具：yo、grunt、bower。我们先看下这三个工具分别是做什么的：yo：脚手架工具，主要作用是创建项目骨架（跟grunt-init有点像）。grunt：构建工具，主要用来运行各种任务，比如文件压缩、合并、打包等。bower：主要用来做前端资源依赖管理，跟npm很像，区别在于：npm管理的是node模块的依赖，bower管理的是前端资源的依赖，如css、javascript文件等。yeoman是做什么的现在我们已经知道yeoman里面又什么东西了，那么它在我们的项目开发中扮演了一个什么样的角色呢？首先我们来看看官方对yeoman的定义：MODER 阅读全文

摘要：前言博客迁移到了BAE上，http://owenchen.duapp.com/，以后的文章会首发在自己的博客上，随后在博客园发布。很久没有写文章了，一是项目比较忙，二来自己在尝试一些互联网新的产品，以微信平台开发为主，看看能不能挣点零花钱以缓解目前的经济压力，也顺便了解和学习一下为什么这东西这么火。最终钱还没挣到，到把自己累个半死。当然收获也是有的，发现了一些挣钱的路子，以后有时间有机会尝试尝试。也在短时间内玩了不少东西，比如PHP的mvc框架thinkphp，比如如何使用jQuery fileupload上传、接收存放文件，以及百度的ueditor的使用。这些都是不错的互联网工具，以后兴许会 阅读全文

摘要：源文件编译这里我使用的工具是grunt，他本身主要是基于Node.js的文件操作包，其中有许多插件可以让我们完成js文件的compile和compress、sass到css的转换等等操作。要使用它需要先安装命令行工具：npm install grunt-cli-g，然后在项目根目录中创建文件Gruntfile.js，这个文件用于定义各种task，我们首先定义一个task将从bower下载的第三方依赖都打包到文件app/js/lib.js中：module.exports=function(grunt){vardependencies=['components/jquery/jquery. 阅读全文

摘要：如今的前端开发中，已经不再只是一些简单的静态文件了，对于很多Web App来说，前端代码甚至比后端代码要更加复杂，更加难于管理，例如：我们有许多的第三方库的依赖需要管理；我们有独立的前端测试需要自动运行；我们还有很多代码需要在发布时进行打包压缩；⋯⋯所以构建一个自动化的前端开发流程是非常必要的，但现在前端开发流程的构建是百花齐放，没有一个统一的标准，还有很多依赖于后端的架构来做前端开发管理。例如在Rails开发中，就有各种前端库的gem包。但是这种依赖于后端框架的管理方式有许多问题：许多gem包的维护者并不是前端库的维护者，所以更新不一定即时；不利于前端代码与后端代码做分离；增加了前端开发者的 阅读全文