前端工程师常使用的编辑器/IDE

  • 本地在线工具

    webstrom 推荐指数 *****

    vs code 推荐指数 ****

    atom 推荐指数 ****

    subline-text 推荐指数 ****

  • 电脑系统的工具

    各自系统自带的文本编辑器,例如windo的记事本 推荐指数 **

    或者Notep++ 推荐指数 ***

    又或者vim 等等 推荐指数 ****

  • 网络在线编辑平台

    Codepen.io

    JSBin

    JSFiddle

    CodeAnywhere

    Koding

几款常用的Markdown编辑器

面向前端开发者:

  • Typor 官网 推荐指数*****

  • MarkdownPad2 官网 推荐指数*****

  • Atom 官网 推荐指数***

  • Vs code 官网 推荐指数***

按用户场景分:

  • Markdown编辑器后,将它们归纳为三类

    1. 文库集成类:与在线文库相集成,代表有Modoko、GibBook、简书
    2. 独立软件类:独立产品,编辑本地文件,代表有MarkdownEditor、Typor、Haroopad等
    3. 编辑器插件类:在主流编辑器上扩展插件,代表有WebStorm、Atom、Sublime Text。
  • 这三类软件分别面向三类Markdown用户。

    1. 重量型用户,即文字工作者,他们需要撰写大量的文章,甚至是写一本树书,对文档的组织有明确要求。
    2. 轻量型用户,典型的是博客写手,他们要写中等长度的文章,文章的保存和发表交给博客网站。
    3. 偶然用户,通常是开发者,他们需要为程序撰写说明文档,例如readme.md

可以说是有了不同的用户需求,催生了不同类别的工具。当我们要选择Markdown编辑器时,我们应当先定位自己的需求,然后考察哪些工具可以满足自己的需求,最后从这里面选择佼佼者。

Markdown的语法

标题

一级标题 语法:# 一级标题(最大)

二级标题 语法:## 二级标题

三级标题 语法:### 三级标题

四级标题 语法:#### 四级标题

五级标题 语法:##### 五级标题

六级标题 语法:###### 六级标题(最小)

列表

有序列表

数字加点
语法:1. 有序列表 => 1.有序列表
2. 有序列表 => 2.有序列表
2. 有序列表 => 3.有序列表

无需列表

用 + 或者 - 或者 * 来表示
语法: + 无序列表 => .无序列表
* 无序列表 => .无序列表
- 无序列表 => .无序列表

列表嵌套

上一级和下一级之间敲三个空格即可

  • 一级无序列表内容

    • 二级无序列表内容
    • 二级无序列表内容
    • 二级无序列表内容
  • 一级无序列表内容

    1. 二级有序列表内容
    2. 二级有序列表内容
    3. 二级有序列表内容
  1. 一级有序列表内容

    • 二级无序列表内容
    • 二级无序列表内容
    • 二级无序列表内容
  2. 一级有序列表内容

    1. 二级有序列表内容
    2. 二级有序列表内容
    3. 二级有序列表内容

超链接

