今天来推荐六个好用又免费的在线代码编辑器!

CodeSandbox

CodeSandbox 是一个在线代码编辑器,主要用于创建 Web 应用项目,其提供了多种模块:

CodeSandbox 为前端开发提供了完整的代码编辑器体验和沙盒环境。其包含了很多实用功能:

  • Npm 支持:可以添加几乎任何 npm 上可用的包;
  • 支持 TypeScript、热更新、GitHub 导出、静态文件托管等;
  • 使用 Monaco 编辑器构建,Monaco 是为 VSCode 的提供支持的代码编辑器,有很多相似的体验;
  • 集成的 DevTools、linting、错误覆盖、测试框架 (Jest)等;
  • 强大的 CLI 可以直接将本地项目导入 CodeSandbox。

在线地址:https://codesandbox.io/

Codepen

CodePen 是一个在线的HTML、CSS 和 JavaScript 代码编辑器,能够编写代码并即时预览效果,可以利用它来构建和分享代码。CodePen 支持使用 Less、Sass、PostCSS 等来编写CSS。CodePen 不仅是一个在线编辑器,还是一个庞大的前端社区,上面有来自全球开发者分享的各种各样炫酷的效果,并且这些代码都是开源和共享的。

在线地址:https://codepen.io/

Stackblitz

Stackblitz 和 VSCode 非常像,使用简单可以一键创建 React、Vue、Vanilla、RxJS、TypeScript、Angular 等项目:

Stackblitz 具有以下特性:

  • 在浏览器中集成了一个 Dev Server,在离线的情况下仍然可以进行开发;
  • 除了支持前端项目外,还支持在浏览器中运行 Node.js 环境;
  • 支持连接 GIthub 仓库,可以直接将代码 push 到  Github 上,也可以拉取 Github 项目进行查看和编辑;
  • 所有应用程序都会自动部署在其服务器上。

在线地址:https://stackblitz.com/

JSFiddle

JSFiddle 是一个在线代码编辑器,允许用户在单个页面上编辑和运行 HTML、JavaScript 和 CSS 代码。JSFiddle 使用 CodeMirror 构建,其提供了多游标、语法高亮、语法验证(linter)、大括号匹配、自动缩进、自动完成、代码/文本折叠、搜索和替换以协助开发人员的操作。JSFiddle 被广泛用于共享简单的测试和演示。

在线地址:http://jsfiddle.net/

JS Bin

JS Bin 是一个开源的协同 web 开发调试工具。主要用于帮助测试 JavaScript 和 CSS 的代码片段,功能与 jsFiddle 类似。可以实时分享在 JS Bin 中输入的内容,在任何平台上的任何设备上查看 JS Bin 的输出,都是实时更新的。

在线地址:https://jsbin.com/

码上掘金

码上掘金是一个为广大开发者提供代码在线 Playground 的平台,具备轻量简单、易使用、现代标准、模块化、实时编辑,所见即所得等特性。内置了 ES Modules 支持,并且支持 React、Vue 等流行前端框架。

在线地址:https://code.juejin.cn/

