Subscribe: Ben Nadel ColdFusion, jQuery, And Web Development Feed @ BenNadel.com
http://www.bennadel.com/index.cfm?dax=blog.rss
Added By: Feedage Forager Feedage Grade A rated
Language: English
Tags:
angular ben  angular  ben nadel  ben  css  demonstrates  nadel demonstrates  nadel reviews  nadel  route  view components  view 
Rate this Feed
Rate this feedRate this feedRate this feedRate this feedRate this feed
Rate this feed 1 starRate this feed 2 starRate this feed 3 starRate this feed 4 starRate this feed 5 star

Comments (0)

Feed Details and Statistics Feed Statistics
Preview: Ben Nadel ColdFusion, jQuery, And Web Development Feed @ BenNadel.com

Ben Nadel's Web Development and User Experience Feed @ BenNadel.com



Recent blog posts covering JavaScript, User Experience (UX), ColdFusion, Node, and other topics



Last Build Date: Sat, 18 Nov 2017 11:23:51 EST

Copyright: Copyright 2017 Ben Nadel
 



Prevent Body Scrolling With A WindowScrolling Service When Showing A Modal Window In Angular 5.0.2

Fri, 17 Nov 2017 08:35:00 EST

Ben Nadel demonstrates how to use the CSS property "overflow: hidden" to prevent scrolling on the Body element in an Angular 5.0.2 application. This approach can then be encapsulated in a WindowScrolling service and used to disable scrolling when modal windows are open....



Why Message-Queues Don't Carry The Stigma Of An Integration Database

Tue, 14 Nov 2017 08:25:00 EST

Ben Nadel reflects on the Message Queue (MQ) and looks at why it is an integration database that doesn't suffer from the traditional stigma of an integration database. In fact, it is just the opposite - a shared database that keeps systems more loosely coupled....



Sanity Check: Shared Style Urls Are Only Compiled Into Angular 5.0.1 Once

Mon, 13 Nov 2017 07:09:00 EST

Ben Nadel looks at how shared styleUrls are compiled down in Angular components, destroys his previously poor assumptions, and sees a totally new path forward for modular CSS definitions....



Stacking Context Is The Key To Understanding The CSS Z-Index

Sun, 12 Nov 2017 10:53:00 EST

Ben Nadel explores the concept of a "stacking context" in CSS, how it applies to the Document Object Model (DOM), how it quarantines z-index values and, how understanding it will remove the Fear, Uncertainty, and Doubt (FUD) surrounding a layered architecture....



Creating A Twitter-Inspired SVG Progress Indicator In Angular 5.0.1

Sat, 11 Nov 2017 11:11:00 EST

Ben Nadel builds an SVG-based progress indicator in Angular 5.0.1 as inspired by the TweetDeck intake form progress indicator from Twitter....



CSS Flexbox: Creating The InVision Avatar Row Widget

Fri, 10 Nov 2017 08:41:00 EST

Ben Nadel explores the flexible box model in CSS and uses flexbox to try and recreate the overlapping avatar row widget used in InVision App....



Prevent Routing To Secondary View If Page Refresh In Angular 5.0.0

Thu, 9 Nov 2017 09:22:00 EST

Ben Nadel demonstrates how to create a CanActivate Route Guard that will prevent a secondary view from being rendered in a named-outlet upon page refresh in Angular 5.0.0....



Matching Multiple Selectors On The Same Element Creates A Single Directive Instance In Angular 5.0.0

Mon, 6 Nov 2017 06:56:00 EST

Ben Nadel demonstrates that matching multiple attribute selectors on a single HTML element only produces one Directive instance for that element. Which is exactly the kind of behavior we would hope for....



Lazy Loading Images With The IntersectionObserver API In Angular 5.0.0

Sun, 5 Nov 2017 19:04:00 EST

Ben Nadel demonstrates how to use the IntersectionObserver API to implement lazy image loading in Angular 5.0.0. The IntersectionObserver API handles the hard work of calculating element visibility - we just have to wrap it in attribute directives....



Prevent Scrolling In A Parent Element Using Directives In Angular 4.4.6

Sat, 4 Nov 2017 13:22:00 EST

Ben Nadel explores the concept of scroll-trapping in which the mouse wheel is allowed to scroll a local container but is not allowed to scroll a parent container. He encapsulates this logic in an attribute Directive in Angular 4.4.6....



Creating A Direct-Click DOM Event Plug-in In Angular 4.4.6

Wed, 1 Nov 2017 08:29:00 EST

Ben Nadel demonstrates how to create a custom (directclick) DOM event plug-in in Angular 4.4.6, which will invoke its handler if and only if the target of the click event is the element on which the (directclick) event-handler was bound....



What The Flexbox: A Free Video Course On The CSS Flexible Box Model By Wes Bos

Tue, 31 Oct 2017 08:22:00 EST

Ben Nadel reviews "What The Flexbox," a FREE video course about the flexible box model in CSS by Wes Bos. This course covers the technical properties of flexbox-based layouts; and then, walks you through several informative real-world scenarios....



Adding .delay(10) To ActivatedRoute Helps Prevent Unwanted Router Behaviors In Angular 4.4.6

Mon, 30 Oct 2017 08:57:00 EST

Ben Nadel demonstrates some "unwanted" behaviors in the Angular 4.4.6 router; and, how adding .delay(10) to the ActivatedRoute stream can mitigate these behaviors....



View Components May Get Unnecessarily Reinstantiated Under Certain Circumstances In Angular 4.4.6

Fri, 27 Oct 2017 17:27:00 EST

