jsbin 4.1版本的本地搭建

jsbin是一种开放源码的协同Web开发调试工具(http://jsbin.com/?html,output)。其优点是可以快速的提供前端需要的各种开发环境,快速地编辑代码,并实时显示页面最终的效果。

其实类似的在线代码运行工具有很多,比较有名的有codepen、runjs、codeanywhere等等。但jsbin的一个显著特点是开源。开发者们可以在自己的爱机上搭建一套自己的运行环境。这个应该是众多前端程序员儿时的梦想吧,amosworker(本人)也一样。

虽然在github上有开源的代码可以直接拷贝,也有说明文档,但搭建的过程并不是特别风顺的。在解决了遇到的所有问题后,amosworker想在此和大家分享一下搭建的方法,希望对大家有用。

Git clone

首先需要从 https://github.com/jsbin/jsbin 下载到源码。也可以用npm来直接安装源代码,但本人试了几次都不能成功。

于是采用了git clone的方法直接将代码拉取到本地。

安装

拉取完成后,运行

进行安装。(在此需要注意一下,node的版本需要为7.x)

如果遇到npm安装不成功,作者建议用yarn来安装。

安装成功后迫不及待的运行

发现直接报错

接下来就是要创建jsbin的数据库了。

先建立数据库

在build文件夹中找到一个full-db-v3.mysql.sql的文件,复制里面的sql语句,在workerbench里执行。然后启动数据库。运行bin/json 命令就可以启动jsbin的服务了。

注册本地用户

随意输入用户名、邮箱和密码就可以完成注册,不用进行邮箱确认

有了用户名我们就可以保存我们的劳动成果了O(∩_∩)O哈哈~

解决output无法运行的问题

在html中输入代码后,发现在右侧的output,没有任何反应。打开控制台后,发现output里有一连串的404报错。

另外,还会有一个路径是“*/blog/all.json” 的404报错,我们可以建一个public/blog/all.json的空文件来解决,或者将public/js/chrome/welcome-panel.js里的关于all.json的ajax请求注释掉。

到这里,本地的jsbin终于可以正常运行了。O(∩_∩)O哈哈~

本文来自企鹅号 - amos开发日记媒体

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏Seebug漏洞平台

DeDeCMS v5.7 密码修改漏洞分析

织梦内容管理系统(DedeCms)以简单、实用、开源而闻名,是国内最知名的PHP开源网站管理系统,也是使用用户最多的PHP类CMS系统,在经历多年的发展,目前的...

48880
来自专栏日常学python

30行Python代码实现自动收发邮件

生活或者工作中我们经常容易忘记一些事情,这时候我们需要借助一些事物来提醒我们。读者中应该有很多运维攻城狮和测试攻城狮,服务器有异常时需要提醒我们,自动化测试执行...

25230
来自专栏北京马哥教育

能当主力,能入虚拟机,还能随时打包带走,Linux 就是这么强大

这里介绍一下自己管理自己的Linux桌面的一点经验吧,我觉得还是有不少可取之处的。先来说一下大多数人管理Linux桌面的方法有哪些不方便的地方吧:

29600
来自专栏喵了个咪的博客空间

[喵咪MQ(3)]RabbitMQ集群安装配置

[喵咪MQ(3)]RabbitMQ集群安装配置 ? 在各项生产环境使用中,容灾总是一个很重要的话题,如果单点故障会导致整个系统奔溃或者是丢失数据是不是好气好气的...

37760
来自专栏实用工具入门教程

如何部署邮件服务

邮件服务器是一种应用程序,它使我们能够以电子邮件的形式在组织的不同用户之间或在其外部发送消息,而不依赖于他们所连接的网络。我们将在邮件服务器中使用的基本术语是:...

66730
来自专栏24K纯开源

mac下利用Breakpad的dump文件进行调试

一、前情回顾 最近把公司的一个视频处理程序更新了一个版本,准备提交测试的发现了崩溃的情况。这个程序采用Qt和ffmpeg技术栈开发,主要用于对视频进行渲染拼接处...

73790
来自专栏Java工程师日常干货

【SpringBoot专题】监控健康状况前言监控插件:actuatorSpring Boot Admin:可视化后台管理系统总结

想一想,我们以前是如何监控一个Java应用的监控状况的?一般而言,我们会在Linux服务器上通过一些命令,比如通过jstat来统计堆内存的使用情况/垃圾回收的情...

86520
来自专栏Seebug漏洞平台

DeDeCMS v5.7 密码修改漏洞分析

作者:LoRexxar'@知道创宇404实验室 0x01 背景 织梦内容管理系统(DedeCms)以简单、实用、开源而闻名,是国内最知名的PHP开源网站管理...

465110
来自专栏杨建荣的学习笔记

PostgreSQL主备环境搭建

PG学习初体验--源码安装和简单命令(r8笔记第97天) 记得在2年前写过一篇PostgreSQL的文章,当时处于兴趣,本来想在工作中接一下PG的业务,最后因为...

47460
来自专栏Linyb极客之路

如何打造一个高并发,处理海量数据,高性能,易扩展,可伸缩,高可用的网站?

简而言之,采用分布式系统,分布式应用和服务,分布式数据和存储,分布式静态资源,分布式计算,分布式配置和分布式锁。

22730

扫码关注云+社区

领取腾讯云代金券