Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/remixz/run-js
A prototyping server that just works.
https://github.com/remixz/run-js
Last synced: 20 days ago
JSON representation
A prototyping server that just works.
- Host: GitHub
- URL: https://github.com/remixz/run-js
- Owner: remixz
- License: mit
- Created: 2015-12-29T09:20:45.000Z (almost 9 years ago)
- Default Branch: master
- Last Pushed: 2016-02-29T22:05:46.000Z (over 8 years ago)
- Last Synced: 2024-10-27T08:43:09.045Z (24 days ago)
- Language: JavaScript
- Homepage:
- Size: 63.5 KB
- Stars: 188
- Watchers: 5
- Forks: 12
- Open Issues: 10
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE.md
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
README
# run-js
[![Build Status](https://travis-ci.org/remixz/run-js.svg?branch=master)](https://travis-ci.org/remixz/run-js)
[![Coverage Status](https://coveralls.io/repos/remixz/run-js/badge.svg?branch=master&service=github)](https://coveralls.io/github/remixz/run-js?branch=master)
[![npm version](https://img.shields.io/npm/v/run-js.svg)](https://www.npmjs.com/package/run-js)
[![js-standard-style](https://img.shields.io/badge/code%20style-standard-brightgreen.svg)](http://standardjs.com/)A prototyping server that just works.
*Click to enlarge image:*
[![run-js demo](https://s3.amazonaws.com/f.cl.ly/items/3U1J411P0L3x092D2h3F/run-js-demo2.gif)](https://s3.amazonaws.com/f.cl.ly/items/3U1J411P0L3x092D2h3F/run-js-demo2.gif)## Installation
Requires Node.js >=4.0.0.
```bash
$ npm install run-js --global
```## Usage
Enter a folder you want to run scripts in, and type `run-js`.
```bash
$ cd your/folder
$ run-js
```It will print out the URL it's running on. From there, just visit any of your scripts in the browser, and they'll just work.
For API usage, [see the documentation file.](docs/api.md)
## Features
### Instantly working scripts
There's no HTML files you have to create, no compile steps for your code to work, and no need to even manually install dependencies. Just start `run-js` in a folder, write some code, and open it in the browser. `run-js` supports JavaScript (with ES2015 and JSX enabled via Babel), CoffeeScript, and TypeScript out of the box. When you require a dependency, `run-js` will automatically install it for you, if it's not installed already. Plus, the default HTML page includes a `
` tag with an `id` of `root`, so that you can quickly append elements from a library, such as React.### Scripts as the index file
Creating a file named `index.js` (or whatever type of file you prefer) will act as the index for the path you specify. For example, creating `index.js` in the root of where you ran `run-js` will use that script when you visit `http://localhost:60274`.
### Source maps
No need to go through the hullabaloo of setting up source maps. They're just there, and they just work.
### Live reload
When you make a change, the browser will automatically reload. Easy peasy.
### Custom HTML pages
By default, `run-js` will render a page when you visit a file in the browser. However, if you need your own custom page, it's easy to do. Just create a `.html` file with the same name as your script. For example, if you had `foo.js`, create a `foo.html` in the same folder, and it'll use that for the template. It'll automatically insert your compiled script as well. (*Make sure to have a `` tag for this to work.*)
## Implementation
run-js is powered by [Browserify](https://github.com/substack/node-browserify), and various transforms for it. I like [Webpack](https://github.com/webpack/webpack) as well, but I enjoy working with Browserify more, and find it easier to use overall, while still being able to do what I want to. I don't think run-js will need to change to Webpack, or some other future bundler, to get the functionality that's wanted. Of course, that could change... :wink:. The transform [installify](https://github.com/hughsk/installify) is used automatically install new dependencies. Really cool stuff!
Aside from Browserify, run-js uses [Express](https://github.com/strongloop/express) to power the web server. Nothing too fancy there, really. run-js has an in-memory cache powered by [LevelUP](https://github.com/Level/levelup) and [MemDOWN](https://github.com/level/memdown). That could be migrated to a file cache pretty easily, but I'm not sure if it's really needed. It might be in the future, though, which is why I used LevelUP.
## Inspiration
* [**@vjeux**](https://github.com/vjeux)'s challenge to create a better JavaScript prototyping environment: http://blog.vjeux.com/2015/javascript/challenge-best-javascript-setup-for-quick-prototyping.html
* [**@ericclemmons**](https://github.com/ericclemmons)'s post about JavaScript fatigue: https://medium.com/@ericclemmons/javascript-fatigue-48d4011b6fc4
* Modules such as [budo](https://github.com/mattdesl/budo), [beefy](https://github.com/chrisdickinson/beefy), and [wzrd](https://github.com/maxogden/wzrd), which all do a lot of what run-js does, but with less defaults, and just for running one file. I like those modules a lot, and I think they definitely work for a different type of workflow. The main difference with run-js is that it's aimed a bit more towards newbies, hence why it runs any file in the directory. Essentially, run-js is a playground: Everything just goes, and it's lots of fun! It's not really meant for serious work, but instead just trying things out.