Nathan Friedly
  • Home
  • About
  • Portfolio
  • Tech blog

Portfolio

Nathan Friedly is an engineering leader and JavaScript expert with a history of building companies, managing remote teams, and delivering results.

He loves mentoring people, automating tasks, shipping products, and delighting users.

  • GitHub
  • Stack Overflow
  • LinkedIn
  • Resumé
Click a tag to filter the portfolio Clear Filter [X]
AJAX AWS Android AngularJS Apache Arduino Backbone.js Bitcoin BlueTrip Bootstrap Bower Browserify C# C++ CORS CSS Canvas CasperJS CodeIgniter CoffeeScript Continuous Integration CouchDB DocPad Docpad Drupal ECO ESP8266 Express Flash / ActionScript Go Gulp HTML Handlebars.js Heroku IoT Jade Jasmine Java JavaScript Jekyl LESS Memcached Meteor Mobile First MongoDB MySQL Next.js Node.js Open Source PHP Photoshop PostgreSQL Presentation Python React Redis Require.js Ruby Ruby on Rails SASS SEO SQLite Sails.js Twitter TypeScript WordPress YUI e-Commerce email gulp.js hardware jQuery npm

[Show more tags]


Express Rate Limit

I needed a simple rate-limiter for a project and I didn't see anything that fit the bill, so I put this one together.

The initial release was very simple, and didn't share any state across servers/processes. Since then, it's grown to support a variety of data stores (memcached, redis, postgre, etc.) as well as some related libraries including ratelimit-header-parser and express-slow-down.

It's now the most popular node.js rate-limiting library, deployed by Microsoft, IBM, Mozilla, Amazon and countless others. Mozilla recommends it in their Express tutorial, as does Node.js Best Practices

In recent years I've focused more heavily on improving usability, including by running a suite of validation checks early on to catch common misconfigurations along with documentation on how to fix each one.

Express Rate Limit on NPM Express Rate Limit downloads Tagged JavaScript, TypeScript, Node.js, npm, Express, Open Source, Continuous Integration

Puck.js Media Control

This is a Puck.js device running the Espruino JavaScript environment and a script that I wrote to control media playback.

I listen to a lot of AudioBooks, and my earbuds have touch controls that just don't seem to work very well. So, I created this to give me a physical button that works every time and also provides better feedback.

  • A short press toggles play/pause and blinks green once.
  • A long press triggers 3 previous track commands and blinks blue once.

Tagged JavaScript, hardware, Open Source, IoT

Dog feeding tracker

A device that answers the question of "Did anyone feed the dog yet?"

Built with an Adafruit QT Py running CircuitPython, a door sensor, and a dog food container, it detects when the door to the dog food container is opened/closed and colors the LED to indicate when the dog was fed last:

🟢 Green indicates that the dog has been fed her breakfast / dinner (or at least that the food container has been opened within the last 8 hours)
🔴 Red indicates the dog has not been fed her current meal
🔵 Blue indicates the door is opened now, or the wire is disconnected, or the microcontroller rebooted and doesn't know the last time the door was opened. After the door has been opened for a brief period, it switches to rainbow to indicate that the timer has been reset.

Tagged Python, hardware, Open Source

set-cookie-parser

Library to allow Node.js (and other non-browser JS environments such as React Native) to parse Set-Cookie headers sent by other servers.

Most Set-Cookie headers are straightforward to parse, but the HTTP spec allows for headers to be combined into a single comma-separated string, which adds some significant complexity to parsing.

set-cookie-parser is well-tested and widely deployed both in apps and as a dependency in over 100 other libraries with over 1 million monthly downloads.

This library was initially part of unblocker, but was spun off due to its complexity and general usefulness.

set-cookie-parser on NPM set-cookie-parser downloads Tagged Node.js, JavaScript, npm, Open Source, React, Continuous Integration

Next.js in 5 minutes - Lightning Talk

This is a Lightning Talk I gave at Tanium's October 2018 Dev Week with a quick overview of Next.js.

Next.js is a React powered web framework with server-side-rendering, simple file-based routing, intelligent CSS handling, and more. It provides everything that create-react-app provides and more, handling all of the plumbing and allowing you to focus on the fun parts.

Tagged Presentation, Node.js, JavaScript, Next.js, React

