I want to highlight my terribly-named recent GitHub project “TypeScript-Docker-Node-DI-Starter”, which is meant to combine a stack I’ve become familiar with, but where each component requires some labor to start fresh with.

These are:

  • Docker
  • MySQL in a docker container
  • Node/express, with a persisted connection to be above
  • TypeScript as the languge for the node project, compiling via npm scripts
  • An ORM for MySQL entities
  • OAuth tables, a user table, and fully functional Oauth login flow
  • Dependency Injection
  • A suite of npm scripts and other minor depedenices in the package.json, for convenience

The OAuth implementation is clean, and relies on no existing “All in one” dependencies (just bcrypt and token generators)

I hope this can help someone, just from a standpoint of delivering a boilerplate that no single tutorial online assembles.

View on GitHub

After a few months of evening work and a lot of experimentation, I’ve released an iOS app.

Codable screenshot

Codable provides three primary features:

  • resizable viewport with scaling, allowing you to view any URL as if you were on a smaller or larger iOS screen size
  • JavaScript console support
  • Rendered DOM node navigation and HTML/CSS manipulation

By my knowledge, there are two other functional apps on the iOS app store that do these same functions. It’s a pretty niche use-case to want to do front-end web debugging and editing from mobile I know, but it’s something I’ve wanted to do many times.

Codable leverages one API endpoint quite heavily and uniquely: WKWebView.evaluateJavaScipt()

If you click through on that link, you’ll see that it isn’t too helpful. There is no APIs for grabbing browser errors, the console, the pre-rendered source, or the rendered DOM. So, how do you grab it? Via JavaScript, from the above API. There is pretty much a constant stream of JS dom-query scripts being applied to the browser, and a JSON-ified node list script response is then captured coming out.

Go to Codable on the App Store

If you are struggling to find the cause for Safari not allowing scrolling on a modal, check if you’re using this CSS animation:

animation: drop .5s;

I was struggling for a little while over why a modal that popped in using CSS animations would not scroll in Safari (but would briefly be scrollable before the first .5 seconds I noticed).

Apparently its a Safari behavior (bug?) that causes content to be un-scrollable if the animation property applied to it has run. Removing this property fixed the issue with scrolling in the modal. This does not impact Chrome or Firefox.

When setting up Heroku on a new machine, I ran into this error after running heroku keys:add:

Post https://api.heroku.com/login: x509: certificate signed by unknown authority

Post https://api.heroku.com/login: x509: certificate signed by unknown authority

The solution is to run the following:

HEROKU_SSL_VERIFY=disable heroku login

With the recent release of Angular 1.6, I’ve updated a codebase and ran into a new issue:

Possibly unhandled rejection: {"status":400,"statusText":"SearchCtrl._labot5d8x did not register the event: searching"}

Browser console error

The statusText above really isn’t super important. The Possibly unhandled rejection is the tricky one, due to its generic-ness.

In the codebase I’m working on, this is due to various promise-helper convenience functions bootstrapping but not having a promise immediately passed through them.

This was not an issue with Angular 1.5, so it appears that 1.6 is somewhat more strict (not necessarily a bad thing at all).

Here is how to shut this off:

app.config(['$qProvider', function($qProvider) {

This was actually causing some strange behavior until added to the app config – these console errors were not harmless. Hopefully this helps someone else.