六个好用的在线代码编辑器,你选哪个?相关推荐

  1. CodeMirror 5.26.0 发布,在线代码编辑器

    CodeMirror 5.26.0 已发布,CodeMirror 是一款"Online Source Editor",基于 Javascript,短小精悍,实时在线代码高亮显示,它 ...

  2. Codemirror-开源在线代码编辑器

    Codemirror是一款"Online Source Editor",基于Javascript,短小精悍,实时在线代码高亮显示,他不是某个富文本编辑器的附属产品,他是许多大名鼎鼎 ...

  3. 20个最强的基于浏览器的在线代码编辑器 - OPEN资讯

    20个最强的基于浏览器的在线代码编辑器 - OPEN资讯 20个最强的基于浏览器的在线代码编辑器

  4. (视频) 《快速创建网站》 3.2 WordPress多站点及Azure在线代码编辑器 - 扔掉你的ftp工具吧,修改代码全部云端搞定...

    本文是<快速创建网站>系列的第6篇,如果你还没有看过之前的内容,建议你点击以下目录中的章节先阅读其他内容再回到本文. 访问本系列目录,请点击:http://devopshub.cn/tag ...

  5. 在线代码编辑器 CodeMirror 配置说明 - javascript开发的代码语法高亮显示引擎

    CodeMirror是一款在线的支持语法高亮的代码编辑器.官网: http://codemirror.net/ 下载后,解压开得到的文件夹中,lib下是放的是核心库和核心css,mode下放的是各种支 ...

  6. au如何关闭预览编辑器_在线IDE开发入门之从零实现一个在线代码编辑器

    前言 3年前在AWS re:Invent 大会上AWS 宣布推出 Cloud9, 用于在云端编写.运行和调试代码,它可以直接运行在浏览器中,也就是传说中的 Web IDE.3年后的今天随着国内云计算的 ...

  7. WebRTC与Ace在线代码编辑器合作,实现实时协作编程

    为什么80%的码农都做不了架构师?>>>    日期:2013-5-17  来源:GBin1.com 距离WebRTC真正的应用到一些很酷的应用中还有一段时日,但是即便是这样,很多开 ...

  8. CodeMirror 多功能在线代码编辑器

    CodeMirror 是一款允许在浏览器中使用的多功能文本编辑器,专用于编辑代码,并附带超过 100 种语言模式和各种插件,可实现高级的代码编辑功能,包括代码高亮显示.功能扩展以及多个主题样式 Cod ...

  9. 127.0.0.1 zxt.php_php单文件版在线代码编辑器使用方法

    这篇文章主要介绍了php单文件版在线代码编辑器,个人感觉相当不错,分享给大家,需要的朋友可以参考下 密码加密方式: * md5(自设密码+$ace) //$ace为cdn镜像地址 使用方法: * 1. ...

  10. 程序员最爱用的在线代码编辑器合集,哪款是你的最爱?

    程序员最爱用的在线(在线IDE)分享合集,有没有你最爱用的? TitanIDE 首当其冲,TitanIDE(云原生集成开发环境),打开浏览器即可编码,快捷方便,最主要的优势概括为以下几点: 1.多内核 ...

最新文章

  1. poj3259(SPFA算法)
  2. 项目中遇到的问题—遍历对象里面的数组
  3. Android标题栏,状态栏
  4. ssh登录远程服务器_设置iTerm2免密登陆ssh远程服务器
  5. JavaScript 中 Number
  6. 分布式文件系统的实现
  7. Java基础教程之Java的变量
  8. 【C语言】04-函数
  9. STM32F429 之EXTI外部中断
  10. The English (Porter2) stemming algorithm
  11. 计算机itpt证书有什么用,ITPT信息技术应用专业能力培训项目认证课程体系表.pdf...
  12. ROS暑期学校与ROSCon 2018
  13. nodejs+vue+elementui手办多商家商城交易平台
  14. 智能财务报表OCR识别系统
  15. python伪造邮件发件地址_Python3学习系列(四):编写属于自己的邮件伪造工具...
  16. C++实现Python变量
  17. 【云原生之Docker实战】使用Docker部署phpMyAdmin数据库管理工具
  18. 网易邮箱账号OAuth2.0认证文档
  19. 免费ppt模板下载的网站推荐
  20. 解决国产服务器系统uos浏览器无法启动

热门文章

  1. 高职医学计算机考试科目一模拟试题,医学影像技术考试题库
  2. 第八章 配接器 adapters
  3. PostgreSQL 数据库跨版本升级常用方案
  4. Leetcode--Java--212. 单词搜索 II
  5. 第68页的gtk+编程例子——选择菜单
  6. (十九)论文阅读 | 目标检测之SNIP
  7. 自动抢某投资公司的理财产品预购
  8. STM32显示图片,将图片转换为十六进制数组便捷工具
  9. c语言中个各标点符号作用,C语言运算符和标点符号.xls
  10. 12个开源的后台端管理系统