I like to learn new things.
When I experiment, I need a fast way to run a code snippet, do some debugging and figure out what is working and what is not.
Depending on the situation and mood 🌅 I switch between these setups:
VSCode
Most of the time I will write the code in my code_notes repository.
I have the simplest VSCode configuration possible:
{
"type": "node",
"request": "launch",
"name": "single file",
"program": "${file}"
}
With this config, VSCode will run currently opened file in the debugger.
Just hit F5 and look for the output in DEBUG CONSOLE.
Of course, you will have all the debugging goodies - read more here
VSCode + Quokka.js
To have 'live reload' for code evaluation check out Quokka.js
Quokka.js is a rapid prototyping playground for JavaScript and TypeScript. It runs your code immediately as you type and displays various execution results in your code editor.
I use it when I am just starting out with an idea.
It really helps to understand what effect has each line of the code.
Chrome Snippets
Sometimes the quickest way to run JavaScript is in Chrome directly.
Just open Developer Tools, switch to Sources tab and create a new code snippet. Snippets might be hidden under the >> icon.
Remember to wrap the code in {} to have a new local scope on each run.
Python Tutor
Don't be fooled by the name! It can run JavaScript also. And it even has a live mode too.
The cool thing about this tool is that it visualizes what is happening at each step.
It's great for educational purposes.
link
Top comments (6)
All of these are excellent!
Never heard of Python Tutor, fascinating.
I've also never used snippets, I just drop my whole
{}into console usually, then when I want to tweak I pressuparrow key and edit :vI glad you found it helpful :)
Holy moly, this one short article is enough to boost my Javascript skills by 50%. I'm surprised that it took me this long to find this gem, no other course or tutorial ever mentioned anything besides the Chrome console, which you can't set breakpoints in.
The browser, being javascripts original environment, is probably the best place to run code snippets, specially when they're meant for the web. Chromium-based browsers make this very easy with their developer tools.
Never heard about Quokka but it's amazing! Thanks for sharing, I'll definitely integrate this awesomeness into my usual workflow :)
:D