{eval=Array;=+count(Array);}
Web前端开发最常见的编程软件有以下几种:
DreamWeaver是一款老牌前端开发工具,功能强大且组件丰富,作为前端开发的一款利器被广泛使用。DreamWeaver是一款可视化的前端开发工具,一边写代码一边就能看到效果,所以使用起来还是比较方便的。但是DreamWeaver的缺点就是比较耗费系统资源,这也许是IDE类产品的通病。
Hbuilder是最近几年被广泛使用的一款前端开发工具,我最初开始使用Hbuilder是因为它可以做Android和IOS的开发,移动互联团队的同事推荐给我使用的,我用了一段时间感觉还不错。整个操作比较简便,显示风格我也比较喜欢,给人一种很轻的感觉,同时功能又很强大。但是使用Hbuilder有一个问题一直让我比较困惑,就是我之前开发过的页面如果通过导入功能导入到Hbuilder中会出现中文乱码,而同样的操作在Eclipse中则不会乱码,这也让我比较困惑,不知道官方什么时候能解决这个问题。
sublime text也是前端开发比较常见的工具之一,特点是可通过配置插件来构建一个比较丰富的开发环境,同时sublime text比较轻(比Hbuilder还要轻),如果熟悉了它的快捷键,那么使用起来还是比较便捷的。当然它也支持很多开发语言,虽然在代码管理方面没有DW那么强大,但是由于它很轻,速度很快,所以很多前端开发人员还是比较喜欢使用它。
Eclipse也是可以进行前端开发的,使用Eclipse进行前端开发的程序员有很多是做后端开发出身的。因为可能是使用Java语言比较多的缘故,我对Eclipse的使用比较熟悉,所以很多时候我都使用Eclipse进行前端开发。使用Eclipse进行前端开发可以直接跟后端开发整合测试,在这一点上还是有一定的优势,虽然Eclipse本身较重,但是如果既做前端又要做一部分后端调试,使用Eclipse总要好过使用DW+Eclipse。但是某些Eclipse版本在JavaScript程序片的支持上有一些小Bug,在使用的时候要多加注意。
Editplus本身就是一个功能强大的记事本,我最初使用Editplus是在2001年,当年使用Editplus做C语言开发,后来改用Vim了,因为Vim比Editplus更方便。Editplus可以进行很多语言的开发,通过配置编译和运行环境,可以在Editplus下进行程序编写和调试。Editplus没有编写提示,最大的优点是运行快,Editplus只有几M大,非常小巧。由于早期长时间使用Editplus,所以锻炼了我的手写代码能力,也提高了模块化代码的能力,因为Editplus没有这些辅助功能。
做前端开发需要系统的学习HTML、CSS以及JavaScript,同时还要学习诸多框架的使用,内容多且繁杂,好在难度并不高,只是需要做大量的实验。前端的工具也并不仅限于以上提到的几种,随着前端开发的不断变化,以后软件厂商也会陆续推出更加方便的开发工具。
关注我,了解更多关于前端开发的内容。
学习前端开发的编程软件很多,不同的人有不同的爱好习惯和使用习惯,也有收费的和免费。sublime text3是一款非常不错的前端开发编辑器。本人也用此编辑器进行开发。原因有几个:
1.启动速度非常快,几乎是瞬间完成。
2.sublime 是一款轻量级的编辑器。
3.免费使用,但有一点:时不时弹出对话框叫你购买。
4.它有很多插件,这可以说是非常强功能的。比如emmet等,语法高亮等。
5.可以快速搭建文本,修改内容(包括一行多行都可以),快速查询、定位等。
对于像我这样屌丝级别的程序员,sublime编辑器已经足够。也非常推荐使用。
如果你真的想学习web前端,不应该纠结使用什么软件,而应该多学习知识,有自己的知识体系。目前市面上有很多web前端开发工具,会使人眼花缭乱,不知道该如何学则。
我建议:
1、刚开始可以先使用DW(DreamWeaver),
优点:是一款老牌前端开发工具,功能强大且组件丰富,作为前端开发的一款利器被广泛使用。DreamWeaver是一款可视化的前端开发工具,一边写代码一边就能看到效果,所以使用起来还是比较方便的。
缺点:DreamWeaver的缺点就是比较耗费系统资源,这也许是IDE类产品的通病。
2、等你有了一定的基础以后可以使用的软件就很多了,比如:Hbuilder、sublime text、Eclipse、Editplus……
web前端正确学习流程:
1HTML
第一阶段——HTML的学习。
超文本标记语言(HyperText Mark-up Language 简称HTML)是一个网页的骨架,无论是静态网页还是动态网页,最终返回到浏览器端的都是HTML代码,浏览器将HTML代码解释渲染后呈现给用户。因此,我们必须掌握HTML的基本结构和常用标记及属性。
HTML的学习是一个记忆和理解的过程,在学习过程中可以借助Dreamweaver的“拆分”视图辅助学习。在“设计”视图中看效果,在“代码”视图中学本质,将各种视图的优势发挥到极致,这种对照学习的方法弥补了单纯识记HTML标签和属性的枯燥乏味,想必对各位初学的小盆友们来说必定是极好的!
在学习了HTML之后,我们只是掌握了各种“原材料”的制作方法,要想盖一幢楼房就还需要把这些“原材料”按照我们设计的方案组合布局在一起并进行一些样式的美化。
2CSS
于是进入第二个阶段——CSS的学习。
CSS是英文Cascading Style Sheets的缩写,叫做层叠样式表,是能够真正做到网页表现与内容分离的一种样式设计语言。相对于传统HTML的表现而言其样式是可以复用的,这样就极大地提高了我们开发的速度,降低了维护的成本。
同时CSS中的盒子模型、相对布局、绝对布局等能够实现对网页中各对象的位置排版进行像素级的精确控制。通过此阶段的学习,我们就可以顺利完成“一幢楼房”的建设。
“楼房”建设完成之后,我们可以交给用户使用,但是如果想让用户获得更佳的体验,我们还可以对“楼房”进行更深一步的“装修”,让它看起来更“豪华”一些。
3JavaScript
为了完成这个任务,我们进入第三个阶段——JavaScript的学习。
JavaScript是一种在客户端广泛使用的脚步语言,在JavaScript当中为我们提供了一些内置函数、对象和DOM操作,借助这些内容我们可以来实现一些客户端的特效、验证、交互等,使我们的页面看起来不那么呆板,屌丝瞬间逆袭高富帅!有么有?
此时,也许你还沉浸在JavaScript给你带来的惊喜之中,但你的项目经理却突然对你大吼道:
“这个效果在××浏览器下不兼容,重新搞……”
“不兼容?”瞬间石化了有木有?
“我擦,坑爹啊!那可是花了我一个晚上写了几百行代码搞定的啊,吐血了都!”
JavaScript的兼容性和复杂性有时候的确让我们头疼,还好有“大神”帮我们做了封装。
4jQUery
接下来我们进入第四个阶段——jQUery的学习。
jQuery是一个免费、开源的轻量级的JavaScript库,并且兼容各种浏览器(jQuery2.0及后续版本放弃了对IE6/7/8浏览器的支持),同时现在有很多基于jQuery的插件可供选择。
这样在我们实现一些丰富的动态效果时更方便快捷,大大节省了我们开发的时间,提高了开发速度,这也充分体现了其write less,do more的核心宗旨。这个Feel倍儿爽!有么有?
“豪华大楼”至此拔地而起,但是每天这样日复一日,年复一年的盖楼,好繁琐!能不能将大楼里面每一个多带带部件模块化,当需要盖楼时就像堆积木一样组合在一起,这样岂不是爽歪歪?可以实现吗?答案是肯定的。
5前端框架
这种思想在Web前端开发中也是适合的,于是乎就出现了各种前端框架,在这里推荐给大家的是Bootstrap。
Bootstrap是Twitter推出的一个开源的用于前端开发的工具包,是一个CSS/HTML框架,并且支持响应式布局。一经推出后颇受欢迎,一直是GitHub上的热门开源项目。
在项目开发过程中,我们可以借助Bootstrap提供的CSS样式、组件、JavaScript插件等快速的完成页面布局和样式设置,然后再有针对性的微调样式,这样基于框架进行开发大大缩短了开发周期。站在巨人的肩膀上就是爽!
Web前端的学习建议
最后给大家聊聊在学习Web前端中的一些建议和方法。
在CSS布局时需要注意的一个问题是很多同学缺乏对页面布局进行整体分析,不能够从宏观上对页面中盒子间的嵌套关系进行把握,就急于动手去做,导致页面中各元素间的关系很混乱,容易出现盒子在浮动时错位等情况。
建议大家在布局时采用“自顶向下,逐步细化”的思想,先用几个盒子将页面从整体上划分,然后逐步在盒子中继续嵌套盒子。
“君子生非异也,善假于物也”,在学习的过程中还要多浏览一些优秀的网站,善于分析借鉴其设计思路和布局方法,见多方能识广,进而才可以融会贯通,取他人之长为我所用。
同时还要善于使用Firebug这个利器。Firebug一方面可以在我们学习过程中帮助我们调试自己的页面,另一方面我们可以使用Firebug方便地查看、分析别人网站的源代码,“偷”也是一种技能!
随着移动互联网热潮的到来,移动开发越来越受到大家的追捧,响应式布局、微网站等需求量不断增加,也是我们Web前端未来的发展方向之一,学有余力的同学可以多多关注。
3
回答10
回答0
回答0
回答2
回答0
回答10
回答10
回答0
回答4
回答