Adobe Brackets - debugging Node.js & Node-inspector - node.js

Quick question: Is it possible to use Adobe Brackets to debug Node.js using Node-inspector. Like be able to step debug in Adobe Brackets?
Thanks
Regards
Chris

There's a Brackets extension for "Live Development" with Node.js:
https://github.com/DennisKehrig/brackets-v8-node-live
And a general JS debugger extension:
https://github.com/jdiehl/brackets-debugger
The problem is they don't work together yet: the debugger assumes you're using the usual Live Development mode, which connects to a Chrome browser instance. The authors of those two extensions collaborate frequently, and I believe at one point they were working on making the extensions compatible (see the "v8bridge" branch in the first extension). I think they'd be pretty responsive if you start a thread in the brackets-dev Google Groups forum with this question.

The Theseus project for Brackets is an 'omniscient debugger' that supports inspecting code that's running in Node.

Related

electron/muon: require not defined in renderer

I'm currently working on an IPFS/Ethereum dapp in Muon.
Because i need Metamask i started with this Boilerplate: https://github.com/SwapyNetwork/electron-metamask-boilerplate
Everything is working fine so far.
However i can not use require('anything') in the renderer process or in html script tags. (See below)
There seems to be a problem with the boilerplate code but i can't find it.
Or is node code in renderer not supported in Muon?
My only change in testing is setting node-integration explicitly to true and
inserting require('fs') in index.js. (i installed fs of course).
I tried many different solutions from stackoverflow and other sites but couldn't find a solution yet.
Error Message
Thank you
As per the muon's github repo:
Some of Muons goals include:
Use the Chromium source directly (eliminating electron's copy of chrome_src) with minor patches
make integrating chrome components less painful
faster and more streamlined end-to-end build process (see browser-laptop-bootstrap).
add support for Chrome extensions
add security focused features for the renderer:
remove node completely (from the renderer process)
full sandbox
scriptable window.opener support
As you can see there, muon does not supports node code in the rendered. It is by design for security purpose. Muon may be great for certain applications, but I recommend switching on to electron if you really need to use require in the renderer.

How can I run a Chrome extension in NW.js?

This question is pretty short and self explanatory. I'm wondering how I can run my Chrome extension in NW.js.
I know you can run an app in NW.js and I think you can run extensions as well?
I can't find much on the topic. Back in 2013 the way to do it seemed to be:
nw [path to manifest.json] --load-extension
Any ideas are appreciated!
Yes you can.
First off, download the extension you want. For this example I'll be using this debugging tool, which adds an additional tab in the dev tools window.
Inside your NW.js package.json file, ensure you have an entry called chromium-args.
Ensure its value contains --enable-extensions --load-extension=relative_path_to_extension_manifest.
My package.json looks like this:
After restarting the application, the extension shows up as expected:
Something I'll add is that the full Chrome API might not be available to you. I couldn't find info about what NW.js supports, but Electron definitely does not support the entire API, so this might have similar restrictions.
I also noticed you mention in the comments that you need to assign a hotkey of sorts. I'd need to know what you were trying to do, but essentially you have the option of either using a browser mechanism such as addEventListener('keydown', myHandler) or using the NW.js API depending on your exact needs.

How to compile Node.JS desktop app?

to gain more experience coding and support good projects, I recently got into open source projects and Github. After looking for a project I would like to work on, I found Soundnode (https://github.com/Soundnode/soundnode-app). The project uses NW.js, Node.js and Angular.js.
The question is very fundamental: How do I run the NW.js desktop app from the given files?
I was able to compile the app once, using the bash command open -n -a nwjs --args "/Users/example/path/app". But how do I compile the changes? After changing the index.html file, which is the start for the application, I have to terminate the NW.js app and start it up again (otherwise nothing will happen) and then it opens again the same, unchanged, original app (I changed some html text to see if would load the changed index.html).
Could anyone give me a quick guide how to work with this? What I want to change and everything else I will try to figure out on my own. Just need somebody to give me a head start :)
Best Regards, bbrinx - eager to learn.
nwjs application works next ways:
direct load web files from FS or web
archive files to zip package.nw
Check nwjs manual and docs: http://docs.nwjs.io/en/latest/ and https://github.com/nwjs/nw.js/wiki
Easiest way to compile your app is to use Web2Exe. It can compile for Win, Mac, Linux.
You can use browser tools for developing/debugging your application. Set toolbar option in true in window section in package.json file to see browser elements in your app.

Server side programming language/framework that support hot-reload

Is there any other server side language (with or without frameworks) that support hot-reload or live-coding, so when we develop, all we need is:
Start the web server
Edit the source code
Try on the browser (without having to restart the server)
Similar to PHP
Some other language that I know able to do this:
ruby/sinatra
sinatra-reloader gem (sometimes not working)
rerun (*
nodejs
nodules module
node-supervisor module
nodemon (*
(* automatically restart server when there are changes, not really hot-reload
Is there any other language that are able to do this? and if possible, showing the error (filename and line number, or the full stack trace) on the browser (not in the terminal/console), so I don't have to switch from code-editor then to browser and then to console to see the error.
You can try Perl with the Mojolicious framework: http://mojolicio.us/ (using the morbo server).
Can also be achived with Groovy/Java using the Grails framework: http://grails.org
You can use Erlang to work as a web server, which is designed to allow you to hot swap whole modules of code while the program is up and running. Though, the functional programming paradigm does take a little while to get used to...
How to write a simple webserver in Erlang?
I hope this helps...
I think what you ask for is actually called live-reload, hot-reload is something I believe only Erlang can truly accomplish.
By configuring and adding plugins to Grunt or Gulp, you can watch for changes in any list / kinds of files and describe any action to be initiated. Here is a plugin for Grunt. With this method, any language can gain such ability.
As a side note, Django (Python) has auto-restart as well. But that does not mean Python language has it built-in, Django uses a Grunt-like trick to restart its dev-server.
Revel for Go could do this, or Beego, the difference is Revel only recompile when there are changes on the source code and on new request (so it's more efficient), Beego recompile every time there are source code changes.
EDIT: Beego 1.3.0 remove its hot reload feature T__T

Code development (specifically text editor) while using a netbook

I have been using a chrome book for a few months now. I also have been designing a web page. A lot of the work can be done via word press's lame gui, but like any coder, I want to use a real text editor, specifically vi/vim.
I have done some searching around. I found one java script implementation of vi, but it's not good enough IMO to use. Conversely, I'd like to ssh into one of my *nix boxes and use vi that way, although you cannot do that from web pages it seems. HTTP vs TCP issues. Not sure if WebSockets will be able to get around this.
Lastly, I've been looking at plugins. While some decent ones seem to be available for Firefox, the Chrome division is lacking severely.
One desparate try is vnc, but this chromebook has no javascrip support, not can I get the HTML5 vnc running quite right.
Does anyone have any suggestions?
Edit/Update:
Thanks for everyone's effort in answering. I quickly abandoned coding on the netbook, but it looks like some great answers were provided.
I am on a Samsung ARM Chromebook and I do a lot of development work in Vim. Here's how I prefer to do it:
Enable Developer Mode, then download crouton.
Open a shell:
<ctrl><alt>t
...and install Ubuntu command-line environment
sudo sh -e crouton -t cli-extra
Enter the chroot using
sudo enter-chroot
From inside the chroot install vim
sudo apt-get install vim
There are lots more instructions and examples on the crouton github page.
I prefer the command line only version because I can just have Ubuntu in another tab, and all the Chromebook keyboard shortcuts Just Work.
You have few options:
Cloud9, an IDE for JavaScript, Python, PHP, and Ruby. Cloud9 uses the HTML5 FileSystem capability and AppCache to sync files, so you can even code offline. It got some really nice features that I find myself using a lot: github integration, chat, the ability to work and do reviews on your code without any pain of ‘new/other’ tools.
Kodingen is an Online Development Environment including Code Editor, Cloud Hosting etc'. I haven’t play with it (yet) – but I’ve heard some friends that like it.
Codey - Easy to use code editor for HTML, PHP, CSS, JS. They are in Chrome web store.
Akshell - Server-side JavaScript development and hosting platform. They got some git integration built in their IDE.
I hope it helps.
For more, I've posted something about this Q few months ago: http://greenido.wordpress.com/2011/07/04/web-developers-and-the-new-chromebook/
There are web shells: this is the first one that came up with a search, but there are others. Be sure to use HTTPS and place it behind a authentication gateway. I can't vouch for how well they handle vim and it's interesting screen modes, but hopefully one of them might work.
How about SourceKit? Unforunately the bindings are closer to textmate, it has great highlighting and IMHO the text will be easier on the eyes than if you were looking at tiny shell font.

Resources