前端工程师常使用的编辑器/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. Alibaba(阿里) RocketMQ入门实例

    摘自:码友18年(www.mayou18.com) what is rocketMQ? RocketMQ作为一款分布式的消息中间件(阿里的说法是不遵循任何规范的,所以不能完全用JMS的那一套东西来看它 ...

  2. 使用SQL命令批量替换WordPress站点中图片的URL链接地址

    本文由荒原之梦原创,原文链接:http://zhaokaifeng.com/?p=689 前言: 本文记录了使用SQL命令批量替换URL的方法以及除了替换URL之外,网站更换图片URL地址所必须的其他 ...

  3. Ubuntu软件中心的完全启用

    新安装的Ubuntu英文版如果不做配置是无法使用Ubuntu软件中心下载或安装软件的,本文就简单介绍一下安装完Ubuntu后该做哪些配置才能完全启用Ubuntu软件中心. 安装完Ubuntu后我们要对 ...

  4. thymeleaf 专题

    Thymeleaf 之 内置对象.定义变量.URL参数及标签自定义属性 如标题所述,这篇文章主要讲述Thymeleaf中的内置对象(list解析.日期格式化.数字格式化等).定义变量.获取URL的参数 ...

  5. 浏览器中缓存Cache

        在请求服务器资源时,服务器会将图片.网页文件等资源保存在客户端的临时文件夹中,称为缓存,当浏览器向服务器请求相同的资源时,如果与服务器版本一致,则从缓存读取     Cookie:服务器存放在 ...

  6. pymongo的使用

    利用python操作mongodb需要导入pymongo库   pip install pymongo 1.连接mongodb     import pymongo     client = pymo ...

  7. 解决vi上下左右变ABCD问题

      第一步执行sudo apt-get install vim,如果没有出现错误,再次进入vi 尝试一下,看看有没有修改过来,如果出现以下错误E: Package 'vim' has no insta ...

  8. (一)Servlet简介

    相关名词解释 HTML:Hyper Text Markup Language,超文本标记语言 HTTP:Hyper Text Transfer Protocol,超文本传输协议 URL:Uniform ...

  9. ActiveJDBC 学习笔记

    官网: http://javalite.io/getting_started

  10. bzoj [Noi2002]Savage 扩展欧几里得

    枚举m,n^2判断 对于野人i,j,(H[i]+x*S[i])%m==(H[j]+x*S[j])%m,且x<=O[i]&&x<=O[j],他们才有可能相遇 化简得:(S[i ...