New York Tech Journal
Tech news from the Big Apple

JerseyScript: hacking your car plus understanding and using the magic of #react.js

Posted on January 29th, 2015

@JerseyScriptUSA on twitter

01/28/2015 @Indie Grove, 121 Newark Ave, Jersey City, NJ

After Jenn updated the audience on upcoming #JavaScript events, three speakers gave lightning talks

20150128_194551

In the first, John Feminella @jxxf spoke about JavaScript under the Hood (or ruining your car with JavaScript). John gave a short history of how Federal air pollution standards stimulated development of computer monitoring of all functions in your car. The #OBD interface is a portal to error diagnostics and sensors.

Every recent car has a port near the driver’s steering wheel into which a reader can be attached. Using a BLE adapter and the Torque app, one can monitor car functions.

Using the 5 character diagnostic and sensor codes one can interpret the shared coded for 9 of the 16 pins in the interface such as is the gas cap open to what is the motor speed. It’s enough to make driving my car a spectator sport.

Other useful links are:

https://www.npmjs.com/package/bluetooth-obd

torque: http://torque-bhp.com/

The next two talks were about react.js. Bert Muthalaly @stijlist spoke about the motivation for using react.js and how it does it magic React js is a library for building the user interface. What distinguishes it is it’s ability to speed up the interface. How does it do it?

To explain this, we first need to consider when the domain object model (dom) is slow. This can happen when we are making changes to the display within a tight video loop. In this case, we make the change and the dom needs to update every detail within knowing what has been changed.

React.js speeds this update since we dictate to a virtual dom what has been changed, so the dom only needs to update what has changed. This process is accomplished by organizing the display into a tree data structure, so the changed branches can be quickly identified.

The links below provide further information:

jankfree.org also react.js, immutable.js

Lastly, Justin Falcone @modernserf showed the speed and design advantages of using react.js by creating a whimsical create-your-own-breakfast site. Here he showed how one can easily create a graphical interface to select and place eggs, tortilla, cheese, salsa, etc. on your virtual plate. The code uses svg graphics and is compact and modular as well as fast.

To get the code go to modernserf/huevos-rancheros

posted in:  javaScript, JerseyScript    / leave comments:   No comments yet

#Visualizing un-aggregated data using #D3.javascript

Posted on November 24th, 2014

NYC D3.js

George Murphy @georgeLmurphy @Nomi

11/24/2014 @Pivotal, 625 6th Ave, NY

Two presentations. One by George Murphy showing how he used d3 routines to create interactive web graphics. The second by Sebastian Gutierrez was a beginner tutorial on d3. My notes do not cover that presentation.

20141124_191818[1] 20141124_192103[1] 20141124_192535[1]

George presented four case studies

  1. Behavior timelines showed time lines for individual shoppers including the sequence and time spent on various activities in the store.
  2. Occupancy by hour showed when people are sitting at specific seats in a restaurant. The site showed the occupancy of seats on a floor plan and individuals hours can be clicked to show the percent occupancy and which seats are occupied at that time.
  3. Nomi, his current company, placed 250 large “eggs” at various points in Manhattan. Each egg had a beacon so smart phone users could “collect” eggs. George showed a site where one can query by location, accumulated visits and select eggs by common themes.
  4. A site for exploring the trick-by-trick elements in a head-to-head skateboard competition. Tricks were synced to videos and results could be viewed in many ways: by elimination round winners, tricks successful/failed by individual, round, etc. offensive/defense and keyed to the videos.

George mentioned the following useful resources on visualization

Bret Victor – Ladder of Abstraction

Books: “Visualize This” by Nathan Yao

Books – “Align Left” by Scott Murray

posted in:  applications, d3.js, JerseyScript    / leave comments:   No comments yet

JerseyScript: #JavaScript to automate apps on the #Mac OS X, #Touch methods for automating the @NYTimes recipe pages, How not to run a #web development shop

Posted on November 11th, 2014