Ben Nadel demonstrates an apparent race-condition in Angular 4.4.6 that causes View components to be destroyed and then unnecessarily re-created if a navigation event takes place too quickly; and, only under circumstances....



CSS @keyframes Animations Are Not Scoped With Emulated View Encapsulation In Angular 4.4.6

Wed, 25 Oct 2017 07:33:00 EST

Ben Nadel demonstrates that the emulated view encapsulation in Angular 4.4.6 does not apply to @keyframes animations. This allows @keyframes animations defined in one component to override the @keyframes animations defined in another component....



The New CSS Layout By Rachel Andrew

Sun, 22 Oct 2017 08:31:00 EST

Ben Nadel reviews The New CSS Layout by Rachel Andrew. This book offers a technical introduction to the Flexbox and Grid specifications (among others), demonstrating how these new layout techniques offer powerful solutions for robust and responsive page structure. Definitely a must-read for anyone whose CSS mental model is getting old....



MySQL's Slow Query Log "start_time" Column Is Actually The "end" Time Of The Query

Sat, 21 Oct 2017 11:00:00 EST

Ben Nadel examines the "start_time" column in MySQL's slow query log and concludes that it is, in fact, the "end" time or the "log" time of the query. With this insight, debugging slow queries can be made much more intuitive with a little date-math....



MySQL Multi-Range Read (MRR) Optimization Caused A Partial Database Outage

Sat, 21 Oct 2017 06:20:00 EST

Ben Nadel discusses MySQL's MRR - Multi-Range Read - optimization and how it inadvertently caused a partial database outage by pulling millions of unnecessary records into memory....



ngOnInit() May Not Get Called Before ngOnDestroy() Is Called In Angular 4.4.6

Fri, 20 Oct 2017 08:21:00 EST

Ben Nadel demonstrates that the ngOnInit() and ngOnDestroy() life-cycle methods in Angular 4.4.6 are not invoked symmetrically. Which is to say, sometimes only the ngOnDestroy() life-method method is called....



RabbitMQ: Patterns For Applications By Derick Bailey

Wed, 18 Oct 2017 07:53:00 EST

Ben Nadel reviews RabbitMQ: Patterns For Applications by Derick Bailey. It's a quick read that discusses the different types and composition of messages that can be used in a distributed system; and, what kinds of exchanges should be used for the different message requirements....



Using The LESS CSS fade Method To Apply Opacity To A HEX Color

Mon, 16 Oct 2017 08:52:00 EST

Ben Nadel shares a quick LESS CSS tip that he learned from Wes Bos - you can use the fade() method to apply an opacity to a HEX value....



Patterns Of Enterprise Application Architecture By Martin Fowler

Sat, 14 Oct 2017 10:30:00 EST

Ben Nadel reviews Patterns of Enterprise Application Architecture by Martin Fowler. At 15-years old, the book feels just as relevant today as it did when it was released. And, while a good portion of the book went over Ben's head, much of it was thought-provoking and reassuring....



Applying CSS Styles To Routable Child Views Using Simulated Encapsulation In Angular 4.4.4

Thu, 12 Oct 2017 07:41:00 EST

Ben Nadel demonstrates how to apply CSS styles to routable view components when using simulated encapsulation in Angular 4.4.4....



Closing Secondary Router-Outlet Views From Within The Named-Route View Components In Angular 4.4.4

Tue, 10 Oct 2017 07:22:00 EST

Ben Nadel demonstrates how to create a secondary-route component that is capable of closing itself in Angular 4.4.4. It doesn't seem to be possible with the routerOutlet directive; only with the .navigate() service method....



Routable View Components Don't Need Selectors In Angular 4.4.4 - But They May Be Helpful

Sun, 8 Oct 2017 08:17:00 EST

Ben Nadel demonstrates that routable View components don't need to have Selectors in Angular 4.4.4. But, they are available; and, they me be helpful for debugging and styling purposes. It's good to know that the option exists should you want to leverage it....



I Heart Logs: Event Data, Stream Processing, And Data Integration By Jay Kreps

Sat, 7 Oct 2017 16:51:00 EST

Ben Nadel reviews I Heart Logs: Event Data, Stream Processing, And Data Integration By Jay Kreps. This book describes a fascinating architectural pattern in which a commit log acts as the centralized source of truth for your organization....



Local Redirects Automatically Append The Non-Local Route Segments In Angular 4.4.4

Sat, 7 Oct 2017 08:44:00 EST

Ben Nadel demonstrates that a local redirect in the Angular 4.4.4 router will automatically append any non-local URL segments to the redirectTo action. This makes it incredibly easy to map one subset of URLs on to another subset based solely on the URL prefix....



A Single Route Parameter Can Match Multiple URL Segments In Angular 4.4.4

Fri, 6 Oct 2017 09:57:00 EST

Ben Nadel demonstrates that route parameters can match multiple URL segments in Angular 4.4.4. This allows us to capture entire URL suffixes and append them as part of prefix-based redirect operations....



Named-Outlets Require Non-Empty Parent Route-Segment Paths In Angular 4.4.4

Thu, 5 Oct 2017 09:26:00 EST

Ben Nadel demonstrates that secondary, named route outlets must have non-empty parent route segments paths in Angular 4.4.4. If the parent segment is empty, Angular cannot resolve the secondary route....



My Manager Once Wagered $1,000 That My Code Would Break Production

Wed, 4 Oct 2017 08:42:00 EST

Ben Nadel considers the book, Leaders Eat Last, and reflects upon the time his manager wagered $1,000 that his [Ben's] code would break production....