Lightweight JavaScript IDE

[Wictorian]

Is there a simple lightweight JavaScript IDE? Like IDLE for Python? Running with browser is cool but you can't see the errors. And IDES like WebStorm are too heavyweight for my laptop.

 

[Slottr]

VS

[trag1c]

I've been using VS code with a live server plugin and the console within chrome. Gets the job done.

[Wictorian]

39 minutes ago, trag1c said:

I've been using VS code with a live server plugin and the console within chrome. Gets the job done.

Running the code is not the issue, running the IDE is. I will try it but I hope it is lightweight. How do you use chrome console? I use MS Edge (it is built with chromium) I guess it would work.

[Wictorian]

1 hour ago, Slottr said:

VS

You mean regular Visual Studio? Isn't that pretty heavyweight?

[Slottr]

24 minutes ago, Wictorian said:

You mean regular Visual Studio? Isn't that pretty heavyweight?

Sorry no- VS Code.

[Chris Pratt]

1 hour ago, trag1c said:

I've been using VS code with a live server plugin and the console within chrome. Gets the job done.

VS Code now has an integrated JS debugger. It's in the latest release.

[trag1c]

3 hours ago, Wictorian said:

Running the code is not the issue, running the IDE is. I will try it but I hope it is lightweight. How do you use chrome console? I use MS Edge (it is built with chromium) I guess it would work.

When you enter the inspection window when viewing a web page they have a tab for the console.

[Wictorian]

1 hour ago, trag1c said:

When you enter the inspection window when viewing a web page they have a tab for the console.

Yes I know that but what does it have to do with VS code?

[vikas_jk]

3 hours ago, Wictorian said:

Yes I know that but what does it have to do with VS code?

That's how you debug Javascript code using Console, I will suggest you use VS code as an Code editor and use Browser console for JS errors/log.

[Just that Mario]

You're not looking for an actual IDE, but a code editor. Out of all I've tried, most lightweight is Sublime Text. Right now I use Visual Studio Code, but you can try out ATOM or even Notepad++.

BTW, what do you mean you cannot see the errors in the browser? Browsers tell you the result before you have hit the ENTER key while typing in the console. Also when you execute the code it will log the errors.

[Sauron]

On 7/31/2021 at 3:37 AM, Wictorian said:

Is there a simple lightweight JavaScript IDE? Like IDLE for Python? Running with browser is cool but you can't see the errors. And IDES like WebStorm are too heavyweight for my laptop.

IDLE is hardly an IDE, if you just want a text editor with syntax highlighting there are plenty (notepad++ being one of the first that come to mind); otherwise, one of my favorite lightweight IDEs is Geany.

[wasab]

Vs code is very close to a fullblown IDE especially if you add on all the extensions and modules. Nothing comes close to jetbrain IDEs in intellisense however. Most light weight would just be a simple text editor with color highlighting. Nano, the terminal editor is as close to lightweight as you can get if you use Unix systems. 

[wasab]

On 7/31/2021 at 12:20 AM, Chris Pratt said:

VS Code now has an integrated JS debugger. It's in the latest release.

Doesn't really help if you sourced a minify file or write your applications with react/angular in typescript. All these gets compiled, minified, and transform so you can't really tell where in the code it is happening. debuggers, break points, step over/into, and stack memory arent very helpful. 

[bullipatty]

if you're looking into most lightweight js/html editing

1. Open your browsers "developer tools"
2. Click: "sources", "filesystem", "add folder to workspace"
3. Select your project folder or create one
4. Accept permission
5. From there you can add / edit / debug your files, but just like on a normal page you'll have to reference your js from a html file
6. ?
7. Profit

It's like an actual IDE

test.html

<script src="test.js"></script>

test.js

const url = new URL(document.location)
console.log(url)

 

console output:

URL {origin: "file://", protocol: "file:", username: "", password: "", host: "", …}

[Wictorian]

On 8/11/2021 at 1:26 AM, bullipatty said:

if you're looking into most lightweight js/html editing

1. Open your browsers "developer tools"
2. Click: "sources", "filesystem", "add folder to workspace"
3. Select your project folder or create one
4. Accept permission
5. From there you can add / edit / debug your files, but just like on a normal page you'll have to reference your js from a html file
6. ?
7. Profit

It's like an actual IDE

test.html

<script src="test.js"></script>

test.js

const url = new URL(document.location)
console.log(url)

 

console output:

URL {origin: "file://", protocol: "file:", username: "", password: "", host: "", …}

Wow thanks. Also may I ask what this browser is?

[bullipatty]

On 8/12/2021 at 2:23 PM, Wictorian said:

Wow thanks. Also may I ask what this browser is?

I use Chrome at home and Edge at work, both have it, so maybe other Chromium browsers have similar features too.
Sorry I didn't specify an browser before, cause i thought all major browsers have this feature, but I just checked on Firefox and it doesn't seem to have it.