Bootstrap前端开发工作流

自宁浩之博客转载过来,这个网站是收费的,我们得以当慕课这样的免费网站上这些核心的情,当然,原链接会给有有介绍性的视频,可以参见一些

作者:王皓
发布于:2015-02-07 14:39
更新于:2015-02-07 16:45
时长:04:08:15

公已经学会了 HTML 与 CSS,了解了 Bootstrap 这个框架,会用 Sass 或者 Less
的艺术去创造样式,又套了接触
JavaScript。现在即可以错过举行来东西了,不用等交啊都备好以后又夺开,因为不太可能什么都准备好。这个手册介绍了骨干的前端开发工作流程相关的东西,主要是会见为此
Bower 管理前端项目之靠,用 Grunt 或者 Gulp 自动化去履行任务,用 Git
来举行项目的版本控制。

Bower 可以管理前端项目因此之管,比如您的路而为此到
Bootstrap,传统的方是要先开辟 Bootstrap
的官方网站,找到时的本子,点击下载,然后解压,再管用之东西放指定的目录内,因为
Bootstrap 这个框架而为此到
jQuery,你还亟需把它们呢下载下来,放到项目之目下面。使用 Bower
可以直接用平等行命令,把 Bootstrap 还有其凭借的 jQuery 一块下充斥下来。

汝愿意在编辑完 Less 或者 Sass 以后,自动将她编译成一般的
CSS,或者好重复统一几单公文,并且再减去一下,再把拍卖好的文本放到一个指定的目录下面。在测试项目的上,你或要拿前端项目放到一个服务器上运行,对项目修改之后,保存了文本,你想被浏览器自动刷新。所有的,这些跟文件和目录相关的重复的动作,都好管其定义成
Grunt 或者 Gulp 的任务,让它活动去执行。

您想要平等栽好跟踪项目变更的计,什么日子,你还举行了什么事,你可以擅自的当其余一样潮对品种之修改中来回切换。你得将品种推送到长途的服务器上保留。你的同事,可以和你一同开品种。你要采用
Git 。

目标

Bower 管理前端项目之承保
创建 Gulp 或 Grunt 的任务
运用 Git 做版本控制
Bower

学科介绍 01:03
摸你想只要之 01:22
查阅包里之物:bower info 01:08
下载指定的包:bower install 02:11
bower.json 03:50
更新包:bower update 01:12
把装的东西保存及因列表里:–save 02:12
卸载包:bower uninstall 01:08
清除包:bower prune 00:49
离线安装包:–offline 01:19
类的本子号:bower version 01:54
修改版本号自定义提交信息:–message 01:50
配置:.bowerrc 02:06
Grunt

学科介绍 00:32
缔造任务
安装 grunt 01:59
创任务:task.registerTask / registerTask 02:48
当任务中使参数 01:27
错提示 02:22
链接多独任务 01:02
初始化配置:conifg.init / initConfig 01:56
多任务:multiTask 03:06
目及公事
创与删除目录 02:24
读取与写副文件 04:03
复制文件:grunt-contrib-copy 01:10
安排要复制文件 02:51
复制多单文本 03:31
蹲点文件变化:grunt-contrib-watch 01:20
文本发生变化执行指定的任务 02:34
本地服务器
开创服务器:grunt-contrib-connect 01:21
布局服务器 02:16
实时刷新:livereload 02:18
常用插件
编译 sass:grunt-contrib-sass 03:36
编译 less:grunt-contrib-less 02:28
集合文件:grunt-contrib-concat 03:36
选项:options 01:51
最小化 js:grunt-contrib-uglify 02:59
最小化 css:grunt-contrib-cssmin 02:06
尽小化图像:grunt-contrib-imagemin 02:46
Gulp

课介绍 00:49
准备
设置 gulp 命令行工具 01:11
初始化项目 04:04
创造任务 – gulpfile.js 02:42
基础
gulp 基础 00:32
复制单个文件 03:01
复制多独文本 02:40
globs 02:02
多个 globs 01:36
排除 01:19
主任务 01:27
文件发出变化时自动执行任务 02:25
插件
插件 01:04
编译 Sass:gulp-sass 03:06
编译 Less:gulp-less 02:08
创建本地服务器:gulp-connect 01:59
实时预览 02:01
联文件:gulp-concat 02:15
最小化 js 文件:gulp-uglify 01:24
重命名文件:gulp-rename 01:56
最小化 css 文件:gulp-minify-css 01:44
不过小化图像:gulp-imagemin 01:20
Git

准备
获帮助 – git help 00:59
大概的配置 – git config 03:26
基础
初始化 – git init 02:21
提交 – git commit 03:36
比区别 – git diff 04:48
重命名 – 直接当文件系统上重命名 02:22
重命名 – 使用 git mv 重命名 03:21
删除文件 – git rm 02:10
回复刚刚删除或修改的文书 03:35
复文件的史版本 – git revert 03:03
重置提交 – 控制头部指针 – git reset 04:01
分支
分支 – branch 02:04
于分上改 03:38
本着比分支区别 01:35
合并分支 – fast-forward 02:11
统一分支 04:40
化解统一冲突 04:07
重命名与删除分支 01:18
杂项
保留,恢复,删除工作进度 – stash 02:53
查看提交的日志 – git log 02:47
别名 – alias 03:12
忽略跟踪文件 – 全局范围 02:43
疏忽跟踪文件 – 项目级别 02:07
远程
远程 – Remote 00:55
Github – 创建并上加远程版本库 03:13
推送分支 – git push 02:58
其他人什么利用远程版本库 01:37
克隆 – git clone 01:53
提取 – git fetch 01:36
Fork 03:30
Pull Request 02:18
啊项目填补加协作者共同开发 03:13
图表工具
github 02:28
Brackets Git 02:24
Emmet

Emmet 是一个编辑器的插件,可以提高撰写 HTML 与 CSS
的快慢,支持用当博现代底文本编辑器上,比如 Brackets,Atom,Sublime …
先以这些编辑器上设置 Emmet 插件,然后练习下面这些视频里介绍的微技巧。

准备
课介绍 01:15
安装 Emmet 01:01
创立 HTML 文档的中心结构 02:55
HTML
要素的缩写 01:20
子元素 > 02:01
兄弟元素 + 01:02
腾飞级别 ^ 01:25
多次重复与群组 * & ( ) 01:42
性能操作符 [ ] 02:46
序号 $ 02:13
CSS
CSS 缩写 03:02
前缀 02:14
操作
挑标签对 01:45
据此缩写形式包装已经发出内容 02:48
转移至编辑点与选择编辑项目 02:26
切换注释 01:11
挑选行及合并行

相关文章