LeoJS vs. VSCode

[rengel]

I admire the great intellectual effort and accomplishment behind LeoJS!

I have installed LeoJS in VSCode (VSCodium). Now I'm trying to wrap my mind around the relationship between LeoJS and VSCode and to figure out how I can use LeoJS to improve my workflow. I understand, that I now can work with my Leo outlines from within VSCode. But frankly, why should I want to this? Compared to the clean interface of the LeoPy desktop all this unsused VSCode stuff around LeoJS is just visual clutter.

But what about programming?

After years of using Python, today I program mainly using Elixir/Erlang for desktop development and Phoenix LiveView for web development. I use VSCode as my IDE.

VSCode has excellent plugins/extensions for these languages. The languages have tools for creating complete working project skeletons(i.e. mix of Elixir).

VSCode provides essential tools for writing, debugging, and managing code across various programming languages and frameworks. Inbuilt key features include:

• Code Editing | Syntax highlighting, intelligent code completion, and linting.
• Integrated Terminal | Allows running command-line operations directly from the editor.
• Version Control Integration | Built-in Git support.
• Extension Support | Customizable through an ecosystem of extensions for languages, frameworks, and tools.
• Cross-Platform | Available on Windows, macOS, and Linux.

LeoJS offers roughly the same functions, albeit in a different language, so users have to master two different sets of commands for the same functionality. In order to use LeoJs's superior editing functions (finer granularity of editing single files, clones, and 'code weaving'), one has to import the project structure created by the language tools into a Leo outline - basically using LeoJS as a mor capable duplicate of the VSCode Explorer. That would be another duplication of effort.

So for me the question is: "How can I leverage LeoJS in VSCode effectively to work with the project structures and program skeletons created by specialized language-specific tools?"

[rengel]

To put it succinctly:

As far as programming is concerned, LeoJS is a general-purpose IDE within another general-purpose IDE (VSCode).

[Edward K. Ream]

On Wed, Sep 18, 2024 at 4:56 AM 'rengel' via leo-editor <leo-e...@googlegroups.com> wrote:

To put it succinctly:

As far as programming is concerned, LeoJS is a general-purpose IDE within another general-purpose IDE (VSCode).

That seems like an accurate description to me.

Edward

[Félix]

Hi Rengel, 

>  I admire the great intellectual effort and accomplishment behind LeoJS!

Thanks for your remarks!  Those are great compliments!!  And thanks for the great points and questions that you raise. I'll try to address a few...

> I'm trying to wrap my mind around the ( ... ) 

The true origin of LeoInteg and LeoJS, is simply the combination of two facts: 

1- Leo does a thousand things that vscode does not do, and vscode does a thousand things that Leo does not do.

2- I was annoyed of continually ALT-TABBING between the two !  

Some three other differences to note is that LeoJS, (as opposed to LeoInteg,) it faster (no bridge), scriptable in js/ts instead of python, and usable directly in the browser without downloading/installing anything. (just press the dot "." when browsing a github repo to switch the interface to VSCode on the web and activate LeoJS from the extension panel) See this video (features demo) for an example of that right at the start of the video, 

But the real point I want to make is that Leo offers a vast toolset of capabilities and functions ON TOP of the 'outline editing' and 'file generation/reading back' part. And those capabilities and functions of Leo are used differently from one leonista to another. 

It greatly depends on the type of project you're working on.

For Example: I use the Leo part to write up and structure data and textual (or other) resources and notes for my project, to write and structure the documentation, and to write and structure the code. 

 And then, in parallel, I use VSCode to colorize, syntax-check, compile, stepping into code when debugging and all the other cool programmer-IDE stuff that VSCode can do. (often with a body pane on the left, and the real file on the right, editing either one indiscriminately.

> Compared to the clean interface of the LeoPy desktop all this unsused VSCode stuff around LeoJS is just visual clutter.

Hey hey hey! how dare you! ;) haha ! Personally, I find the default leoPy to have more clutter than the default vscode ui. Here's the default view of each side by side (vscode is on the 'leoJS' activity view, with the same 3 panels : outline, body and find/log pane shown)


Above is the default Leo  and  'LeoJS' screens  

but I admit I mostly use it instead on the 'explorer' view, (screenshot below) with the file explorer opened above the outline, and another editor opened on the right to see the 'real' file being worked on with all that VSCode can process on it 'live'. (errors, tooltips, hover details, copilt code generation, etc, etc,etc,) which are picked up by Leo 'live' when file changes are detected.


Even then, there is no permanent row at the bottom for the minibuffer, nor permanent row of buttons on top and all menus are hidden unless hovered upon. so to me, it feels still pretty unclutered. (and vscode has many options to unclutter, like the zen mode, or simply right-clicking on any UI element and choosing 'hide' to hide them) 

>  so users have to master two different sets of commands  

There's really no 'set of commands' to master, apart from ctrl+i, ctrl+u  ctrl+d ctrl+l ctrl+r to edit outlines. and @file/@clean/@others to make files. The rest can be typed loosely in the minibuffer (alt+x) for instant discovery/usage without remembering commands. 

I hope you've watched the https://www.youtube.com/watch?v=j0eo7SlnnSY intro video, as opposed to the features demo video, that shows that stuff! :) 

and lastly:
> How can I leverage LeoJS in VSCode effectively to work with (... )

That's the magic question that every person that discovers Leo is bound to ask at some point near the beginning, but there's no one answer. After you practice editing outlines with Leo, and create files for fun (like a poem or song lyrics that uses clones for the chorus so that it's always the same when changing it, etc.) somethings will 'click' in your mind, and you'll say like the people in the quotes section of the website: I’ll never go back. They’ll have to pry Leo out of my cold, dead fingers!

That being said, I respect your opinion greatly and I welcome remarks and criticism like yours, which make me often review and improve things. so don't refrain yourself in replying to me with counterpoints or contradicting arguments and examples :) 

But hey:
I just realized I never introduced a super cool feature of LeoJS that the original Leo does not have !
(no i'm not talking about the 'undo' pane! ) I'm talking about external floating text-bodies!! You can just drag out tabs of the body pane, or even detached body panes outside of the main window, to have them float on your desktop beside vscode!  And of course they still work 100%😎
 Take a look:

Boom! 

So thanks again Rengel for your comments, and sorry if I forgot to address something - don't hesitate to point it out - and I'm more than happy to discuss those subjects with people from this forum! :)

Félix

ps. sorry for my orthograph/syntax, english is not my first language.