俗话说:工欲善其事,必先利其器。

工欲善其事必先利其器。谓工匠想要使他的工作做好,一定要先让工具锋利。比喻要做好一件事,准备工作非常重要。

前端写代码也是一样,需要一个好的适合自己的代码编辑器。

我想大多数人接触前端,都是从 dreamweaver 开始的。

    

dreamweaver大而全,面面俱到。 代码模式,设计模式,拆分模式,实时预览...

在前端这条路上,经常使用,即便是现在也会用用。它有个代码关联的功能:

    

    

到现在我使用的 sublime text 、WebStorm 也没有发现类似的插件,知道的朋友请告知一下,非常感谢。

dreamweaver 是不错的编辑器,它伴随了我的成长。

在前端这块,就会免不了html+css页面制作,当然写“纯洁的”JS除外。讲究效率,代码自动提示,自动完成,编辑器就应该有这样的功能,并且能适合你的需要。

最早使用 EditPlus 配置好自动提示完成文件,就可以使用,就是配置文件太麻烦了,需要时间去整理提示的文件。

现在我会使用 sublime text 、WebStorm 来完成页面的制作。

    

在这里说下 sublime text 2 的配置。

在官网http://www.sublimetext.com/ 下载或者其他地方,下载适合自己平台的版本。

前端不可少的插件:Emmet

    

安装Sublime text 2插件很方便:

  1.可以直接下载安装包解压缩到Packages目录

    Emmet插件:http://emmet.io/download/

  2.也可以先安装package control组件,然后直接在线安装

    在线安装Emmet,假设已经安装好package control组件。 按下Ctrl+Shift+P调出命令面板,输入install 调出 Install Package 选项并回车,然后在输入emmet,在列表中选中emet插件。

安装好Emmet,在熟悉它的语法,就可以“愉悦的”页面制作了。

  Emmet API: http://docs.emmet.io/cheat-sheet/

tips:dreamweaver也支持Emmet。安装使用参考:http://www.zhangxinxu.com/wordpress/2013/09/how-to-use-emmet-in-dreamweaver/

写代码的编辑器有很多,适合自己的才是最好的。当你是个“武林高手”的时候,草木树叶也可伤人,更是手中无剑胜有剑,哪怕是一个记事本也可以很愉悦的写代码。

一切从编辑器说起:web前端代码编辑器的更多相关文章

  1. Web 前端代码规范

    Web 前端代码规范 最后更新时间:2017-06-25 原始文章链接:https://github.com/bxm0927/web-code-standards 此项目用于记录规范的.高可维护性的前 ...

  2. 规范的web前端代码

    web前端的代码规范主要针对的是HTML,CSS和javaScript代码. 前端代码规范在不同场合会有差异,但是规范的前端代码应该具有以下特征: 1.符合标准 所谓的标准是指W3C指定的web标准, ...

  3. 前端代码编辑器ace 语法验证

    本文主要是介绍实际项目中如何加入语法检测功能.官方文档链接https://github.com/ajaxorg/ace/wiki/Syntax-validation 代码编辑器ace,使用webwor ...

  4. 前端代码编辑器ace 语法高亮

    代码编辑器codemirror和ace,都有接触过,主要是简单的api使用下.现在项目选用的ace.主要结合官网的文档,加入些自己的理解.官方原文链接https://ace.c9.io/#nav=hi ...

  5. Web前端代码规范与页面布局

    一.    规范目的: 为提高工作效率,便于后台人员添加功能及前端后期优化维护,输出高质量的文档,在网站建设中,使结构更加清晰,代码简明有序,有一个更好的前端架构,有利于SEO优化.   二.     ...

  6. 三、Brackets:一个好用的Web前端开发编辑器

    前言 如果你以前在使用 Dreamweaver 或 Zendstudio 编写HTML,CSS代码,那么你可以尝试使用这个编辑器.他的界面简洁,舒服. 介绍 免费.开源.跨平台的前端开发环境(只是前端 ...

  7. web前端代码规范——css代码规范

    Bootstrap CSS编码规范 语法 用两个空格来代替制表符(tab) -- 这是唯一能保证在所有环境下获得一致展现的方法. 为选择器分组时,将单独的选择器单独放在一行. 为了代码的易读性,在每个 ...

  8. 关于web前端代码艺术

    以前一直都以为html代码要分离得很好,html一个文件,css一个文件,js一个文件,然后最好一个html页面里面不要要太多冗余的代码,不要恶心地引入一个又一个的js,连jquery的引入我都觉得有 ...

  9. 前端代码编辑器ace 语法提示 代码提示

    本文主要是介绍ace编辑器的语法提示,自动完成.其实没什么可特别介绍的,有始有终吧,把项目中使用到的ace的功能都介绍下. { enableBasicAutocompletion: false, // ...

随机推荐

  1. Ajax动态载入xml文件内容

    <%@page import="javax.swing.JOptionPane"%> <%@page import="com.ctl.util.*&qu ...

  2. MySQL 触发器结构及三个案例demo

    --你必须拥有相当大的权限才能创建触发器(CREATE TRIGGER),如果你已经是Root用户,那么就足够了.这跟SQL的标准有所不同. CREATE TRIGGER语法 CREATE TRIGG ...

  3. TP 控制器扩展_initialize方法实现原理

    参考网址:http://gongwen.sinaapp.com/article-59.html 控制器扩展接口 系统Action类提供了一个初始化方法_initialize接口,可以用于扩展需要,_i ...

  4. Service组件 总结 + 绑定理Service三种实现方式 Messager + Binder + AIDL

    在Android中进程按优先级可以分为五类,优先级从高到低排列: - 前台进程 该进程包含正在与用户进行交互的界面组件,比如一个Activity - 可视进程 该进程中的组件虽然没有和用户交互,但是仍 ...

  5. 百度经纬度和google经纬度互转

    原文:百度经纬度和google经纬度互转 百度地图的坐标转换,由于百度地图在GCJ02协议的基础上又做了一次处理,变为 BD09协议的坐标,以下是坐标的转化方式,可以方便和其他平台转化 private ...

  6. OpenCV, color reduction method

    转载请注明出处!!!http://blog.csdn.net/zhonghuan1992 OpenCV, colorreduction method 目标: 这次学习的目标是回答以下的几个问题: 1 ...

  7. 解决.net的堆碎片化带来的内存占用过大的问题

    场景 使用WCF开发的服务端在多个客户端登录后,其服务器的内存占用不断增加. 分析 使用Windbg分析得到内存碎片化严重,其中包含了非常大的空闲空间,最大的一块竟然有150M,真正使用的空间其实很小 ...

  8. poj 1789 Truck History(kruskal算法)

    主题链接:http://poj.org/problem?id=1789 思维:一个一个点,每两行之间不懂得字符个数就看做是权值.然后用kruskal算法计算出最小生成树 我写了两个代码一个是用优先队列 ...

  9. 轻松管理您的网络password

    在互联网在现在这个时代,,我们注册了很多帐户.支付宝账号password,各种宝账户password.微信,QQ,电话password,购买各种网站,金融password,它是不是让孩子们的鞋子瞬间淡 ...

  10. oracle查询和编写数据字典

    在项目交付时假设须要编写数据字典,能够採用以下的方法.首先执行以下的sql语句 SELECT A.TABLE_NAME AS 表名, A.COLUMN_NAME AS 字段名, DECODE(A.CH ...