Different ways to try JavaScript code you may not be aware of: REPL tools for JS

5 min readFeb 3, 2020

If you are a JavaScript developer, much or less, you will encounter cases when you would like to try some of you code, either for experimentation, self learning or brainstorming/prototyping or other purposes.

REPL stands for read–eval–print loop , also termed an interactive toplevel or language shell, is a simple, interactive computer programming environment that takes single user inputs (i.e., single expressions), evaluates (executes) them, and returns the result to the user; a program written in a REPL environment is executed piecewise.

Below are a few approaches, you may or may not be aware of, which are useful to quickly try your JS code.

1. QUOKKA

Quokka.js is a developer productivity tool for rapid JavaScript / TypeScript prototyping. Runtime values are updated and displayed in your IDE next to your code, as you type.

Quokka ‘Community’ edition is free for everyone, and it also offers a commercial ‘Pro’ edition that provides a number of additional advanced features, such as the ability to display and explore runtime values without having to modify your code.

Quokka.js ships plugins or extensions for:

JetBrains IDE
VS Code
Atom
Sublime

Very nice tools!

2. Runkit notebook

RunKit notebooks completely remove the friction of trying new ideas. With one click you’ll have a sandboxed JavaScript environment where you can instantly switch node versions, use every npm module without having to wait to install it, and even visualize your results. No more configuration, just straight to coding.

URL: https://runkit.com/home

Using browser developer tools
Using node.js in terminal command line mode
Using Jsfiddler

3. Hopa

Hopa is a zero config JavaScript/TypeScript runner right in your terminal.

Usage:

Install hopa using npm
Go to the folder that contains your files and run hopa.
Pick a file to run

> npm i hopa -g
> hopa
> hopa -i script.js -o bundle.js -m

Git Repo: https://github.com/krasimir/hopa

4. Ramda REPL

A repl (read-eval-print-loop) for Ramda.js, but supports general Javascript code as well.

Git Repo: https://github.com/ramda/repl
Online URL: https://ramdajs.com/repl/

5. JSComplete playground

This is a playground for JavaScript and React. You can use it to test simple code or prototype ideas. It requires a modern browser that understands ES2015 (ES6).

URL: https://jscomplete.com/playground

6. VSCode extensions

Javascript REPL

Javascript REPL is a javascript playground for Visual Studio Code with live feedback(logs or errors) as you type, besides your code, in a log explorer, or in an output channel. It supports Javascript, TypeScript, CoffeeScript and it can be used for development in Node.js projects or with front-end frameworks like React, Vue, Angular, Svelte etc.

URL: https://marketplace.visualstudio.com/items?itemName=achil.vscode-javascript-repl

Another VS code extension: Node.js REPL

Node.js Interactive Window (REPL) for Visual Studio Code using Node.js command line right in your favorite IDE. Simply press CTRL + SHIFT + P and launch “Node.js Interactive window (REPL)”.

This is a preview and I would really love some feedback if something is not working as it should.

URL: https://marketplace.visualstudio.com/items?itemName=lostfields.nodejs-repl

7. WebStorm Interactive Debugger Console

The interactive Console pane in WebStorm shows you stack traces and everything that was logged in your code (for example, using console.*).

The Console pane is also a read-eval-print loop (REPL) so you can run JavaScript code snippets in it and interact with the page that you are currently debugging.

8. Repl.it

A tool for writing and running JavaScript in your browser.URL: https://repl.it/languages/nodejs

9. Node.js Console — REPL

Node.js comes with REPL environment as a quick and easy way to test JavaScript code.

To launch the REPL (Node shell), open command prompt (in Windows) or terminal (in Mac or UNIX/Linux) and type node as shown below. It will change the prompt to > in Windows and MAC.

Goto this excellent tutorial for more details.

10. CodeSandBox

CodeSandbox Containers executes your code on a server, which allows you to work on any JavaScript project that works locally. Feature rich! As shown in below snapshot.

Watch below tutorial to have a taste of it.

11. Jsfiddle

JSFiddle is an online IDE service and online community for testing and showcasing user-created and collaborational HTML, CSS and JavaScript code snippets, known as ‘fiddles’.

URL: https://jsfiddle.net/