hello.js

var please = require('share');
console.log('thank you');

Saturday, 27 May, 2017 UTC

Angular Router: Query Parameters

Angular Router: Query Parameters

Query parameters in Angular allow for passing optional parameters across any route in the application. Query params are different from regular route parameters, which are only available on one route and are not optional (e.g.: /product/:id ). Let’s see ... more


Friday, 26 May, 2017 UTC

Introduction to Snapshot Testing With Jest

Introduction to Snapshot Testing With Jest

One of Jest’s key features is snapshot testing; a very useful tool to write quick, accurate tests. Creating a Snapshot Let’s say you have a function that makes changes: // changeMaker.js export default function changeMaker(value) { let pennies = value ... more


Thursday, 25 May, 2017 UTC

Drag & Drop in Your Angular Apps With ng2-dragula

Drag & Drop in Your Angular Apps With ng2-dragula

Dragula is a popular JavaScript library for drag & drop, and ng2-dragula is a wrapper to use Dragula in Angular 2+ apps. Let’s see how it’s used. Installation First add ng2-dragula to your project using Yarn or npm: # Yarn $ yarn add ng2-dragula ... more


Wednesday, 24 May, 2017 UTC

Introduction to Testing With Jest

Introduction to Testing With Jest

Jest is a JavaScript testing framework requiring little to no configuration. Here’s a quick post to get you up and running with it. Setting Up Jest Are you using create-react-app? If so, Jest is already installed, so you can skip this part. Thanks, vertical ... more


Wednesday, 24 May, 2017 UTC

Control DOM Outside Your Vue.js App with portal-vue

Control DOM Outside Your Vue.js App with portal-vue

One of Vue.js’ greatest strengths is it’s ability to be used to enhance or replace parts of older apps or even static pages. This progressive nature allows Vue to be incrementally adopted or just used to improve a pre-existing app. portal-vue by Linus ... more


Wednesday, 24 May, 2017 UTC

Website Theming With CSS Custom Properties

Website Theming With CSS Custom Properties

You may have noticed that you can now toggle between dark and light themes on the site. This was done using CSS custom properties (aka CSS variables). In this post you’ll see how you can achieve something similar using only CSS and a touch of JavaScript. ... more


Monday, 22 May, 2017 UTC

Examining Content Placeholder Strategies with Vue.js

Examining Content Placeholder Strategies with Vue.js

A practice that has gained significant traction recently is displaying a UI full of placeholder styles that look like the fully-loaded page before the entirety of the content loads. This tactic, used by Slack , Medium , and Facebook , among others, helps ... more


Wednesday, 17 May, 2017 UTC

Use Web Workers with Ease in Vue.js with vue-worker

Use Web Workers with Ease in Vue.js with vue-worker

Like many developers, when Web Workers first emerged onto the web development scene, I was incredibly enthusiastic and dreampt of the various amazing things I could accomplish with them. However, my enthusiasm was quickly dampened when I realized that ... more


Wednesday, 17 May, 2017 UTC

Using the takeUntil RxJS Operator to Manage Subscriptions Declaratively

Using the takeUntil RxJS Operator to Manage Subscriptions Declaratively

Angular takes care of unsubscribing from many observable subscriptions like those returned from the Http service or when using the async pipe. Outside of that however, it can quickly become a mess to keep tabs on all subscriptions and make sure we unsubscribe ... more


Tuesday, 16 May, 2017 UTC

Introduction to the React Ref System

Introduction to the React Ref System

While React’s virtual DOM elegantly handles most situations you’ll run into, there are some cases where you’ll need to interact with the actual elements. For these occasions, React provides a ref system. Creating a Ref Creating a ref is pretty straightforward; ... more


Monday, 15 May, 2017 UTC

Handle the EU Cookie Law in Vue.js with vue-cookie-law

Handle the EU Cookie Law in Vue.js with vue-cookie-law

Developers in the EU are probably fairly familiar with the Cookie Law, the law requiring you to inform users if your website uses cookies and have them accept that or leave the site. Now, it’s just a tiny bit of extra effort to implement something like ... more


Friday, 12 May, 2017 UTC

Getting Started With ngrx for Redux-Style State Management in Angular

Getting Started With ngrx for Redux-Style State Management in Angular

The Redux pattern is a very powerful way to manage state in web apps, especially when the application gets more complicated. Redux the library is most often used with React, but thanks to the ngrx/store library, combined with the power of RxJS, we can ... more


Wednesday, 10 May, 2017 UTC

Using Bootstrap in Your Angular Apps with ng-bootstrap

Using Bootstrap in Your Angular Apps with ng-bootstrap

ng-bootstrap is a set of components and directives that wrap the latest version of Bootstrap ( v4.0.0 alpha 6 at the time of this writing). This makes it easy to use Bootstrap in your Angular apps. Angular 4+ is required to use ng-bootstrap. ng-bootstrap ... more


Tuesday, 9 May, 2017 UTC

A Gentle Introduction to Cycle.js

A Gentle Introduction to Cycle.js

Cycle.js is the most accessible FRP framework for JavaScript we’ve yet had the chance to be awed and confounded by. The upshot is it’s got plenty of training wheels to get you on your wobbly way. The down: it’s easier to implement than to comprehend, ... more


Tuesday, 9 May, 2017 UTC

Create a Reactive Data Pipeline with Vue.js

