Category Archives: Hardware

JavaScript All The Things – Or – Why You Should Pay Attention To JavaScript

This post is inspired by all the comments I’ve seen this week about JS in the enterprise. I would have never imagined this 10 years ago, but JavaScript is now pretty much ubiquitous. Here are a few reasons why you need to paying attention to JavaScript if you aren’t already, and why you should definitely not write it off.

First, I think one of the major reasons for JavaScript’s ubiquity is that JavaScript is approachable. It is relatively easy for beginners to learn JavaScript, and powerful enough for advanced users to build complex and reliable systems.

Second, why you need to pay attention, JavaScript is everywhere.

jsatt

You can now use JavaScript to develop on virtually any platform: client side applications, server side logic, embedded chips/IoT devices, manage build scripts and dependencies, and more.

This doesn’t mean you’ll use the exact same code in every case, rather that you can use the same skill set – JavaScript Development – to deliver solutions across multiple paradigms.

The Client Side

JavaScript can be used to power client side apps/user interfaces, and user interactions on numerous platforms and devices.

Web

Of course JavaScript powers the web, this is a given. JavaScript is the primary scripting language for all web browsers. I won’t focus on this much b/c it’s already well known.

Mobile

JavaScript can also be used to power mobile applications that are natively installed on a device.

  1. Apache Cordova/PhoneGap – You can build natively installed apps with web technology using PhoneGap or Cordova. PhoneGap is Adobe’s branded distribution of Cordova, but from the developer’s perspective, they are basically the same thing. Your app runs within a webview on the mobile device, and you build your user interface the same way you you build a dynamic web application. Your user interface is implemented in HTML, styled with CSS, and all interactivity is created with JavaScript.
  2. React Native – JavaScript powered web apps don’t just have to be inside of a a web view. The React Native framework gives developers the ability to write their application using JavaScript and declarative UI elements, and results in a native application running on the mobile device. The logic is interpreted JavaScript at runtime, but everything that the user interacts with (all UI elements) is 100% native, providing a very high quality user experience, and it is now available for both iOS and Android applications.
  3. Unity 3D – You can even develop rich & immersive mobile 3D simulation or gaming experience, entirely powered by JavaScript using the Unity 3D engine. **These can be web, desktop, or mobile, but is often used in mobile gaming.
  4. NativeScript – Framework for building cross-platform native iOS, Android and Windows mobile apps using JavaScript.
Desktop

Yup, desktop apps are not left out of the mix. Most desktop solutions fall into a category similar to Apache Cordova, where the end results is a web view that has access to lower level APIs, whose content is developed with web based technology.

  1. Electron – Node.js + Chromium desktop app container from GitHub
  2. app.js  – Node + Chromium for a desktop app container
  3. nw.js – Another framework for Node +Chromium for a desktop app container
  4. CEF – The Chromium Embedded Framework – a framework for embedding the guts of the chrome browser inside of a desktop app.

… and more… I know Microsoft has a solution for building Windows apps purely out of HTML/JS, and there are more solutions out there that I am forgetting.

In fact, some of my favorite desktop tools, such as SlackAtom and VS Code are actually based on web technology and implemented in HTML/JS. Heck, even Photoshop can be scripted and extended with the generator extensibility layer or have a customized user interface in HTML/JS with design spaces.

The Server Side

Most obviously Node.js – a JavaScript runtime buit on Chrome’s V8 JavaScript Engine – has made huge inroads into server side development and the enterprise. Node.js, powered by frameworks like express.js or loopback.io makes server side development and complex enterprise apps with JavaScript possible.

IoT

Pretty much everything that doesn’t fall in the categories above falls in here. You can develop headless apps that run on Arduino, Raspberry Pi or other small boards completely using JavaScript, you can manage infrastructure and information flow of IoT sensors using JavaScript, you can write on-chip programs for embedded systems using JavaScript, you can control robots with it, and you can even power media-centric connected TV experiences using JavaScript.

Like I said… It’s everywhere.

Ecosystem

It’s not just about where you can build and run JavaScript for your applications. JavaScript has a massive and thriving developer ecosystem.

JavaScript is the #1 most active language on GitHub in both the total number of active repositories and total number of active pushes/commits.

 

http://githut.info/
statistics visualization from http://githut.info/

Here are some stats that show the magnitude of growth and adoption for Node.js/npm.js alone. NPM stats currently shows a total of 186,946 packages available for download, 94,978,032 package downloads in the last day, and 2,451,734,737 package downloads in the last month.

npm
NPM Statistics

 

Node.js adoption is massive, and is still growing.

This doesn’t mean that JavaScript is the best language at everything. It also doesn’t meant that you can take a single piece of source code and run it in every device/context imaginable.

It means that you can use your skills in JavaScript to develop for just about any kind of device/context out there. It’s not going to be write once, run everywhere, rather in the words of the React.js team: learn once, write everywhere.

