A prototyping server that just works.
Click to enlarge image:
Requires Node.js >=4.0.0.
$ npm install run-js --globalEnter a folder you want to run scripts in, and type run-js.
$ cd your/folder
$ run-jsIt 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.
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 <div> tag with an id of root, so that you can quickly append elements from a library, such as React.
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.
No need to go through the hullabaloo of setting up source maps. They're just there, and they just work.
When you make a change, the browser will automatically reload. Easy peasy.
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 <body> tag for this to work.)
run-js is powered by Browserify, and various transforms for it. I like 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... 😉. The transform installify is used automatically install new dependencies. Really cool stuff!
Aside from Browserify, run-js uses Express to power the web server. Nothing too fancy there, really. run-js has an in-memory cache powered by LevelUP and 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.
- @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's post about JavaScript fatigue: https://medium.com/@ericclemmons/javascript-fatigue-48d4011b6fc4
- Modules such as budo, beefy, and 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.