Sunday, April 30, 2017

Reactive Extensions

This is the observable stuff of RxJS. The idea has a .NET sister too. (Rx.NET)

interesting architecture

On July 3rd of 2016, I took these pictures of Söder Torn.

It's a residential tower in Stockholm, Sweden on the isle of Södermalm where Greta Garbo is from.

I guess it's really pretty boring beyond its looks, which certainly intrigued me.

I hear there is a restaurant that a tourist like me could perhaps visit at its base.

But, I was there on a Sunday so it was closed.

$state.go and $state.params

In this Angular 1 paradigm of ui-router, $state.go as a method call typically contains at its signature where to redirect to as a first input and a JSON object of properties to map onto $state.params as a second input. At a $stateProvider wireup such as:

$stateProvider.state(whatever);

 
 

...whatever is going to need, as a JSON object, a property called params which will be a JSON object with properties for each of the $state.params to maps over and their default settings.

whatever = {
   name: 'foo.bar.baz.qux',
   url: '/this/that/theotherthing',
   params: { lucky: 13, everything: 42 },
   views: {
      'hogwash': {
         templateUrl: '/flapdoodle/malarkey.html'

 
 

I guess our $state.go might look like so:

$state.go('foo.bar.baz.qux', { lucky: 69, everything: 86 });

configuration service

Instead of having two hops to go anywhere as suggested here with a broker service maybe the thing to do is to get a dictionary full of friendly names for endpoints as keys with URL and/or IPs as values and hit the configuration service for this one time upfront in running an application.

Wikipedia cheat sheet on byte multiples

This has this...

1,000 bytes kB kilobyte
1,000,000 bytes MB megabyte
1,000,000,000 bytes GB gigabyte
1,000,000,000,000 bytes TB terabyte
1,000,000,000,000,000 bytes PB petabyte
1,000,000,000,000,000,000 bytes EB exabyte
1,000,000,000,000,000,000,000 bytes ZB zettabyte
1,000,000,000,000,000,000,000,000 bytes YB yottabyte

done, done, done

done coding, through the testing, and also validated by the product owner

Jira will show you swimlanes like on a Kanban board.

A swimlane gives a good snapshot of progress for a to-do.

data-ng-if seems to be the *ngIf of the Angular 1 stuff.

sigh.

Saturday, April 29, 2017

the bench

If you're "on the bench" you're between billable engagements waiting to be useful again.

Thursday, April 27, 2017

.Dump() in LINQPad.

whatever.Dump(); in C# in LINQPad is going to barf out whatever is in whatever. It has reporting in this manner that makes a little table in the UI, like logging to a console but prettier. You may select to an anonymous type from a given collection and then dump it out to test your LINQ fu.

monolith

a big application with a lot of history of many different hands touching it, probably including more than one architect, that is not necessarily legacy code

character manipulations in C#!

change the case:

myCharacter = Char.ToUpper(myCharacter);

 
 

some true or false checks around char type variables in C#:

  • if (Char.IsLetter(myCharacter)) {
  • if (Char.IsUpper(myCharacter)) {
  • if (Char.IsLower(myCharacter)) {

implicitly "see up" to a namespace from nested namespace?

This surprised me. In the Visual Studio 2017 release candidate I made a solution, put a parent POCO in a particular folder, making a default namespace like Foo.Bar.Baz, and then when I made a folder in the folder holding the parent and put some kids in there which ended up having a namespace of Foo.Bar.Baz.Qux I was able to inherit from the parent without a using declaration looping in Foo.Bar.Baz too. Interesting!

Wednesday, April 26, 2017

JavaScript agent (ADRUM)

This starts out with "Sometimes the standard manual injection scenario is not appropriate for your installation." and so ADRUM is something hacky, an alternative. This may cause performance problems with Angular 4.

TSLint

like jslint only for... TypeScript!

Jasmine mocking!

spyOn(myService, 'myMethod').and.callFake(() => {
   return {
      then: (callback) => {
         callback(someVariableForSomething);
      }
   };
});

 
 

The following in contrast to what is above will just make a method on a service do nothing and return nothing when called.

spyOn(myService, 'myMethod');

oldmanesque

Screen savers would save your screen back in the 90s. They would kick in after x number of ticks of inactivity on your behalf. HyperCard was like a forerunner to PowerPoint with a little more programmability. If you draw on a piece of paper with a yellow highlighter and then photocopy the piece of paper the yellow translates to a cool neutral grey. Fax is short for facsimile. "stood up" used to mean the other party didn't arrive for a meeting and now it means that an environment has been prepped with the applicable flaming hoops (Web.config, hosts files) having been jumped through :)

how to post with Postman

  1. get the app here
  2. select POST from that drop down list that says GET
  3. pick the Body tab instead of the Headers tab just below the drop down
  4. click x-www-form-urlencoded (this is the spot to jam in a JSON object)

(I noticed an atom with three electrons is used when the app spins up as an hourglass. If the similar symbol on Doctor Manhattan's forehead is for Hydrogen on the periodic table of elements then this would be... Lithium?)

 
 

Addendum 4/27/2017: I guess it's not a Lithium atom as it has three electrons on three rings instead of two on an inner ring and one on an outer ring.

period star in regular expressions will match any character zero or more times

.*

Wikipedia founder Jimmy Wales is now bringing us Wikitribune.

It will try to curtail fake news.

ngx-datatable is another Angular canned grid thingy

old Angular 1.x is to be referred to as "AngularJS" and the TypeScript integrated new hotness beyond is to be called "Angular"

this per the Angular team

Tuesday, April 25, 2017

immutable.js

This has some data structures that cannot be changed once created without the reference changing which should jive nicely with the OnPush change detection strategy stuff in the Angular 4 space.

Monday, April 24, 2017

locked versus unlocked phones

A locked phone comes with a contract in which you cannot change the provider. Unlocked is flexible where locked is not.

Scam Likely

If you get a call that appears to come from Mr. Likely when he's not a contact, it is because your provider has a service that is letting you know... It's him!

squash

There is a squash command for GitHub that will flatten many commits into one and spare the guy doing your code review in SmartBear Collaborator a lot of heartache.

When you move stories forward to the next sprint it can screw up the reporting for your velocity.

just a heads up

Sunday, April 23, 2017

delete a GitHub repository

  1. log into the web interface
  2. enter the splash page for the repository
  3. across the top where it says: Code, Issues, Pull requests, Projects, Wiki, Pulse, Graphs, and Settings you will want to click on Settings
  4. at the bottom of the page that appears there will be a place to delete the repository

Friday, April 21, 2017

Thursday, April 20, 2017

vPOD stands for virtual performance-optimized datacenter

This is a term that comes up in rolling stuff out to production not unlike "hot fix" or "in-flight change" or "root caused it" although these other terms are not good things to be talking about.

Modules in the Angular 1 stuff don't have specific files.

They just get stuff jammed into them here and there in code like so:

angular.module('whatever').service...

Tuesday, April 18, 2017

Charles Simonyi back at Microsoft!

I'm learning that he was the mind behind Word and Excel and that his startup just got bought by Microsoft so he is going back to work there.

copy and paste text in PowerShell

The usual Windows means to copy and paste really misbehaves in PowerShell. You may, instead, drag a selection over copy in the PowerShell window and then right-click in the selection to copy it to the clipboard. You may then Ctrl-C into Notepad to paste the copy in there. Right-clicking at the PowerShell prompt can paste in copy from the clipboard, be that copy procured in PowerShell's shell or Notepad or wherever. This taught me these tricks. I'm starting to drink the PowerShell Kool-Aid more and more. When you need to put out fires quickly its strange ways can be frustrating.

Monday, April 17, 2017

WWF is Windows Workflow Foundation

This is some sort of "manager" for long-running processes. It's a Microsoft thing.

If you need to set breakpoints in a .spec Jasmine/Karma test for an Angular 2 component...

You can swap out using PhantomJS with Google Chrome (in karma.config.js change the browsers setting) and hit breakpoints there. It is either do that or start logging stuff to the console.

C:\Users\thomas_jaeschke\AppData\Roaming\npm\node_modules

Your psake scripts may need what is in here to run Karma tests.

Sunday, April 16, 2017

online tools for regular expressions?

https://regex101.com/ seems like an OK place test out if your RegEx patterns match something and https://regexone.com/ is a little challenge to help you get good at RegEx. Thanks again Yulia Danilova.

SSH keys

SSH stands for Secure Shell. You connect an SSH client to an SSH server using an SSH key. That is why GitHub is sending you little emails about the keys.

Saturday, April 15, 2017

DLL Hell

Wikipedia suggests this is "a term for the complications that arise when working with dynamic link libraries (DLLs) used with Microsoft Windows operating systems" and what this has to do with is the act of having to go fishing online for a missing .dll file (that wasn't checked into source control) when you pull the code for someone else's Visual Studio solution and it doesn't work because the compiler can't find something.

a better way to get modern AngularJS to work with MVC views

What I suggest here is probably not going to work beyond the HomeController. You'll end up with IIS conflicts between paths to the folder you make and the MVC routing. Instead, put your JS files wherever and just doctor up the

  1. npm,
  2. app,
  3. and main

settings at systemjs.config.js as suggested here to go to more complicated paths. Those three doctor-ups in this one file will get you on the other side of all of the red gunk coming up in Google Chrome Developer Tools' console.

 
 

Addendum 4/16/2017: You have to change templateUrl settings in components too.

Friday, April 14, 2017

The let keyword in TypeScript is pretty good about keeping immediate lexical scope from affecting parent scope.

let foo = 123;
if (true) {
   let foo = 456;
}
alert(foo);

...returns 123, while...

 
 

var foo = 123;
if (true) {
   var foo = 456;
}
alert(foo);

...returns 456 (not cool). The let trick works by making JavaScript like so:

 
 

var foo = 123;
if (true) {
   var foo_1 = 456;
}
alert(foo);

By the way, as a bonus...

 
 

var foo = 123;
var bar = {
   baz: foo
};
alert(bar.baz);
foo = 456;
alert(bar.baz);

...gives 123 twice.

Directives exist in Angular 2, but they are not what you are used to in Angular 1.

Components are, in fact, a kind of Angular 2 directive so if you are using Angular 2 at all you are probably already using directives. Structural directives and attribute directives are the other kinds of directives. Beyond ngIf and ngFor some of the similar tag-based things that may be done in Angular 2 markup are structural directives. ngSwitch is the best example and I suppose you may make your own stuff of this ilk.

<ng-container [ngSwitch]="model.inTheMoodFor">
   <ng-container *ngSwitchCase="foodEnum.ghetto">
      Burger King
   </ng-container>
   <ng-container *ngSwitchCase="foodEnum.greek">
      <a href="http://www.athenianbargrill.com/">Athenian</a>
   </ng-container>
   <ng-container *ngSwitchDefault>
      Olive Garden
   </ng-container>
</ng-container>

 
 

Attribute directives like <p myHighlight>Highlight me!</p> sit a tag and warp how it behaves. https://angular.io/docs/ts/latest/guide/attribute-directives.html has the following example for myHighlight directive to make this tag decoration work out:

import { Directive, ElementRef, Input } from '@angular/core';
@Directive({ selector: '[myHighlight]' })
export class HighlightDirective {
   constructor(el: ElementRef) {
      el.nativeElement.style.backgroundColor = 'yellow';
   }
}

shallow and deep copies in JavaScript

Appending to this, you may swallow copy stuff with myArray.slice(0) or just myArray.slice() while a deep copy looks more like this:

var foo = JSON.parse(JSON.stringify(bar));

 
 

This trick in C# is more or less the same hack.

public enum Whatever : uint

This is a C# inheritance trick to get an enum to use a uint instead of an int under the hood. You may inherit from long and byte as well. Yay!

extending the desktop when one of the displays is a 4K ultra high definition display

This can cause all sorts of problems. If your laptop has the UHD setup and your main monitors don't, don't try to use Windows 10's snipping tool at your monitors. You'll have to use it at your laptop's desktop as otherwise the image will be messed up as if sized down in Photoshop.

Thursday, April 13, 2017

Error: [$rootScope:inprog] $digest already in progress

This Angular 1 error comes from running this command then you should not.

$scope.$apply();

$scope.$apply();

Run this line of code after you hand a bit of $scope or all of $scope as a reference into a service from a controller in the Angular 1 stuff to apply changes made to the object that goes off to the other place. Perhaps this will be done in a .then implementation with the Promise API stuff.

Lodash's .each is more optimized and performant at Angular 1 then a JavaScript .forEach.

lodash.each(myBag.items, function(item) {

I think the question mark means one or none in Regular Expressions much like a plus sign means one or more.

The stuff in the curly braces below suggests 1 to 4 places of the number after a decimal if there is a decimal and the asterik any number of a thing.

^[0-9]([0-9])*(\.[0-9]{1,4})?$

 
 

This should basically be the same thing I think.

^[0-9]+(\.[0-9]{1,4})?$

 
 

I haven't tested this. I really don't know if it works. This is just "note to future self" stuff. I think {4,} would mean four or more.

 
 

Addendum 4/16/2017: Someone I just friended on Facebook (Yulia Danilova) suggests: actually, in Regex, question mark means "optional parameter". For instance, colou?r will find a match for both color and colour

circular references in Angular 1 errors

This can happen when looping services in at services. The errors that come up to the console look like this:

Uncaught Error: [$injector:cdep] Circular dependency found: foo <- bar <- baz <- qux
      <- foo

 
 

You would be handing bar, baz, or qux or whatever foo needs into a function signature at foo to get around this.

Don't expect $scope to work in a service as it does in a controller in the Angular 1 paradigm.

This is going to be one of the pain points in abstracting code that a second controller needs out of a first controller into a common service. Hopefully you may isolate what you need to hand over and hand just that over and not the whole of $scope.

PEBKAC - problem exists between keyboard and chair

This has a cheat sheet of similar acronyms. "Press any key" means any key you like. There is not an any key. You cannot download RAM.

debugging TypeScript in Google Chrome Developer Tools

This can take a few different shapes at the "Sources" tab in that the TypeScript files may at first be hard to find or tucked away in their own subsection, boundaries defined by one of those little cloud icons. Just look through everything that is there and you'll see the .ts stuff eventually. It may be in its own folder tree hierarchy. I do not yet understand all of the factors that drive this. It looks different in different projects built out from different seeds. Set breakpoints in the .ts files. You'll be able to hit them. You do not have to debug in the generated JavaScript and then try to reverse engineer how to find the equivalent to a given line of code back in the .ts stuff. Ha. Remember that you're not in Visual Studio anymore and F8 lets you move forward from a breakpoint in debugging and not F5. I hit F5 all the time and end up refreshing the browser. It's infuriating. It makes me think of how in jumping from Windows 3.11 to Windows 95 there was suddenly an X where the icon for maximizing a window used to be at the upper right and I'd try to maximize a window and end up closing it. It made me cranky. I digress.

Wednesday, April 12, 2017

When JSLint tells you: "Too many var statements."

Try declaring the variables all together on one line and then making their assignments on independent lines.

var foo, bar;
foo = function(){
   return 13;
};
bar = function(){
   return 42;
};

 
 

Could be a refactoring from:

var foo = function(){
   return 13;
};
var bar = function(){
   return 42;
};

 
 

Hopefully that will get JSLint to shutup.

TypeScript is a superset as everything valid in JavaScript is also valid in TypeScript.

Google suggests: su•per•set - a set that includes another set or sets

I'm learning that in light of the United Airlines debacle in which a passenger was forcefully removed from a flight...

There are lots of other options to try before violence. Financial compensation for expulsion, etc. Flights are not bars where sometimes bouncers throw you out.

flygresor.se seems to be Sweden's priceline.com

Skype for Business ties into the calendar appointments of the Outlook/Mail app of Windows 10 nicely.

You'll see a "Skype Meeting" button when you make a new calendar invite. It'll put a link in your invite and ultimately the calendar line item that others may click on the join the meeting when the time arrives. Yay!

 
 

Addendum 4/14/2017: A "Join Online" button will be available in the pleasant, chirpy little box that comes up on your screen when its time for the meeting and clicking it spins up Skype!

puck

It's like a mouse but there is a magnifying glass with crosshairs on it that you line up on things. Architects and draftmen doing CAD used these back in the 1990s.

disappearing scrollbar in IE 11

The scrollbar will come and go based on whether or not its needed instead of just being either active or greyed out and that can make the horizontal real estate a few pixels wider than it should be causing CSS heartache.

two finger scrollbar scrolling at keyboard touchpad

It's a thing. This can happen at your PC. I didn't know until today because I don't want to think about not using a mouse.

expiry date

This is England/British English for expiration date in the credit card space.

horse

It is for building isomorphic applications for io.js (a platform spun off of node.js).

regarding copying and pasting code around

This touches on why you might want to do it. I would add that handing in a flag to a method to add some if/then logic is also nasty and breaking the single responsibility principle too. It's not really breaking with the DRY principal to make a different slightly different copy. You break with DRY when you have strictly-the-same dupe code. The painful thing about the apple and orange workflow I give in the link here is that the workflow has to be updated in two places when a step is added. Ideally all of these mechanics are refactored into polymorphic solutions, but who actually does that? I've yet to work anywhere where the powers that be want to clean up that case/switch statement in a God class that is already working.

lambda functions in TypeScript keep you from having to do var self=this; and .bind(this); tricks

this in a lambda gets handed in from the outside implictly

Garry's Mod

Made by a Garry Newman this is Steam game in the family of Half-Life and Counter-Strike with a first-person shooter engine ripe with 3D characters in a 3D enviroment. There is no point. You just goof off. However, users can build out their own content with ease making it rewarding in the same way Minecraft might be.

Tuesday, April 11, 2017

a history of JS power struggles

JavaScript was what it was before the coming of the iPhone in 2008. First it was called Mocha, then LiveScript, then JavaScript, and then ECMAScript (though name number three stuck) and this was all before it was worth caring about. Once Adobe Flash was not to be on the iPhone, HTML5 and JS was suddenly very trendy! Microsoft still pushed XAML and Silverlight but that wouldn't last but a few years. If we were going to care about silly little JavaScript that begged the question "What's the best way to approach it?" Do we write JavaScript itself? Do we use jQuery? Do we use dojo? jQuery wins that fight and becomes the thing to beat! Actual frameworks appear to challenge it! Knockout, Backbone, Ember, Angular, etc. AngularJS in turn then becomes the king of the hill and thus it becomes the thing to beat. It has significant problems with what at first seemed like ingenious two-way data binding. What do we do? Do we flow data in one direct with react.js instead? Do we make a better version of Angular like Aurelia? Well, both of these solutions seem Mickey Mouse in comparison to Microsoft and Google teaming up to give us Angular 2. And now we are, where we are.

use the ghetto, not quite SSMS in Visual Studio 2017!

at: Tools > SQL Server > New Query... ...you'll end up getting a dialog box where you'll punch in server specs. You'll end up with an interface that is a blank white window with a dropdown up top for picking a particular database at the server. Pick a database and then start punching in queries in the white space. Use the green rightward pointing arrow to run the queries. See what tables are available like so:

SELECT * FROM INFORMATION_SCHEMA.TABLES

make Web.config look into another file for appSettings

<appSettings configSource="config\whatever.config" />

...will defer to another config file. In the other file you should have the open and close tags for appSettings and a bunch of keys between them. Do a variant of the same thing for connectionStrings.

A spy is a partial mock.

Maybe one or two methods on the thing being mocked are mocked and the others just do what they do.

Monday, April 10, 2017

Slashdot

It's a geek news site. Wikipedia says that Slashdot is sometimes abbreviated as /. and makes no mention of Logan Abbott! Abbott's Twitter suggests CodePlex is a rival to SourceForge.

.subscribe to an event in Angular 2?

I have not really played with this yet. This suggests you may subscribe to an event emitter like so...

ngOnInit() {
   this.subscription = this.navService.getNavChangeEmitter().subscribe(item =>
         this.selectedNavItem(item));
}

 
 

...where herein getNavChangeEmitter is a method wrapping return this.navchange; and navchange is an EventEmitter. The example of unsubscribe is:

ngOnDestroy() {
   this.subscription.unsubscribe();
}

 
 

...and this has subscription.dispose(); too as another way to get rid of our actor. ngOnDestroy is one of eight or nine lifecycle hooks for components in Angular 2. Remember that components are a lot like ASP.NET web forms and the lifecycle hooks are kinda like the canned Page_Load/Page_Init events in web forms. The list of them is:

  1. ngOnInit
  2. ngOnChanges
  3. ngOnDestroy
  4. ngDoCheck
  5. ngAfterContentInit
  6. ngAfterContentChecked
  7. ngAfterViewInit
  8. ngAfterViewChecked
  9. constructor (does constructor count as a ninth event? there seems to be some ambiguity)

Round a number to two digits in JavaScript or TypeScript.

let foo = Math.round(bar * 100) / 100;

JavaBeans

A bean bundles up "many objects into a single object" in the Java space.

Classy web-development dressed in a DSL???

That's how Sinatra describes itself. I really don't know anything about this old project. I think the Ruby weirdoes were into it. I thought of it just now because it used to be that you could Google the word Sinatra and you would get this first before anything about Frank Sinatra. Around the same era you could Google Tarantino and get details on The Tarantino Project before Quentin Tarantino. Maybe my Googling was warped by my Austin, Texas geolocation. I'm not sure. Anyhow I found this interesting. I keep thinking of old stuff as I'm an old man.

SourceForge

I've heard Scott Hanselman say of it "It's still there." and tweet that it is the mySpace of online repositories or online source control or something. GitHub is what everyone abandoned this for. I remember a certain someone describing Netscape Navigator as the RC Cola of browsers when explaining why he didn't want to support development for it. I guess I won't drop his name as that would be tacky. :P

Sunday, April 9, 2017

data-tooltip

I've seen some stuff in Googling that suggests that data-tooltip is a pretty good thing to use for a tooltip. You'd use it as a data attribute at a tag. You're still gonna have to roll some CSS magic to make it do anything however. In Angular 2 you may have something like this:

<span [attr.data-tooltip]="whatever.tooltip">{{whatever.title}}</span>

 
 

...and Angular 2 will be smart enough to just not add the attribute if whatever.tooltip is falsey. Also, the alt/title thing will work with attr.alt or attr.title in Angular 2 in the same manner and that trick requires no CSS.

Saturday, April 8, 2017

binary and hexadecimal numbers in TypeScript

let foo: number = 0x56;
let bar: number = 0b1000101;
let baz: number = 0x2a;
let qux: number = 0b1101;
alert(foo);
alert(bar);
alert(baz);
alert(qux);

 
 

The code above is going to give us four alerts which will progress through these four numbers:

  • 86
  • 69
  • 42
  • 13

 
 

These were confusing when I first saw them. Basically you lead the hexadecimal settings with 0x and the binary settings with 0b. The stuff that comes after the 0x or the 0b is the actual number. Binary numbers need to be made up of ones and zeros only while letters a through f are legit in a hexadecimal number obviously. Also, the hexadecimal stuff clearly works standalone in JavaScript because look at the JavaScript the TypeScript compiles to.

var foo = 0x56;
var bar = 69;
var baz = 0x2a;
var qux = 13;
alert(foo);
alert(bar);
alert(baz);
alert(qux);

You're supposed to put two spaces after the period at the end of a sentence when typing.

I'm just kidding. No one does this anymore. While we are on the subject of typography. Kerning is the space between individual characters and tracking is too but tracking is a metric of overall character density and not the not the distinction between how close a w to sits to an a versus how close an l sits to an a. Leading is the space between lines of copy.

getsetters in TypeScript

The following code will barf up an alert telling you that "The Green Anaconda is 5 meters long!"

class Snake {
   private _commonName: string;
   private _lengthInMeters: number;
   get commonName(): string {
       return this._commonName;
   }
   set commonName(c: string) {
       this._commonName = c;
   }
   get lengthInMeters(): number {
       return this._lengthInMeters;
   }
   set lengthInMeters(l: number) {
       this._lengthInMeters = l;
   }
}
let anaconda = new Snake();
anaconda.commonName = "Green Anaconda";
anaconda.lengthInMeters = 5;
let prose = `The ${anaconda.commonName} is ${anaconda.lengthInMeters} meters
      long!`;
alert(prose);

How do you fake the server in working locally on a microservices app?

If you're application reaches out to diversified end points all over the place what can you do? I'm in this situation now, and in our environment unfortunately we are just hitting the API endpoints of QA servers and if they are messed up we can't work! At most jobs there is a way to fake the environment locally. Devs will have a local database, etc. How do we do this for microservices architecture? Have a secondary app with endpoints to hit and reroute URLs there by doctoring up your hosts file? It has been suggested that really the application should talk into a broker service which then makes a call out to the meat of things or perhaps a messaging bus if not a broker service. I guess that approach adds a layer of fat and thus a performance hit.

Friday, April 7, 2017

Kai's Power Tools

Kai Krause made these to work with Corel Photo-Paint and Adobe Photoshop. He made Kai's Power Goo too for morphing faces. It's old cheese that is long gone.

"It was a gift" she said of her smartwatch.

I guess that's really the only way one ends up with a smartwatch anymore. This girl admitted that her iPhone does everything her Apple Watch does only better, so... whatever. She did say that the new Apple Watches (not hers) were waterproof so that she could text while swimming but in Googling this I kinda get the impression that they are water resistant not waterproof.

Online JSON Viewer

It's at jsonviewer.stack.hu and you may copy a JSON object without line breaks here and then click the "Format" button at the top nav to have it laid out nicely for you.

Ctrl-F5 in Visual Studio 2017 will run the app at a browser without the debugger.

Cool stuff.

Thursday, April 6, 2017

cast a string to a number in TypeScript

doSomething(setting: string) {
   let shouldGoForward: boolean = false;
   let price: number = Number(setting);
   if (price || price === 0) {
      shouldGoForward = true;
   }

 
 

Maybe you can imagine what comes downstream based on the shouldGoForward flag.

the stupidest ideas for T-shirt designs

I see some really crazy ideas for T-shirt designs online and partially so because I've bought a lot of T-shirts online and Facebook is paying attention. It feels like some of the gimmicks can't possible sell and haven't been market tested before they are released but then again they are probably being market tested when they are rolled live. I once did some contract work for Zach Turicchi's now defunct nastykids.com and I know this life is basically about putting together a design in Adobe Illustrator, getting it up on your web site, and then silk-screening some T-shirts should you get some nibbles. As an artist, the stream of consciousness whatever your sense of ennui pushes into instantiation might lead to something that sells and it's easy to "just try it" by setting a new idea on the shelf side by side with other things that are selling. The online T-shirt shop thus can become a venue for diverse artists to broadcast their ideas. If the sight has a big marketing footprint, a design that can't sell a single T-shirt can nonetheless get in front of a lot of eyes and show off what an artist can do. I see so many designs that are creative and awesome beyond the bounds of being sellable and I have drawn some conclusions about why this is so... low barrier to entry, high exposure, etc.

OneDrive

It's online file storage from Microsoft.

TestCafe

another Selenium knockoff?

draw.io

It's a flowchart maker.

Wednesday, April 5, 2017

use a .do with Observable

act(url: string): Observable<Whatever> {
   return this.http.get(url)
      .map((response: Response) => <Whatever>response.json())
      .do(d => this.transformationOfStuff(<Whatever>d))
      .catch(this.handleError);
}
 
private transformationOfStuff(item: Whatever) {
   if (item) {
      item.taco = Taco.Breakfast;
   }
}

SnappyTV

It is another Twitter-owned video service, like Vine but less famous.

cardinality

This can be the cardinal number of rows in a database or things in a logical set, or, alternatively, if you can map something one-to-one from A to B as with say an AutoMapper mapping then the circumstance could be said to have cardinality. Things match up at a dance partner in the second circumstance.

Augury is the new Batarang

It is for Angular 2 where Batarang was for Angular 1.

fire escape into a death trap

Be wary of over engineering things. The first rule of sales is that you don't want to talk about a bunch of esoteric technical details in a look-how-smart-I-am manner that talks over the heads of would be clientele. You want to keep it simple and only tell the other party what they want to know. I'm not sure that the same isn't true in the technical sphere. Code should be code a junior developer can follow. Boilerplate code is good for you. Some where T : magic, not so much. Try not to roll a ball of yarn that only you can unspool. The gunk I see that is fancy schmancy tends to be something a hero set up that no one else every touches. Everyone else kinda tiptoes around it. By way of being uncommon it is immune to extension. It took me a long time to realize this. As a junior developer, in wanting to reach high, I mistakenly thought that architecting involved rolling your own pattern that used code for cross-cutting concerns, Func and attributes, and the like. This is not so. Something about these things shines like a diamond from the outside looking in but once you've made your own antipattern with them they're less intriguing. The I-don't-understand-it-so-therefore-it's-awesome logic is a reflection of your own imposture syndrome and not reality itself. The cookies kept in a cookie jar on a high shelf are all moldy and nasty. Don't use T4 templates. They suck. Don't ask your developers to use a WinForms app that you made that barfs out boilerplate code from T4 templates instead of writing boilerplate code themselves. I once was at a consultancy that really blossomed under a sprawling multiyear government contract and packed a lot of what it baked for that project into an open source project that might be repurposed for future projects. Why rewrite the login controls every time, right? Well, this invention was so bloated that it was never used once successfully as a project template. When I was at Veterans Affairs there was an application so peculiar that someone had authored and abandoned yet the VA itself had to maintain that became one of many arguments behind trying to move away from actually doing development towards solving all problems with COTS (commercial off the shelf) solutions. For the developers coming in the door after the fact, .NET developers because the contract still specified .NET developers, there was a "Would you like learn SharePoint?" surprise. This happens downstream of someone else screwing up. Think of some of the painful things you've had to put up with. Don't build landmines for other people. Don't delude yourself into thinking you're being helpful when you're being slick.

Array.prototype.find()

This is "primative" default JS way to do some searching in a collection, primative in comparsion to underscore.js or TypeScript acrobatics of this nature. This has the following example which will pick out just the 130:

function isBigEnough(element) {
   return element >= 15;
}
[12, 5, 8, 130, 44].find(isBigEnough);

Map, WeakMap, Set and WeakSet are examples of TypeScript collections beyond just the common Array.

This has some details on the four. Map and WeakMap are vaguely like a dictionary in C# and Set and WeakSet are more like the JavaScript arrays. I don't really know what sets Set and WeakSet apart from arrays just yet.

Tuesday, April 4, 2017

Raygun

...watches the behavior of your mobile and web apps. There is real time reporting on crashes and that sort of thing.

PumpkinDB

...describes itself as "Event sourcing database engine that doesn't overwrite data."

The personal hotspot on my iPhone is now tucked away at...

Settings > Cellular > Cellular Data > Personal Hotspot

SCOUT

...was a social media app that was smartphone only and basically like MySpace only even more slime-centered and voyeuristic... well and less customizable too.

in Windows 10 when you right-click on a taskbar there is explicitly an option for "Lock all taskbars"

It needs to be unchecked if you want to fatten the taskbar or drag it against the side of the monitor or whatever.

Monday, April 3, 2017

Inputs for components in Angular 2.

Hand them in at a tag like so:

<selector-for-foo [my-something-er-other]="13"></selector-for-foo>

 
 

Inside the component itself you'll need an import statement like so:

import { Component, OnInit, Input } from '@angular/core';

 
 

Open up the component like this:

export default class Foo implements OnInit {
   @Input() mySomethingErOther: string;

 
 

Note that you may log this.mySomethingErOther to the console in OnInit but not in the constructor. Also note the difference between camel case and kebab case.

Change it to fit to run just that one test in Jasmine/Karma/PhantomJS testing Angular 2 stuff.

.only works in the mocha paradigm

 
 

Addendum 4/7/2017: Protractor also has .only.

Add a defect to a story in TFS.

  1. Log into the web interface.
  2. Enter a project.
  3. Search for your story by number at the upper right.
  4. In the modal that appears click the icon at the upper left which looks like a clipboard with a checkbox on it for a "New linked work item"
  5. In the second modal that appears "Work item type" should be set to "Defect"
  6. Click "OK" and then go through another few steps.... the next steps are a no brainer

The spread operator and the deconstructor in TypeScript.

At this, "This throws the same three alerts." is an example of the spread operator and "Suck out the parameters from a type out to variables! The following throws two alerts that say first 123 and then: Product Model 123" is an example of the deconstructor.

See all the defects for a story in TFS.

  1. Go to the web interface.
  2. Enter a project.
  3. Search at the upper right for a story by its number.
  4. At the modal that comes up click on "ALL LINKS" and scroll through the stuff that appears.

For those of you diehards who held out that web forms was better than MVC, you're gonna love Angular 4.

It sure seems a lot like web forms. I'm trying to figure out how the routing working in the Angular 4 seed. It's intriguing. Consider this outermost (in terms of Russian dolls analogies) module...

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { APP_BASE_HREF } from '@angular/common';
import { HttpModule } from '@angular/http';
import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';
import { AboutModule } from './about/about.module';
import { HomeModule } from './home/home.module';
import { SharedModule } from './shared/shared.module';
@NgModule({
   imports: [BrowserModule, HttpModule, AppRoutingModule, AboutModule,
         HomeModule, SharedModule.forRoot()],
   declarations: [AppComponent],
   providers: [{
      provide: APP_BASE_HREF,
      useValue: '<%= APP_BASE %>'
   }],
   bootstrap: [AppComponent]
})
export class AppModule { }

 
 

And this outermost component like so...

import { Component } from '@angular/core';
import { Config } from './shared/config/env.config';
import './operators';
@Component({
   moduleId: module.id,
   selector: 'sd-app',
   templateUrl: 'app.component.html',
   styleUrls: ['app.component.css'],
})
export class AppComponent {
   constructor() {
      console.log('Environment config', Config);
   }
}

 
 

Which uses this template...

<sd-toolbar></sd-toolbar>
<sd-navbar></sd-navbar>
<router-outlet></router-outlet>

 
 

Alright, the template for the outmost component and the index.html page that loops it in is kinda like a master page in web forms. The page guts will swap out what is at router-outlet. The nav component just offers simple links like so:

<nav>
   <a [routerLink]="['/']" [routerLinkActive]="['router-link-active']"
         [routerLinkActiveOptions]="{exact:true}">HOME</a>
   <a [routerLink]="['/about']" [routerLinkActive]="['router-link-active']"
         [routerLinkActiveOptions]="{exact:true}">ABOUT</a>
</nav>

 
 

Any one component for a "page" say about.component.ts for example in the routing paradigm to make the nav bar work has a module (about.module.ts) which itself has a routing module (about-routing.module.ts) which makes sense of routes. routing.module.ts knows what to do with '/about'

import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { AboutComponent } from './about.component';
@NgModule({
   imports: [
      RouterModule.forChild([
         { path: 'about', component: AboutComponent }
      ])
   ],
   exports: [RouterModule]
})
export class AboutRoutingModule { }

 
 

Cool stuff... and not too tricky.

The safe navigation operator of C# 6.0 basically exists at Angular 2 templates!

Use it in templates to dot dot dot out to things "safely." It is not C# in this context. It is AngularJS magic.

The city of Forth Worth, Texas is the first major US city where you can get city-served metadata on a locale based on longitude and latitude.

I did an interview with the city of cowtown months back and learned that they offer up what crimes happened at a given point and what buildings are not up to code, the code violations, etc. It's all tied into GIS.

Sunday, April 2, 2017

Saturday, April 1, 2017

similar names

  • I think rake is the Ruby version of psake or jake.
  • sails is a Node.js framework. (think ruby on RAILS) ...and Grails is for Java and of Groovy and JVM (Java Virtual Machine)

 
 

Addendum 4/2/2017: While we are on the subject of common names I should state that I am not Thomas Jaeschke the Olympic athlete. I'm just as goofy and adorable as that guy but I have considerably less talent and years to live.

What is a yarn.lock file?

yarn.lock is a file like package.json. It probably sits in the same folder if it exists. It's optional so it might not be there at all. If it is there you may use the command...

yarn install

 
 

...to use it to hydrate a "node_modules" folder in lieu of...

npm install

 
 

...which uses package.json instead of yarn.lock for the "What do I do?" instructions. Why should you care? yarn.lock locks dependencies at very specific versions and thus ensures that when you pull the dependencies there won't be some new version of something that introduces breaking changes which is a cornerstone of grievances against NuGet and npm and all other dependency management "You don't have to worry about it" hogwash. Could you just lock in specific versions with NuGet and npm and other tools? Sure! But, by convention no one does. It's npm convention to have carats and tildes sprinkled about your package.json file. And so, just as we use LinkedIn by convention for something a bit different than we use Facebook even though the two are basically the same app, so too may we use Yarn a bit differently than npm even though they sure seem similar. Get yarn here. Afterwards, open a command prompt and type...

yarn --version

 
 

...to make sure it's there. I got 0.21.3 back when I did this. This has a cheatsheet of commands like "yarn install" and I had to go there in order to set up the seed for the Clarity Controls and get the app to run at localhost:4200 without breaking. When I complained at GitHub about "npm install" not working I was just told to use Yarn.