前端总结

库与工具

1.nodejs
前端基础运行环境, 提供大量模块。

    npm install modulename --save-dev     安装模块并把模块信息加入package.json文件，--save生产环境 -dev开发环境。    npm uninstall modulename    在package.json文件里    "scripts": {        "start": "node app.js"      },    当运行npm start时，则运行node app.js命令。    当package.json里对包依赖已经有明确定义。    运行npm install会安装所有需要安装的包。

2.工具管理模块gulp
在项目根路径和package.json同目录路径下创建gulpfile.js并增加如下内容

var gulp = require('gulp');// require other packagesvar concat = require('gulp-concat');var cleanCSS = require('gulp-clean-css');var rename = require("gulp-rename");var sass = require('gulp-sass');var uglify = require('gulp-uglify');var jshint = require('gulp-jshint');// scripts taskgulp.task('check_scripts', function() {  return gulp.src('./www/dist/js/app.js')        .pipe(jshint())        .pipe(jshint.reporter('default'));});// styles taskgulp.task('styles', function() {  return gulp.src('./www/css/*.css')    .pipe(cleanCSS())    .pipe(concat('app.css'))    .pipe(rename({      suffix: '.min'    }))    .pipe(gulp.dest('./www/dist/css/'));});// scripts taskgulp.task('scripts', function() {    return gulp.src('./www/dist/js/*.js')        .pipe(concat('app.js'))        .pipe(gulp.dest('./www/dist/js/all/'))        .pipe(uglify())        .pipe(rename({            suffix: '.min'        }))        .pipe(gulp.dest('./www/dist/js/all/'));});gulp.task('default', ['scripts', 'styles']);

用npm 安装所需要包后npm install gulp -dev,npm install gulp-concat…..
运行gulp taskname
则运行相应的压缩，整合功能。
具体内容，请参考最新官方文档。

3.bower 前端库管理工具，会下载可用于网页的库代码。（现已停止维护）

4.cordova, phonegap,ionic –> hybrid app 应用组件和生态环境。（具体内容会在其他文章里继续）。

5.express, ejs ,jade,http,https,fs….. node于后端和服务器端模块。可用于构建一个后台服务器。

6.angularjs, reactjs –> 前端流行框架。用于架构新一级的前端服务。

7.threejs基于webgl的3d图形操作库。

8.requirejs,seajs –> 用于前端模块化的组织工具。

9.bootstrap, jquerymobile –> 前端UI库。

10.createjs –> 用于web的开源2d游戏引擎。

IDE

webstorm
dreamweaver
hbuilder
notepad++
chrome browser

拓展

cocos – 2d商用游戏引擎(支持js脚本）
unitity – 3d商用游戏引擎(支持js脚本）