@jerseyScriptUSA

11/11/2014 IndieGrove, 121 Newark Ave, Jersey City, NJ

If you are interested in spend an hour teaching students how to code, check out @Openjerseycity.org. They will be teaching students in Jersey City on Dec 11 as part of Code for America.

Of the three presentations, the first two were about writing applications in JavaScript.

20141111_200847[1]

Tyler @Groundwork talked about creating OS X apps for the Mac using JavaScript accessing the UI and systems routines using the objective-C bridge. This replaces AppleScript and uses the Script Editor on OS X to compile the JS.

The code Tyler showed illustrated how the ‘$’ literal was used to access Objective-C methods. (not to be confused with j_Query).

He also mentioned that it is unclear how this JS tool will evolve when Swift replaces objective-C.

20141111_202019[1] 20141111_202605[1] 20141111_202615[1] 20141111_202735[1]

In the second presentation, Douglas Back @ NYTimes talked about updating the Cooking.nytimes-recipe.box page to encourage users to save a list of their favorite recipes. Initially, most users were unaware of the ability to save recipes so the interface was updated to include a left-right swipe selection (a la Tinder).

Doug talked about how he implemented the 4 touch events: start, move, end, and cancel in JS. Tips included adjusting for older mobile hardware by throttling transactions to a min of 1/10 a second and animating with transforms. He also recommended using clientX and clientY coordinates to identify the touch locations across many different platforms.

He also spoke about using SASS to handle media queries and how compiling and using gzip makes even a large, complex set of media queries quick to load and execute.

Alpesh Shah @revsystems.com talked about his hard-won wisdom on running a web development agency. Tips included

  1. Must understand scope creep and other contracting pitfalls
  2. Don’t partner with your best friend (unless you want to make him/her your former best friend).
  3. Don’t limit your pool of hires to your friends – need diversity
  4. Take on clients your want, not just those you can get
  5. Continue to code. Don’t become just a manager – you will fall behind in technology
  6. Don’t let the inertia carry you nowhere as it masks the problems

 

The key is to keep your interest in the application development and to stay current with the changing technology.

 

posted in:  javaScript, JerseyScript, UX    / leave comments:   No comments yet

JerseyScript and the Goblet of Fire

Posted on July 29th, 2014

JerseyScript and the Goblet of Fire

 Jersey Script  #BostonJs #javaScript #js

Atul Varma (toolness.com / @toolness) , Sean West (github.com/seanewest), John Feminella  (http://jxf.me, @jxxf on Twitter, @fj on GitHub) 

7/29/2014 Indiegrove – Coworking Space, 121 Newark Ave, 5th Floor, Jersey City, NJ 

Three talks presented two tools and some whimsy.

Sean asked why we need to store files on our local computer before we need them and why we need to have a separate download and install process before running a program. For Linux and Apple, FUSE avoids this using a foundational concept from, the original Unix: all communications are treated as accessing a file. In Fuse, external files are treated as local files and only imported when needed. Google has developed Fuse for Windows.

Atul presented minigames as entertainment and a tool to teach programing. Minigames run on the web and take seconds to play. Classic minigames include ‘dumb ways to die’ – (what not to do in the Melbourne subway) and warioware microgames games. Minigames have been developed using a wide range of tools include scratch, waterbear, thimble, impact, elm, unity, haxe, emscripten. In addition, http://minica.de has a javascript library, Tinygame.js  (see http://minica.,de/docs for documentation).  There are many advantages in using minigames as a teaching tool: short programs, simple structure, failure does not affect other programs.

John described the pitfalls in naïve use of the date and time functions. These include missing shifts from standard/daylight time, changes in offsets from UTC time and changes in the calendar by governing bodies.

He showed pitfalls of naively converting from UTC to local time and recommended using frameworks such as moment.js or XDate (faster, but misses some corner cases).

posted in:  applications, javaScript, JerseyScript, Programming    / leave comments:   No comments yet