总结个人2015进步前端效力的要领和东西

更多前端内容http://www.codefrom.com/p/JavaScript

浏览之前

非Mac用户请自动疏忽,此文针对Mac用户,我个人运用频次异常高,PC端开辟者能够挑选性的尝试部份东西。

终端东西

装置homebrew,不装真对不起本身

ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

homebrew

换掉/bin/bash请运用/bin/zsh,装置oh-my-zsh。

sh -c "$(curl -fsSL https://raw.github.com/robbyrussell/oh-my-zsh/master/tools/install.sh)"

oh-my-zsh

运用homebrew装置tmux

brew install tmux

tmux

装置vim bundle

git clone https://github.com/gmarik/Vundle.vim.git ~/.vim/bundle/vundle

Vundle.vim
装置nvm来治理node环境

brew install nvm

nvm
装置Xcode command line tools

xcode-select --install

运转敕令后,根据指引,你将完成 Xcode command line tools 装置
现在个人运用Atom编辑器和vim连系开辟”前端”,假如终端版vim运用不习惯,能够用Macvim(GUI)
Atom

macvim

装置iTerm 2,你懂的

iTerm 2

我运用Dash来查询API文档

Dash

上述终端东西的设置可运用我的设置文件 | 运用指南

git clone https://github.com/lcepy/icepy.vim.git ~/icepy.vim

cp -r .vimrc ~/

cp -r .vimrc.bundles ~/

cp -r .tmux ~/

cp -r .tmux.conf ~/

cp -r .zshrc ~/

或许

cp -r ~/icepy.vim/* ~/

icepy vim shell conf

运用提醒

假如不想运用YouCompleteMe能够解释掉,由于此须要Apple LLVM clang编译器
vim目次,能够按F5
在终端输入tmux,control+b (按一下)然后再按D(注重是大写),假如想封闭control+b 再按shift+7
运用nvm install v0.12.6 装置node环境
sudo npm install -g npm (记得更新一下npm)
我运用git来治理我的源代码
:BundleInstall 或许 vim+PluginInstall+qall 来装置vim插件

我经常使用的“前端”环境(包含node+mongodb+Hybrid App)

我运用TypeScript来编写JavaScript代码,它的范例体系,面向对象的体式格局比较相符我的预期,而且我能在编译环节就能够消除毛病,基础上团队写的代码都一样,保护起来不会涌现JavaScript有一千个哈姆雷特的状况,何况TypeScript也是下一代Angularjs所采纳的。

sudo npm install -g typescript

tsc helloworld.ts

sudo npm install -g tsd

TypeScript

d.ts

我用tsd来处置惩罚第三方模块,如许才能让编译器经由过程编译。

node开辟环境

forever能够在后台启用node效劳,好用。
forever
开辟阶段运用它无需本身在终端不断的重启node效劳
node-supervisor
调试debug东西
node-inspector
mongodb开辟环境

brew install mongodb

设置文件在/usr/local/etc/mongod.conf

systemLog:
      destination: file
      path: /usr/local/var/log/mongodb/mongo.log
      logAppend: true
storage:
      dbPath: /Users/xiangwenwen/mongodb/data
net:
      bindIp: 127.0.0.1

在终端运转mongod —config /usr/local/etc/mongod.conf
tmux session右窗口处运转mongo
浏览器端开辟环境
重要运用bower来治理我的前端文件,虽然我不写CSS,然则我依旧挑选sassc来编译,这是C言语写的编译器能够翻译成CSS。

npm install -g bower

brew install sassc

模块化和构建东西
关于模块化和构建东西,三年前运用着grunt和RequireJS,AMD CMD真没啥好争辩的,一年前一向用着glup,而本年我预备将运用ES6 modules来做模块化,自动构建东西grunt+glup连系的体式格局。

npm install -g grunt-cli

npm install -g glup

JavaScript
现在基础上已全线运用ES5了,所以还要针对IE系列开辟的同砚能够疏忽,HTML5特征也大批的在运用中,ES2015会是本年重点进修的方向。
promises治理异步JavaScript是我处置惩罚回调的首选挑选。
代码质量,这个现在基础不做了,由于TypeScript
ESLint
JSCS
客户端模版
现在我在运用jade,本年开始运用ES2015内置的模版。
调试东西
一个就够了,chrome tools。
或许option + command + i Atmo调起chrome的调试东西,跟编辑器亲热合体。
Hybrid App
现在在运用ionic,尝试React Native。

npm install -g cordova ionic

ionic
React Native
Hybrid App 调试东西,重要分为两个部份,一个是safari,别的一个是本身编写的iOS版调试日记东西MFLog,能够嵌入到Hybrid App中,分为Objective-C和Swift版。
我经常使用的”前端”库或插件

挪动版的jQuery
zepto
图表绘制库
echarts
东西类函数
lodash
模块化
webpack
requirejs
大框架
Angular
Angular UI
Angular UI
Cordova Plugins
cordova plugins
动画库
famous
构建API
restify
dozerjs
CMS
keystonejs
Express 构建网站
Express
mongoose
mongoose
CSS UI
Bootstrap
Foundation
netease
async
async
hexo编写博客
hexo
我经常使用的其他东西
用来编写Api 左券文档
apiary
模仿数据
mockjs
检察CSS HTML5的支撑状况
caniuse
研讨浏览器引擎内核的文献
浏览器的事情道理:新式网络浏览器幕后揭秘
写在末了,我运用频次最高的东西是Github^_^。

    原文作者:西二旗剑客
    原文地址: https://segmentfault.com/a/1190000003006331
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