Angular

Ionic 4 Swipe Navigation Between Pages

Imagine in your app there’s a page with a list of items, and clicking on an item navigates to and item details page. On the details page, you’d like to be able to swipe left to bring up the previous item, or right to bring up the next item. This post aims to provide an implementation for such functionality.

5 min read

Creating a Delayed Input Directive in Angular

Imagine in your app there’s a search input that triggers an http request on each keystroke as a user types in their query. As your userbase grows, search operations quickly become expensive due to the increased traffic to your server.

5 min read

How to get a Reference to the Window Object in an Angular 8 Application

There are many articles on the web showing various methods of getting a reference to the window object in Angular (primarily through the dependency injection mechanism). However those that are popular on Google search are from 2016, 2017, etc, and the methods are mostly overly complicated (understandably).

~1 min read

Why you should use trackBy with Angular’s *ngFor loop

trackBy is a function which will return a unique identifier for each item in the array provided to *ngFor.

Normally when the array changes, Angular re-renders the whole DOM tree. But if you use trackBy, Angular will know which element has changed and will only make DOM changes for that particular element.

2 min read
Back to Top ↑

Laravel

Laravel: Localized Carbon Date String Example

I wanted to return a translated date string from a Carbon date object and after some research, used the below solution which worked for me. It is quite brief, do leave a comment if you’ve got a question.

1 min read

Format Dates for Humans with Carbon in PHP

I’ve spent like the last 30 minutes searching the web for how to convert dates to human-readable strings with Carbon in PHP/Laravel. Here’s a compilation of a couple of useful Carbon methods for my future self.

~1 min read

Unit Testing Translation Strings in Laravel

If your Laravel app uses multiple locales, it can get tedious keeping track of translations that are yet to be added to the appropriate translation files, e.g English translations in resources/lang/en/validation.php and French translations in resources/lang/fr/validation.php.

1 min read
Back to Top ↑

PHP

Format Dates for Humans with Carbon in PHP

I’ve spent like the last 30 minutes searching the web for how to convert dates to human-readable strings with Carbon in PHP/Laravel. Here’s a compilation of a couple of useful Carbon methods for my future self.

~1 min read
Back to Top ↑

Ionic

Ionic 4 Swipe Navigation Between Pages

Imagine in your app there’s a page with a list of items, and clicking on an item navigates to and item details page. On the details page, you’d like to be able to swipe left to bring up the previous item, or right to bring up the next item. This post aims to provide an implementation for such functionality.

5 min read
Back to Top ↑

Javascript

Back to Top ↑

Jekyll

Back to Top ↑

Blogging

Back to Top ↑

Typescript

Back to Top ↑

*ngFor

Why you should use trackBy with Angular’s *ngFor loop

trackBy is a function which will return a unique identifier for each item in the array provided to *ngFor.

Normally when the array changes, Angular re-renders the whole DOM tree. But if you use trackBy, Angular will know which element has changed and will only make DOM changes for that particular element.

2 min read
Back to Top ↑

Angular CLI

Back to Top ↑

Mapbox

Back to Top ↑

Netlify

Netlify: Redirect Users by Country or Language

Today at Switchn we had the need to redirect users by country and browser language on our Netlify hosted site. That is, send those visiting our site from English speaking countries to /en/ and those from French speaking countries to /fr/. Also if the user’s browser sends an accept-language header in the request (e.g. accept-language: en-US,en;q=0.9), we’d like to take that into consideration too.

1 min read
Back to Top ↑

PWA

Back to Top ↑

RxJS

Back to Top ↑

ScullyIO

Back to Top ↑

Unit Testing

Unit Testing Translation Strings in Laravel

If your Laravel app uses multiple locales, it can get tedious keeping track of translations that are yet to be added to the appropriate translation files, e.g English translations in resources/lang/en/validation.php and French translations in resources/lang/fr/validation.php.

1 min read
Back to Top ↑

AGM

Back to Top ↑

API

Back to Top ↑

API Redirect

Back to Top ↑

Automation

Back to Top ↑

Bootstrap 4

Back to Top ↑

CAMTEL

Back to Top ↑

CSRF

Back to Top ↑

ControlValueAccessor

Back to Top ↑

Custom Form Control

Back to Top ↑

DTOs

Back to Top ↑

Databases

Back to Top ↑

Date and Time Formatting

Back to Top ↑

DateInterval

Back to Top ↑

Deep Cloning Objects

Back to Top ↑

Dependency Injection

Back to Top ↑

Directions Renderer

Back to Top ↑

Directions Service

Back to Top ↑

Directive

Back to Top ↑

Directives

Back to Top ↑

Exception Handling

Back to Top ↑

Exceptions

Back to Top ↑

Form Arrays

Back to Top ↑

Fragment Navigation

Back to Top ↑

Google Maps

Back to Top ↑

Google Places Autocomplete

Back to Top ↑

HttpErrorResponse

Back to Top ↑

Injection Token

Back to Top ↑

Javascript Date Object

Back to Top ↑

KaiOS

Back to Top ↑

Laravel Validation Errors

Back to Top ↑

MySQL

Storing timespans in a MySQL database

I’ve been working on coupon/promotion codes functionality and one requirement is only allowing the re-use of a coupon code after a period of time has passed. It could be a couple of hours, a couple of days, or a month at most.

1 min read
Back to Top ↑

NPM

Back to Top ↑

NbDialogService

Back to Top ↑

Nebular

Back to Top ↑

Nebular UI Kit

Back to Top ↑

Netlify CMS

Back to Top ↑

PDF Generation with Angular

Back to Top ↑

Password Reset

Back to Top ↑

Proxy Redirect

Back to Top ↑

Reactive Forms

Back to Top ↑

Renderer2

Back to Top ↑

RendererFactory2

Back to Top ↑

Retry Failed Requests

Back to Top ↑

Rouge

Back to Top ↑

Router Resolver

Back to Top ↑

RxJs

Back to Top ↑

SCSS

Back to Top ↑

Spread Operator

Back to Top ↑

State Management

Back to Top ↑

Strongly Typed Reactive Forms

Back to Top ↑

Testing

Back to Top ↑

Text Processing

Back to Top ↑

Url Protocol

Back to Top ↑

Waypoints

Back to Top ↑

Window Object

How to get a Reference to the Window Object in an Angular 8 Application

There are many articles on the web showing various methods of getting a reference to the window object in Angular (primarily through the dependency injection mechanism). However those that are popular on Google search are from 2016, 2017, etc, and the methods are mostly overly complicated (understandably).

~1 min read
Back to Top ↑

YAML

Back to Top ↑

agGrid

Back to Top ↑

agGrid Checkbox Selection

Back to Top ↑

distinctUntilChanged

Back to Top ↑

html time

Back to Top ↑

jsPDF

Back to Top ↑

nb-sidebar

Back to Top ↑

regex

Back to Top ↑

shareReplay

Back to Top ↑

trackBy

Why you should use trackBy with Angular’s *ngFor loop

trackBy is a function which will return a unique identifier for each item in the array provided to *ngFor.

Normally when the array changes, Angular re-renders the whole DOM tree. But if you use trackBy, Angular will know which element has changed and will only make DOM changes for that particular element.

2 min read
Back to Top ↑

try/catch

Back to Top ↑