Building Mobile Apps with Node.js Bob Dickinson Synchro Labs, Inc. Seattle Node.js Meetup June 22, 2016

Synchro Labs, SynchroLabs Redmond, WA Bob Dickinson Blake bcr Founding Team

Alternate Profile Pic with Ranger, my pet llama

What is Synchro? Mobile app development platform based on JavaScript and Node.js Native apps for Android, iOS, Windows, and Windows Phone, and web apps (mobile-optimized and desktop) - all from a single code base Enterprise focus Free for developers, licensed for enterprise deployment Server and Web Client are Open Source Shared (but closed) source

We Thought: “The World Needs Another Mobile App Development Platform” NativeScript

But for Enterprise Apps, Maybe it does…

Enterprise-first approach to the mobile application development platform The kind of apps enterprises need to build The dev skills they already have (JavaScript) The frameworks they already use (Node.js) Integration – of mobile apps with enterprise infrastructure (apps, databases, resources, etc) DevOps – How enterprises deploy and manage apps Security – Enterprise concerns / requirements

PropertyCross

Analysis of ProperyCross implementation on over a dozen platforms Why are these applications so complex? What is all of this code doing? Babysitting and Boilerplate Networking (poorly) What is the smallest amount of code that *should* be able to do the job?

How can we… Make mobile apps easier to develop in general While still providing a high-quality, native user experience And address enterprise concerns Integration, DevOps, Security

What if… We remoted the UX so that it ran on the mobile device and presented as a native mobile client, but… All of the mobile app code, including UX definition and interaction logic, ran on the Node.js server Then… Apps would present as native to end users, but as Node/web apps to developers and DevOps

Our solution Synchro Mobile Client (native, tuned implementations) Synchro Explorer – generic client that can connect to any Synchro app endpoint Your custom app – same code, but your icon/name and nailed to your endpoint Installs like a native app, rarely if ever needs to be updated No native mobile dev tooling required Synchro Server Runs your mobile app code (Synchro app) in a Node.js environment Highly sophisticated client-server data binding engine allows for client logic to run on the server as if it was running on the client

MVVM: Model – View –ViewModel View UX Presentation View Model UX Data and Logic Model Business Logic Data Binding Services, Data sources Data structures, Commands Style, Layout, Controls John Smith Customer Name: Search… var customerName = “John Smith”; function doSearch( ); Customer Database Customer DB API

Synchro Client-Server MVVM View UX Presentation View Model UX Data and Command Routers Data Binding Data Sources View Model UX Data and Command Implementations View Template Route commands Synchronize data Filter and download APIs, Services

What does that look like in code? exports.View = { title: "Click Counter", elements:[ { control: "text", value: "Count: {count}" }, { control: "button", caption: "Add", binding: "onAdd" } ] } exports.InitializeViewModel = function(context, session) { var viewModel = { count: 0 } return viewModel; } exports.Commands = { onAdd: function(context, session, viewModel) { viewModel.count++; }

What does this mean to you? Radically simplifies application design Mobile app code runs on server - no more client/server! App code can access enterprise resources directly, auth as app/server High quality native client experience, robust communications Provably secure No app code ever runs on the mobile client All communication between mobile client and server is always secure Mobile client never communicates with anything other than server Ability to control access, instantly deploy updates, etc. But mostly…

PropertyCross with Synchro

What Synchro is not…

We’re not the platform for your “Hero” app Poor support for intense client-side logic, custom graphics processing, cutting edge OS features (games, augmented reality, photo editing, accessory hardware integration, etc) We require a network connection (no offline mode) But ideal for most enterprise client-server applications

Install Synchro, Create an app, and Run it… $ npm install –g synchro $ synchro init $ synchro new hello $ npm start Download Synchro Explorer from any app store to connect to the endpoint, or explore the web app version

Building upon that app Watch out! Live coding happens here!

Hosted Samples Demo Endpoint: Wide variety of samples demonstrating supported controls and concepts Hosted on Microsoft Azure Running in data center in Chicago, IL

Synchro Studio: Debug, Edit, and Re-deploy

Demo of Synchro Civics 200~ lines of code, all mobile platforms + web, running from the cloud

Deploying Synchro Deploy however you currently deploy Node.js apps Horizontally scalable via shared cache and shared module store Support for Azure, AWS, Joyent, IBM BlueMix, RackSpace, any OpenStack-based provider (via pkgcloud) Multi-tennant Each Synchro app running on a server runs in its own process Container support (Docker)

Synchro and IoT Quick and easy way to build mobile/web interfaces to IoT projects App is served from the “Thing” in most cases (Node.js everywhere!) Review / Demo BeagleBone LED example Raspberry Pi Drinkro (Synchro app and hardware) See our blog entries covering these in detail

Getting Help Comprehensive online documentation: Including step-by-step tutorial Lots of sample code: Open a ticket from docs, or

Call to Action Trial customers wanted Support from core team Contact us for fee waiver We want your feedback Spread the word!

Questions If we don’t get to you, please reach out via - -

The End