approximate-number

~Converts large numbers into a more human-friendly format, similar to ls -lh or Stack Overflow's reputation numbers. For example, 123456 becomes '123k'.

Can be used in Node.js, in browsers, or as a command-line utility.

approximate-number on NPM approximate-number downloads approximate-number on Bower Tagged JavaScript, Node.js, npm, Bower, Open Source

Tanium Threat Response

Tanium offers a platform and suite of modules for large enterprises and government agencies to manage and secure their entire fleet of computers.

My team and I launched the Threat Response module which has a number of capabilities to support both automatic handling of computer threats as well as supporting manual investigation and remediation.

Threat Response keeps a database of activity on each endpoint such as registry changes, driver loads, and file system modification. It can match these changes against known and suspected threats in real time and efficiently scan the history of every computer on the network once a suspicious pattern has been identified to ensure any threat is fully isolated.

My personal contributions covered a variety of tasks including:

  • Performance optimizations to enable near-real time search of upwards of a million computers
  • Mentoring and training of the team, covering Node.js and security vulnerabilities in particular
  • Automated E2E testing that included spinning up and managing entire virtualized networks of computers
  • Enhancing the WebSocket "Live Endpoint Connection" to support remote file system manipulation
  • Developing cross-platform python scripts that run on millions of endpoints simultaneously
  • UI & UX improvements with AngularJS and later React
  • Automated linting and unit tests with ESLint, Pylint, Jasmine, tox
  • SQL Server, Postgres, and SQLite database administration

Tagged Node.js, JavaScript, AngularJS, React, Continuous Integration, Python, C++, Go

Speech to Text demo

The Speech to Text demo allows live transcription of microphone input, user-provided audio files, and sample audio files via the Watson Text to Speech service.

I re-created the app, building on top of my Speech JavaScript SDK and our React Components Library.

The updated demo is cleaner, faster, mobile-friendly, better-tested, and easier to work on and extend than the earlier one.

Tagged JavaScript, Node.js, React, Express, Continuous Integration, Open Source, Mobile First

Color OLED display library for Particle Photon

Library to connect an Adafruit SSD1351 1.5" Color OLED breakout board to a Particle Photon.

I built on top of the working driver created by Adafruit and the Particle community, filling in the gaps and adding polish.

My contributions included adding wiring instructions, adding and tweaking the example, packaging it in the Particle library format, and generally improving the documentation.

Tagged C++, IoT, hardware, Open Source

Watson React Components Library

My team and I started developing a collection of reusable React components that build on top of the Watson UI Components library to support rapidly building demos and other web apps.

The components are general UI widgets that do not directly interact with Watson services, but the library includes things such as an image picker that would be helpful when building Watson-powered applications.

My contributions included creating and enhancing several of the components, automating deployment, improving testing, and improving the documentation and examples.

Watson React Components Library on NPM Watson React Components Library downloads Tagged React, JavaScript, Open Source, Continuous Integration, Express

Contentful Dictate UI Extension

Contentful is a hosted CMS with a friendly-yet-powerful back-end UI, and an API-only front-end. Their UI Extension SDK enables custom content fields to provide greater flexibility when needed.

Contentful Dictate was a quick 2-hour hack (+ some polish added later) to create a voice dictation text field with my Watson Speech SDK.

The extension automatically matches the content's locale to the closest Watson voice model, and also matches contentful's styles.

Given that microphone access is only available in fairly modern browsers, I was able to use quite a lot of ES6/ES2015 syntax without needing any ES5 transpilation.

Tagged Node.js, JavaScript, Open Source, Express

Watson Developer Cloud Speech JavaScript SDK

Easy to use SDK for working with the Watson Speech-to-Text and Text-to-Speech services in web browsers.

Can synthesize voice audio from text input and transcribe speech from various sources including microphone input, download files, and user-provided files. Advanced usage allows for input from arbitrary audio sources. Supports Promises, Streams, and outputting directly to a given HTML element, including live-updating.

The library is built around a series of composable Node.js-style streams, and a few helper methods for common use cases.

Available as watson-speech on npm and Bower, and also as a standalone JS file. Thoroughly documented and tested, with continuous integration and delivery.

