Node &  

Native

bundling Node.js with native apps





@felx

felix.hageloh@gmail.com







why?


Personal itch to
scratch




Geek Tool





not responsive to different screen sizes

limited layout support 

no charts/graphs

HTML5 fits the bill


css

text layout, tables

SVG & <canvas>

well known

Node.js fits the bill



exec & pipes

timers and events

vast amount of modules

personal reasons




demo

The pieces

Node.js backend


reads widgets from file system and watches for changes

runs shell commands

serves widgets and widget updates

The pieces

webkit frontend
renders stuff

The pieces

Native app
provides fullscreen webkit view

bundles node and runs the server






how?

 

 Node.js

 bundle

 ways to

3

1. node-webkit

https://github.com/rogerwang/node-webkit


<!DOCTYPE html>
<html>	
  <body>
    <script>
      var os = require('os');
      document.write('Our computer is: ', os.platform());
    </script>
  </body>
</html>

write node code inside HTML!

need I say more

configure

{
  "name": "hello",
  "main": "index.html",
  "window": {
    "width": 800,
    "height": 600
  }
}


bundle

directly add your code to the .app bundle on OS X


70MB of app goodness

no desktop window support on OS X

not portable







"First find a place to put our code, it will take up about 14G disk space after compilation."

2. OS X installer pgk

"it's legit"


install Node.js

copy your node app

register a LaunchDaemon

http://blog.coolaj86.com/articles/how-to-create-an-osx-pkg-installer.html

launchd



/Library/LaunchDaemons/com.mycomp.myapp.plist 

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-/Apple/DTD PLIST 1.0/EN" "http:/www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
  <key>Label</key>
  <string>com.mycompany.myapp.daemon</string>
  <key>ProgramArguments</key>
  <array>
    <string>/usr/local/bin/node/</string>
    <string>/path/to/node/app.js</string>
  </array>

  <key>KeepAlive</key>
  <true/>
</dict>
</plist>


installers are somewhat cumbersome to create and use

3. Just bundle the binary



node has no dependencies

roughly 7MB

single .app package

Add server dir to Xcode project

☑︎ create folder refs for any added folders 



server
   node_modules/
   public/
   src/
   node
   server.js

NSTask to run node 


NSBundle *bundle     = [NSBundle mainBundle];
NSString *nodeBinary = [bundle pathForResource:@"node" ofType:nil];
NSString *serverJs   = [bundle pathForResource:@"server" ofType:@"js"];
    

NSTask *task = [[NSTask alloc] init];
[task setLaunchPath:nodeBinary];
[task setArguments:@[serverJs, @"some", @"args"]];

NSPipe *nodeout = [NSPipe pipe];
[task setStandardOutput:nodeout];
[[nodeout fileHandleForReading] waitForDataInBackgroundAndNotify];
   
void (^callback)(NSNotification *) = ^(NSNotification *notification) {
    NSData *output   = [[nodeout fileHandleForReading] availableData];
    NSString *outStr = [[NSString alloc] initWithData:output encoding:NSUTF8StringEncoding];
   
    // do something with outStr

    [[nodeout fileHandleForReading] waitForDataInBackgroundAndNotify];
};
   
[[NSNotificationCenter defaultCenter] addObserverForName:NSFileHandleDataAvailableNotification
                                                  object:[nodeout fileHandleForReading]
                                                   queue:nil
                                              usingBlock:callback];

[task launch];







questions?

Node & Native

By felixhageloh

Made with Slides.com

Node & Native

  • 5,222

More from felixhageloh