语法:[超链接名](超链接地址)
例如:[淘宝](https://www.taobao.com) => 显示:淘宝

引用

在文字前面加上">"这个字符,例如:  >我是引用
可以在文字前面加多个">", 例如加两个: >>我是二级引用

图片

语法:![图片alt](图片地址 ''图片title'')

代码

语法:
单行代码:代码之间分别用一个反引号包起来 例如: `console.log("单行代码")`
代码块:代码之间分别用三个反引号包起来,且两边的反引号单独占一行
例如:
```
function(){...}...
function(){...}...
function(){...}...
```

表格

语法:

学生|学号|性别
-|-|-|
张三|001|男|
李四|002|男|
李华|003|女|

显示如下:

学生 学号 性别
张三 001
李四 002
李华 003

又例如:

 name | 111 | 222 | 333 | 444
- | :-: | :-: | :-: | -:
aaa | bbb | ccc | ddd | eee|
fff | ggg| hhh | iii | 000|

显示如下:

name 111 222 333 444
aaa bbb ccc ddd eee
fff ggg hhh iii 000

Web前端 前端工程师首选的几款编辑器/IDE以及Markdown的编辑器、语法的更多相关文章

  1. 从就业面分析web前端开发工程师就业前景(2011.6)

    案例一 公司名称:法国电信北京研发中心 工作地点:北京 联系方式:hao.luan@orange-ftgroup.com 栾先生 岗位名称:web 前端开发工程师 岗位要求: 1. 计算机或相关专业本 ...

  2. [转] Web前端开发工程师常用技术网站整理

    1.常用工具相关 有道云笔记 http://note.youdao.com/signIn/index.html 36镇-最好用的共享收藏夹 http://www.36zhen.com/ 浏览器同步测试 ...

  3. Web前端开发工程师常用技术网站整理

    1.常用工具相关 有道云笔记 http://note.youdao.com/signIn/index.html 36镇-最好用的共享收藏夹 http://www.36zhen.com/ 浏览器同步测试 ...

  4. Web前端开发工程师需要掌握哪些核心技能?

    Web前端开发所涉及的内容主要包括W3C标准中的结构.行为和表现,那么这三项中我们需要掌握的核心技能是什么呢? 1.开发语言 HTML发展历史有二十多年,历经多次版本更新,HTML5和CSS3的出现又 ...

  5. [转载]Web前端开发工程师编程能力飞升之路

    [背景] 如果你是刚进入web前端研发领域,想试试这潭水有多深,看这篇文章吧:如果你是做了两三年web产品前端研发,迷茫找不着提高之路,看这篇文章吧:如果你是四五年的前端开发高手,没有难题能难得住你的 ...

  6. Web前端开发工程师养成计划【转载】

    Web前端开发工程师养成计划(入门篇) 最原始的忠告:这个世界上有想法的人很多,但是有想法又能实现它的人太少! 首先要感谢伟大的Web2.0概念.产品概念.用户体验概念.jQuery插件,是它们在中国 ...

  7. [web建站] 极客WEB大前端专家级开发工程师培训视频教程

    极客WEB大前端专家级开发工程师培训视频教程  教程下载地址: http://www.fu83.cn/thread-355-1-1.html 课程目录:1.走进前端工程师的世界HTML51.HTML5 ...

  8. 【转】Web前端研发工程师编程能力飞升之路

    分类: Javascript | 出自 海玉的博客 今天看到这篇文章.写的非常有意思.发现自己还有很长的一段路要走. [背景] 如果你是刚进入WEB前端研发领域,想试试这潭水有多深,看这篇文章吧: 如 ...

  9. Web前端开发工程师基本要求

    一位好的Web前端开发工程师在知识体系上既要有广度,又要有深度,所以很多大公司即使出高薪也很难招聘到理想的前端开发工程师.现在说的重点不在于讲解技术,而是更侧重于对技巧的讲解.技术非黑即白,只有对和错 ...

随机推荐

  1. S7-200与SMART 200之间进行数据通讯与监控

    S7-200与SMART 200之间进行数据通讯与监控 准备物品:S7-200PLC.SMART200.SCANET模块*2.交换机*1.网线若干. (连接示意图一) 1.在STEP7-MircoWi ...

  2. Notify和NotifyAll的区别?

    Notify和NotifyAll都是用来对对象进行状态改变的方式,只是他们的作用域不太一样,从字面上就能看的出来,当对象被上锁之后,当其他的方法要去访问该对象中的数据,就需要该对象对其进行解锁,当然, ...

  3. How to untar a TAR file using Apache Commons

    import org.apache.commons.compress.archivers.tar.TarArchiveEntry; import org.apache.commons.compress ...

  4. 连接Redis后执行命令错误 MISCONF Redis is configured to save RDB snapshots

    今天在redis中执行setrange name 1 chun 命令时报了如下错误提示: (error) MISCONF Redis is configured to save RDB snapsho ...

  5. Python set() 函数

    描述 set() 函数创建一个无序不重复元素集,可进行关系测试,删除重复数据,还可以计算交集.差集.并集等. 语法 set 语法: class set([iterable]) 参数说明: iterab ...

  6. Windows下python3和python2同时安装python2.exe、python3.exe和pip2、pip3设置

    1.添加python2到系统环境变量 打开,控制面板\系统和安全\系统,选择高级系统设置,环境变量,选择Path,点击编辑,新建,分别添加D:\Python\python27和D:\Python\py ...

  7. [python3.5][PyUserInput]模拟鼠标和键盘模拟

    一.PyUserInput安装 python3.5的PyMouse和PyKeyboard模块都集成到了PyUserInput模块中.在python3.5中,直接安装PyUserInput模块即可 Py ...

  8. go语言nsq源码解读二 nsqlookupd、nsqd与nsqadmin

    nsqlookupd: 官方文档解释见:http://bitly.github.io/nsq/components/nsqlookupd.html 用官方话来讲是:nsqlookupd管理拓扑信息,客 ...

  9. linux学习之路(2)

    1.输入输出重定向  输入重定向中用到的符号及其作用 命令 < 文件 将文件作为命令的标准输入 命令 << 分界符 从标准输入中读入,直到遇见分界符才停止 命令 < 文件 1 ...

  10. xamarin android网络请求总结

    xamarin android中网络请求的框架非常多,在项目中使用的是第三方的一个网络请求框架restsharp,应该是github上.net网络请求最多star的框架,没有之一.这里就简单汇总了其他 ...