Watson Developer Cloud Speech JavaScript SDK on NPM Watson Developer Cloud Speech JavaScript SDK downloads Tagged JavaScript, Continuous Integration, npm, Open Source

◢ Incline

After more than a dozen years as nFriedly Web Development, I decided to rebrand my business as Incline. The new name better represent the growing size, scope, and goals of the business.

The design features a stunning mountain photo captured by Sam Ferrara, and a color scheme chose to compliment it.

It's built with Jekyl and Bootstrap v4-alpha. At the time of writing, it's not fully complete, but it is live and functional. It's currently using several emoji, although they will likely be replaced by Font Awesome once v5 ships.

Tagged Jekyl, Ruby, Bootstrap, SASS, HTML, Open Source, Continuous Integration, Mobile First

Space Jump

Fun little browser-based game, sort of a cross between Doodle Jump and Moon Lander. I put it together over my Christmas vacation with the primary goals of having some fun and getting more experience rendering 2d graphics.

While I'm normally a big proponent of building on top of existing tools and frameworks, I decided to go "bare metal" with this one: the game itself is written in vanilla JavaScript with no dependencies whatsoever.

The background image is from NASA; all graphics are either hand drawn or prodecuraly generated. The levels themselves are procedurally generated.

On a desktop browser, the game uses arrow keys to navigate. However, on a mobile device, it use touch + tilt controls via the HTML5 touchstart/touchend and deviceorientation APIs.

Renders at a smooth 60 FPS on every device I've tested on.

Tagged JavaScript, Canvas, gulp.js, Mobile First, Continuous Integration

Node SDK Technical Deep Dive Presentation

I gave an internal presentation at IBM on the Watson Developer Cloud Node.js SDK that goes through installation and setup and then builds a small app to analyze, translate, and speak text.

The presentation was done live, the video is from one of my practice runs with some slight editing.

Tagged Presentation, Node.js, JavaScript

Visual Recognition Demo

A sample app that shows off the capabilities of the IBM Watson Visual Recognition service. The service can recognize arbitrary pictures, detect faces, gender, age range, and even some well-known celebrities. It's also customizable and trainable, and the demo shows off every aspect of the service.

I served primarily in an advisory role, but also did some of the development work aimed, simplifying the internals and adding automated testing / continuous delivery.

Tagged Node.js, JavaScript, React, Open Source, Continuous Integration, Express

Document Conversion Demo

The Watson Document Conversion service accepts documents in a variety of formats and converts them to formats compatible with the Watson Retrieve and Rank service.

I helped to create both the initial version of the Document Conversion demo, and the updated one based on our React components Library.

Tagged JavaScript, Node.js, React, Express, Open Source, Continuous Integration

Klopfer Building

The Klofer Building, where Incline's offices are located, has a couple of additional office spaces available. The building owners asked me to set up a new site to advertise the available spaces and provide a directory of of current tenants.

The site makes extensive use of microformats to facilitate rich, automated processing. It also provides floorplans, a map, and some of the history of the building.

Tagged Bootstrap, SASS, HTML, Mobile First

Naughty or Nice Candy Machine

We built a Watson-powered candy machine: it gives sweet or sour candy depending on the semtiment of one's statement. It was initially built for IBM's 2016 InterConnect event and then displayed at subsequent events including the Tribeca Film Festival.

I worked on both the hardware side, assembling an Arduino to control the machines, and the software side, developing the Watson Speech JS SDK that helps capture and transcribe the user's voice. There was also a python script running in the background that orchestrated everything.

Tagged IoT, hardware, Arduino, Python, JavaScript

IBM Watson Developer Cloud Website v2

I worked with the design team to get the new Watson Developer Cloud design under a tight deadline. The new design further improved on the previous one in terms of flexibility, performance, usability, and aesthetics. V2 used the same DocPad static site generator as the previous version and integrated with the same underlying content sources.

Tagged SASS, HTML, ECO, DocPad, CouchDB, SEO, JavaScript, CoffeeScript

Load more...

Loading...

Contact Nathan

  • nathan @ (this website)

Site Map

  • Home
  • About
  • Portfolio
  • Tech blog

Website by Nathan Friedly

Creative Commons License Content licensed under Creative Commons Attribution.

Source code available on Github under a MIT License

Built with Eleventy, Bootstrap, and Node.js.