Apple WWDC Recap for Mobile Devs

I’m sure you’ve already heard Apple’s big announcements from the annual Worldwide Developer Conference this week.  I was lucky enough to snag a ticket in Apple’s lottery and got to check it all out in person. There were lots of great sessions, with tons of content.  Here are the highlights as I saw them from a mobile developer’s perspective – *not* from the general consumer point of view.  For the most part, I think this year’s announcements highlighted the evolution and maturity of existing products and projects – no new amazing breakthoughs, but definitely steps in the right direction.

If you haven’t seen them already, the Keynote and the Platforms State of the Union videos cover most of the announcements, but not in complete detail. Just be warned, the Keynote is loaded with product marketing fluff, not just developer topics.  Once you get to “we’ve got one more thing…” you can turn off the Keynote – the Apple Music announcement has pretty much zero significance for developers.

So let’s get started…

Swift 2.0

swift

There was a tremendous emphasis on the Swift language at this year’s WWDC event.  There was the announcement that Swift is going to be open sourced, plus many language enhancements, and nearly every piece of sample code that was shown was written in Swift.  It is very clear that Swift is Apple’s direction moving forward.

I think the open souring of Swift is a big deal b/c it opens up the language for use beyond just iOS and OSX applications.  Think about it… Perhaps another platform might adopt Switft to develops apps (Windows?), or let’s hypothetically say you really like Node.js on the backend b/c its the same language as your web front end (JavaScript, that is). What if you are developing native apps, and you’d like to write your back end in the same language as the front end mobile client, or what if you want an ECMAScript inspired language that is more structured than Node, with real Object Oriented or functional programming constructs (and what if you want something that is really multi-threaded)?  Swift is your answer. I’m willing to bet that we will see server-side Swift not long after it is open sourced.  Let’s just hope that Swift is opened in the truest sense – you know, actually accepting input and contributions from external parties.

The Swift language itself has also evolved quite significantly.  Better error handling, protocol extensions, and improved performance are a great start.  Heck, if I understood one of the speakers correctly, it’s now even faster than Objective C at runtime in some cases.

Want to learn more about Swift?  Check out these session videos from WWDC (requires Safari):

  1. What’s new in Swift
  2. Protocol Oriented Programming in Swift
  3. Optimizing Swift Performance
  4. Swift in Practice
  5. Improve Your Existing Apps with Swift
  6. Swift and Objective-C Interoperability

OS Improvements

New versions of both OS X and iOS were announced and released to  developers… OS X El Capitan and iOS 9 respectively.  Both seem to be incremental updates of the previous OSes. New apps, new features, etc… for the end users.  Not necessarily significant changes for developers.  If you’re a graphics programmer, Metal will be a big deal for you (low level graphics/gpu API), but if you’re not a graphics guru, you probably won’t even know its there.

iPad Multitasking

iPad-sidebyside

The new iOS 9 multitasking/side-by-side mode for iPad is going to be a great addition which brings the iPad even closer to being a full laptop replacement.  Having the ability to have multiple apps open next to each other will improve the iPad’s “get $h1t done” ability.  You’ll have to ensure that you’ve authored your apps to leverage adaptive layouts, but that’s pretty much all that you need to do to take advantage of iPad Multitasking.

These videos will get you going in the right direction for iOS multitasking and adaptive layouts:

  1. Getting Started with Multitasking on iPad in iOS 9
  2. Multitasking Essentials for Media-Based Apps on iPad in iOS 9
  3. Mysteries of Auto Layout, Part 1
  4. Mysteries of Auto Layout, Part 2
App Thinning

ios app thinning

The new “App Thinning” features in Xcode 7/iOS 9 are also a great addition.  Currently if you build an iOS app it gets bundled with lots of resources that may never be used depending on the type of device.  App thinning introduces three concepts that help minimize the footprint and increase the quality of your installed apps: App Slicing, On Demand Resources, and Bitcode. According to the presenters, these can decrease the download/installed size of your apps quite significantly.

If you haven’t seen the App Thinning in Xcode session, you should definitely check it out.

App Slicing is a new feature that creates variants of your app executable depending on the device that you are downloading the app to. So, if your app doesn’t use @3x graphics, or doesn’t use the arm7s architecture on a particular device, then they won’t be downloaded.  Likewise, if your device does leverage those assets, then the other smaller scale assets and non-used binaries won’t be downloaded.

App Slicing from iOS Docs

On Demand Resources give you the ability to download specific sets of resources from the app store as they are needed.  They are still hosted by the app store, but not part of the initial download. Let’s say you are building a platform game.  Initially the shell/navigation assets will be downloaded.  While the app is running you’ll be able to download assets for level 1, level 2, level 3, etc… incrementally as they are needed.  The system can also clean up ODR resources to conserve space using a least-recently-used cleanup routine.

On-Demand Resources from Apple Docs

Bitcode, according to the docs:

