好多年没有接触前端,发现前端行业发生了巨大的变化,很多新鲜术语,比如node、git、grunt、less、sass、预编译、自动化、模块化等等,看得让人晕头转向,不要担心,我会把这之前之后学习成果都记录下来,方便想要入门的同学交流学习!本人水平有限,错误在所难免,希望各位看客指正。

如题,接下就是6个准备步骤,走完这6个步骤,你会不会手痒呢。。。反正我很兴奋,前端工程化了!

1、安装ruby

为什么要安装Ruby:mac的包管理工具homebrew、前端自动化工具yeoman依赖与ruby;

怎么安装:mac系统一般自带,如果没有ruby,具体操作详见——http://www.cnblogs.com/daguo/p/4097263.html

2、安装git

为什么安装git:方便本地与远程服务器之间的交互;

怎么配置git:详见——http://www.cnblogs.com/ccdev/archive/2012/09/12/2682098.html

关键是ssh-key的配置,建立本地与远程之间的联系,详见——http://blog.csdn.net/tsangyang/article/details/8654408

3、配置nodejs

直接去官网——https://nodejs.org/en/ 下载一个安装就可以了,自带安装npm;

4、配置前端自动化工具yeoman、bower、grunt

具体配置详见——http://www.tuicool.com/articles/3EnMnq

5、配置本地服务

配置本地服务器,详细配置见——https://github.com/enson/enson.github.com/issues/1

主要是配置:/etc/apache2/httpd.conf、extra/httpd-vhosts.conf (指定本地站点位置)、hosts(指定本地可访问的域名)这三个文件;

6、开始项目实践

1)项目一般托管在coding或是github上,先登录;选择要clone的项目,通过ssh-key复制项目的地址;

打开terminal,输入git clone “xxx地址”,把线上项目下载到本地,路径要与先前设置好的本地服务器站点位置相一致;

2)通过前端自动化工具新建自己的项目;

通过上述步骤,我们就踏上了高大上的前端之路啦!

mac下搭建前端自动化工程的更多相关文章

  1. Mac下搭建hexo

    Mac下搭建hexo 并部署到gitcafe 1.安装brewhome ruby -e "$(curl -fsSL https://raw.github.com/Homebrew/homeb ...

  2. MAC下搭建及使用XAMPP的详细教程

    Windows和Linux都可以搭建本地伺服器(LAMP和IIS),Mac當然也可以,下面教你怎麼使用XAMPP在Mac下搭建一個功能齊全的本地伺服器 所需條件 1.Mac系統(廢話) 2.最好有可用 ...

  3. Mac下搭建php开发环境教程

    方案一:原生安装 这篇文章主要介绍了Mac下搭建php开发环境教程,Mac OS X 内置了Apache 和 PHP,这样使用起来非常方便.本文以Mac OS X 10.6.3为例,需要的朋友可以参考 ...

  4. mac 下搭建 Android 开发环境

    因工作需要,要在mac 下搭建 Android 开发环境.谷歌.度娘了好久,没有找个一个完整又系统的方法,很是苦恼.最终,皇天不负有心人,找到了下面这篇文档,结合亲身体验,特此记录.也为有这方面需求的 ...

  5. mac下搭建cordova开发环境

    Apache Cordova 原名叫PhoneGap.是一个用基于HTML,CSS和JavaScript的,创建移动跨平台移动应用程序的快速开发平台.PhoneGap最初由Nitobi开发,2011年 ...

  6. Mac下搭建lamp

    Mac下搭建lamp Mac 自带了Apache,并默认支持PHP环境,只需要配置Apache和PHP即可使用.需要单独安装mysql服务端. Apache 基础配置 Apache支持PHP配置 Ap ...

  7. Mac 下搭建 Apache 服务器

    Apache作为最流行的Web服务器端软件之一,它的优点与地位不言而喻.下面介绍下在Mac下搭建Apache服务器的步骤: (1)“前往” –>”个人” (2)在你的个人目录下新建一个文件夹,改 ...

  8. 在mac下搭建java开发环境

    刚刚从windows系统转到使用mac系统.感觉不是特别熟悉,须要一定的适应时间. 以下简介一下mac下搭建主要的java开发环境. 1.安装jdk 安装jdk1.7后,发现不须要进行环境变量配置,直 ...

  9. 在mac下搭建Apacheserver

    Apache作为最流行的Webserver端软件之中的一个.它的长处与地位不言而喻.以下介绍下在mac下搭建Apacheserver的步骤: (1)"前往" –>" ...

随机推荐

  1. HTML css样式

    clear: both清除左侧和右侧浮动 status: 变量状态参数,该属性有5个常用值count 表示当前遍历集合的元素个数index 表示当前遍历到集合的第几个元素current 表示当前的集合 ...

  2. lua学习笔记(四)

      表达式   算术操作符     +(加法) -(减法) *(乘法) /(除法) ^(指数) %(取模) -(负号)     x%1的结果是x的小数部分,x-x%1是整数部分   关系操作符     ...

  3. oracle中sqlldr工具使用时注意事项

    1.命令写在一行:如,sqlldr sh/&sh_pass@&connect_string control=&ctl_file data=&dat_file log=& ...

  4. 系统服务-----NotificationManager

    熟悉api事例笔记: package com.test; import com.example.test.R; import android.app.Activity; import android. ...

  5. FILE 创建

    public class CreateDelFileUtils implements Serializable{ /** * */ private static final long serialVe ...

  6. 《TomCat与Java Web开发技术详解》(第二版) 第五章节的学习总结 ---- Servlet的高级用法

    这一章节主要是介绍了Servlet技术的一些高级用法,如下是我自己的整理归纳 1.下载文件:即获取服务器文件,并把文件写入反馈给客户端 ServletContext.getResourceAsStre ...

  7. linux 解决 安装软件一直出现重复的信息

    State : Sleeping, pid: Another app is currently holding the yum lock; waiting for it to exit... The ...

  8. 解决:Adb connection Error:远程主机强迫关闭了一个现有的连接

    最近刚入手了一台G12,用它来调试程序的时候,eclipse的console总是出现如下的错误“Adb connection Error:远程主机强迫关闭了一个现有的连接” 问题出现的原因:这是ddm ...

  9. PHP 学习内容

    第一阶段: (PHP+MySQL核心编程) 面向对象编程 MySQL数据库, MySQL的优化细节. HTTP协议,http也是我们web开发的基石.对我们了解PHP底层机制有很大帮助,做到知其然,还 ...

  10. SimpleAdapter的用法

    学习listView的时候,按照例子设定item的布局为系统提供的simple_list_item_single_choice.xml@frameworks/base/core/res/res/lay ...