挪动端Web开发工具小汇之一

前一周在东京市听了壹位民代表大会牛的里边分享,回来整理了瞬间情况今后移动端web开发的工具流。以下文字为主都以copy官方表达。
//部分才是自家的补给。一切工具和工作流都以围绕【产品】→【设计】→【前端】→【测试】→【交付】这么些系统循环举办的。

图片1.png

GitHub.png

GitHub
存放使用Git版本控制的软件代码和内容项目。除了允许个人和组织创制和走访代码库以外,它也提供了一部分利于社会化软件开发的作用,包含允许用户跟踪别的用户、协会、软件库的动态,对软件代码的改观和
bug
建议评论等。GitHub也提供了图片效率,用于体现开发者们怎么在代码库上工作以及软件的支出活跃程度。
//这几个不赘述了。

smacss.com.png

SMACSS(Scalable & Modular Architecture for
CSS),其根本原则有3条:Categorizing CSS Rules(为css分类)
• Naming Rules(命名规则)
• Minimizing the Depth of Applicability(最小化适配深度)
SMACSS认为css有5个类别,分别是:
• Base (基本)
• Layout(布局)
• Module (模块)
• State (状态)
• Theme (主题)

图片3.png

参照文书档案:https://nicolas.steinmetz.fr/web-enthusiasts/post/2013/06/05/Atomic-design
http://bradfrost.com/blog/post/atomic-web-design/
http://www.slideshare.net/bradfrostweb/atomic-design?ref=http%253A%252F%252Fbradfrost.com%252Fblog%252Fpost%252Fatomic-web-design%252F

Atomic_m.jpg

//Atomic工作流优化和创新了设计师面对页面时的视觉,创作不再是3个个图层,而是遵从原子→分子→生物→模板→网页的构架形式一步步开展的。

yeomanjs.org.png

Yeoman是谷歌的团体和表面进献者团队合营开发的,目的是为开发者创造三个易用的工作流。
Yeoman主要有三有的构成:yo(脚手架工具)、grunt(塑造筑工程具)、bower(包管理器)。那多少个工具是分别独立开发的,可是须求般配使用,来完成大家快速的工作流方式。
• Yo
搭建新应用的脚手架,编写你的Grunt配置并且安装你有只怕在创设中须要的相干的Grunt职责。
4858mgm,• Grunt
被用来营造,预览以及测试你的类别,多谢来自那些由Yeoman共青团和少先队和grunt-contrib所管理的天职的协理。
• Bower 被用来进展信赖管理,所以您不再必要手动的下载和保管你的剧本了。
//某个部分,比如Grunt以往看来已经不合时宜或不适于高度碎片化的位移端web开发了,但工具控提出至少用它们度过你办事成短期的一个阶段。

gruntjs.com.png

http://gruntjs.com/
http://www.gruntjs.org/
Grunt是贰个自动化的品类创设筑工程具,假使需求再行的实施像压缩、编写翻译、单元测试,代码检查以及包装发表的任务.
那么你能够使用Grunt来处理那一个任务,
你所供给做的只是安排好Grunt,这样能相当的大程度的简化办事。

smacss.com.png

Bower
基于nodejs的模块化思想,把作用疏散到各类模块中,让模块和模块之间存在关联,通过
Bower 来治本模块间的那种沟通。
包管理工科具一般有以下的作用:
• 注册机制:各样包供给规定八个唯一的 ID
使得搜索和下载的时候能够正确匹配,所以包管理工科具必要爱抚注册音信,能够依赖别的平台。

文件存款和储蓄:明确文件存放的岗位,下载的时候能够找到,当然那些地址在互联网上是可访问的。
• 上传下载:那是工具的主要功能,能抓好包使用的便利性。比如想用 jquery
只须求 install
一下就足以了,不用四处找下载。上传并不是不可或缺的,依照文件存款和储蓄的职位而定,但要求有必然的建制保证。

依赖分析:那也是包管理工科具主要搞定的难题之一,既然包之间是有牵连的,那么下载的时候就要求处理他们之间的借助。下载1个包的时候也急需下载注重的包。

相关文章