Vanilla Nodegui example

[tiptronic]

Is there some example available around these things:

• no typescript, but vanilla javascript?
• no webpack (or other JS bundler)?
• how to bundle an external node.js module (e.g. fs-extras) into the build?
• how to code-sign?

Sorry, if I'm asking for too much - I am also happy to help out, when I understood the workings (I did quite some Electron/Cordova stuff with code-signing and notarizing)...

I think it would be of great benefit, if there was an example which shows how to access QMainWindow properties, Manipulate menu-item text based on certain conditions (e.g. if a checkbox on the Main window is checked, change the name of a menu-item, etc... ), etc...

I - for one - use lots of javascript (daily), but without any bundlers, frameworks, etc... just plain vanilla JS. So I'd really appreciate some vanilla nodegui examples pretty much....

Any chance there's something in sight? (Again - I'd be happy to help adding code to it).

I understand there's always little time, but I think it's worth invested time, because the easier the entry-point is, the more developers will try ;)

[jswhisperer]

+1 vanilla js

[jswhisperer]

@tiptronic https://github.com/gregbenner/-vanillajs-react-mobx-nodegui-starter-/ hope this helps a bit

[jswhisperer]

• I utilised mobx to change properties onclick you can see it in store and it updates the window title but could be anything anywhere
• just import fs-extras in any of the the files app.js or index.js etc it will be bundled automatically at the build stage
• not sure why but this is the only place to find the build and package steps for the app https://github.com/nodegui/react-nodegui-starter#packaging-app-as-a-distributable

[tiptronic]

@gregpalaci I never thanked you for sharing your react-nodegui-starter... So:
Thanks for sharing!!! Slthough I'm more into Vuejs, it is much cleaner and better to understand as the vue-nodegui-starter (where couldn't even follow what's going on :()
I'm just re-visiting the project, as I find it generally interesting, but most of the examples just don't run properly or are missing important information.
Your react-nodegui-starter is a pretty good starting point in that regard!

The only thing I could not figure out is, how to inspect the DOM - is there something out there to do that?

[jswhisperer]

@tiptronic as far as I know there will be no DOM since it is now "native" The layout engine is "QT" instead of browser / DOM.
I'm not an expert but you could read up a bit on QT5 to see what kind of tooling is available, nodeGUI wraps that framework.

[tiptronic]

Yes I did that and it seems there is really none, so we have to use a 'best guess' approach (and check CSS in parallel in a browser-window). That works somewhat, but is not very visual.
It took me a while to also find out, it doesn't seem to work with CSS-classes, but only IDs...

[jswhisperer]

@tiptronic For sure remember it won't even be real CSS either, check out tauri.studio/ there's a bit of setup but once you are going you have all your familiar developer tools, real DOM, and CSS. Might be better suited for your needs.