Create a Reactive Data Pipeline with Vue.js

Vue can do a lot of things. One of them, of course, is acting as the view layer for your apps. Actually, I think that’s the only intended purpose for Vue, but I know of a few others that are actually pretty neat. Today, we’ll eschew using Vue for the, ... more


Tuesday, 9 May, 2017 UTC

Class Component Overview in React

Class Component Overview in React

Class syntax is one of the most common ways to define a React component. While more verbose than the functional syntax, it offers more control in the form of lifecycle hooks. This guide assumes that Babel has been properly configured for React. If you ... more


Sunday, 7 May, 2017 UTC

How to Customize Vue Webpack Loaders

How to Customize Vue Webpack Loaders

One of the most unique features of Vue is the built-in support for other languages and pre-processors in .vue single-file-components. This allows you to use whatever pre-processor you’d like so long as it has an available webpack loader. Often the defaults ... more


Thursday, 4 May, 2017 UTC

Managing Subscriptions in Angular With the Async Pipe

Managing Subscriptions in Angular With the Async Pipe

The built-in async pipe in Angular 2+ gives us a great tool to easily manage observable subscriptions. With it, we can learn to avoid having to manually subscribe to observables in component classes for most cases. Let’s say we want to have an observable ... more


Wednesday, 3 May, 2017 UTC

Handle Touch Events in Vue.js With vue-touch

Handle Touch Events in Vue.js With vue-touch

It seems these days that more and more people are foregoing their tried-and-true big screens, keyboards and mice, for a tiny new-fangled slab of glass and metal that does nothing but frustrate those of us with large fingers. Because of this, unfortunately, ... more


Tuesday, 2 May, 2017 UTC

Understanding Change Detection Strategy in Angular

Understanding Change Detection Strategy in Angular

Angular performs change detection on all components (from top to bottom) every time something changes in your app from something like a user event or data received from a network request. Change detection is very performant, but as an app gets more complex ... more


Tuesday, 2 May, 2017 UTC

Angular Quick Tip: Binding Specific Keys to the Keyup and Keydown Events

Angular Quick Tip: Binding Specific Keys to the Keyup and Keydown Events

When binding to either the keyup or keydown events in your Angular 2+ templates, you can specify key names. This makes it very easy to trigger the event only when specific keys are pressed. First, let’s see an example without using a key name. Let’s ... more


Tuesday, 2 May, 2017 UTC

Upgrading to Vue.js 2.3

Upgrading to Vue.js 2.3

The brand-new Vue 2.3 release is all about server-side rendering. It’s no small update either. The entire SSR process has been significantly improved and revamped, extensive documentation has been added, and a few old patterns have been deprecated. (Though ... more


Sunday, 30 April, 2017 UTC

Angular Router: Navigation Using RouterLink, Navigate or NavigateByUrl

Angular Router: Navigation Using RouterLink, Navigate or NavigateByUrl

In our intro to the Angular router, we briefly saw how to navigate to a different route declaratively using the RouterLink directive. This post builds on that to demonstrate a few more examples, as well as how to navigate imperatively in the component ... more


Sunday, 30 April, 2017 UTC

Copying Text With vue-clipboard2

Copying Text With vue-clipboard2

Sometimes it’s really convenient to have a nice little “copy” button next to a tidbit of information in your web app. No big deal, just a little button right? Well, it turns out that’s a bit more difficult than one might expect. Copying text requires ... more


Friday, 28 April, 2017 UTC

Angular Router: Defining Child Routes

Angular Router: Defining Child Routes

It’s easy to create any kind of routing hierarchy in your Angular apps by using child routes in your router configurations. The following covers routing for Angular 2+ apps. All you need to define child routes is to add an array of additional route configuration ... more


Thursday, 27 April, 2017 UTC

Create a Terminal Program with Vue.js and blessed-vue

Create a Terminal Program with Vue.js and blessed-vue

Sure, web apps are all the rage these days, with their shiny and polished interfaces and megabytes of JS, but what if you just want to write a good ‘ol terminal program using some of the really nice libraries developed for the web? (Ahem, Vue ) I’ll ... more


Wednesday, 26 April, 2017 UTC

Vue.js Component Communication Patterns

Vue.js Component Communication Patterns

There are several methods that can be used for inter-component communication in Vue.js. Normal props and events should be sufficient for most cases, but there are other methods available at your disposal as well. Props & Events Of course, the normal ... more


Wednesday, 26 April, 2017 UTC

Preloading in Angular

Preloading in Angular

Preloading modules in Angular is very similar to lazy loading, with the exception that the modules will be loaded immediately after all the eager loaded modules are ready. This eliminates the possible latency when navigating to a lazy loaded module, ... more


Monday, 24 April, 2017 UTC

Lazy Loading in Angular

Lazy Loading in Angular

With lazy loaded modules in Angular, it’s easy to have features loaded only when the user navigates to their routes for the first time. This can be a huge help for your app’s performance and reducing the initial bundle size. Plus, it’s pretty straight-forward ... more


Sunday, 23 April, 2017 UTC

Draggable Components in Vue.js with Vue.Draggable

Draggable Components in Vue.js with Vue.Draggable

Sortable lists are on of the more frustrating parts of web development. The web wasn’t originally created with drag-and-drop in mind, and even with the addition of native drag-and-drop support in HTML5, there’s still quite a bit to hook up. With Vue.Draggable ... more