Bitcode is an intermediate representation of a compiled program. Apps you upload to iTunes Connect that contain bitcode will be compiled and linked on the App Store. Including bitcode will allow Apple to re-optimize your app binary in the future without the need to submit a new version of your app to the store.

Bitcode enables the app store to re-compile your code to take advantage of new LLVM optimizations without you even having to recompile and upload a new application binary.

UI Testing

The new UI testing features in Xcode 7 look pretty awesome as far as automated UI testing goes.  It enables you to record/playback steps and generated UI unit tests all from within Xcode.  What’s even better, it enables you to set breakpoints within your tests, so you can debug why your tests might be failing, or you can set breakpoints inside of your app, and the automated testing stops at the breakpoints and allows you to step through code while inside the automated unit test.  Definitely do not miss the session on UI Testing in Xcode 7 if you have any (even remote) interest in automated UI testing, it looks pretty darn useful.

Improved Search and Deep Linking

Improved search functionality was also announced for both iOS and OS X.  This improves the search functionality, and also enables your apps to index their content, so using the device search enables you to search for information hosted *inside* of the app.  To complement the enhanced search, there are also features that better facilitate deep linking into your app.  This enables apps to be launched directly into the appropriate content/context with greater ease.  I need to look into this more, but it sounded interesting…

Check out these resources for additional detail:

  1. Introducing Search APIs
  2. Seamless Linking To Your App

 

watchOS 2

Last, but by certainly no means least, the announcement of watchOS 2 looks like a massive leap forward for developing for the Apple Watch.

watchOS-architecture

WatchOS 2 brings us the ability to execute code natively on the Apple Watch, not just in the WatchKit extension running on your iPhone, brings us the ability to implement custom watch complications, access to network connectivity if your phone is not connected, support for multimedia, and direct access to hardware sensors.  If you’re wondering what “watch complications” are, they are the widgets on the watch face that enable you to display customized information.

WatchOS Complications

You should definitely check out the videos on developing for the Apple Watch if you have any interest in watchOS:

  1. Building Watch Apps
  2. Introducing WatchKit for watchOS 2
  3. Layout & Animation Techniques for WatchKit
  4. WatchKit in-Depth, Part 1
  5. WatchKit in-Depth, Part 2
  6. Introducing Watch Connectivity
  7. Designing for AppleWatch

Also, don’t forget the watchOS docs, which are chock full of resources and a watchOS 2 transition guide.

There are also new APIs, enhanced features in CloudKit, MapKit, HomeKit, Core Motion, Core Location, updates to Apple Pay, security updates, networking updates, and lots more.  Be sure to check out the complete list of WWDC videos for more.

There was so much to absorb, I’m sure I missed something, so feel free to point anything out that I’ve overlooked!

Inexpensive Clamp-On GoPro Mounts

I’ve posted about GoPro cameras here before… I love mine b/c it is so versatile. You can mount it on just about anything – underwater, on the ground, or in the air. There are tons of accessories for mounting it all kinds of different ways. However, the cost of these mounts can quickly add up. The adhesive mounts are essentially 1-use mounts. Once you stick them to something, they are firmly attached, and cannot necessarily be easily reused multiple times. If you want a reusable mount, GoPro has their own clamp mount, but is also a bit pricey if you have other accessories. Here’s how you can create an inexpensive and extremely versatile clamp mount.

I already had a frame mount, and a tripod mount for the GoPro, so I already had half of the equation. (Yes, if you have to go out and purchase both of these, it’s just as much as GoPro’s clamp mount, but this approach is far more versatile when you have all of them.)

To turn this into a clamp mount, you just need to add the clamp and a mounting point, which can be purchased at a hardware store for just a few dollars. You’ll need a clamp; any size will do, you just need one big enough to put a 1/4 inch bolt through the handle. Generally, the bigger the clamp, the stronger the spring will be to hold it closed. The one I used is pretty big – you don’t necessarily need one this big. You’ll also need a 1/4 inch bolt, some washers, and some 1/4 inch nuts. I used a thumb screw with two wing nuts so that it is easy to adjust in any situation without any tools.

Clamp Mount Parts
Clamp Mount Parts

Just drill a hole through the clamp handle big enough to fit the 1/4 inch thumb screw. Put a washer on either side, and tighten it with one of the wing nuts. Then put the other wing nut in the opposite direction, followed by the tripod mount. Use this second wing nut to tighten the tripod mount in the correct position. Next, just attach the “arms” that come with the GoPro, and attach the camera inside of the frame mount. Voila… you know have an extremely versatile clamp mount for the GoPro. This will also work with the waterproof enclosure.

DIY Clamp Mount
DIY Clamp Mount

Now, get out there, capture some great images and videos, and then use Creative Cloud to bring out the best in them. You can do everything from lens profile correction, horizon correction, color correction, and much, much, more on both images and videos with Photoshop, Lightroom, and all of the tools that Creative Cloud offers.