All Posts tagged as "Angular"

Angular - Set page title automatically!

Using a few lines of code could make the application feel much better!

Angular Singapore

Follow @angularsg for the upcoming events :)

A simple Spotify client built with Angular 11, Nx workspace, ngrx, TailwindCSS and ng-zorro

An example of real-world monorepo codebase using Nx Workspace

Nx Workspace structure for an application with NestJS and Angular

This structure has been serving us really really well by enforcing consistency, promoting SCAM, prevent circular dependencies, and minimize mental overhead of "where to put what"

Convert Promise to Observable

You'll need those tips one day if you get used to RxJS 🤣

Migrate Angular to ESLint

I'll show you how to migrate from TSLint to ESLint and using husky to run lint every time you try to make a commit

Capture picture from your Webcam in Angular

A simple walk through how to use the browser MediaDevices for capturing picture from a webcam in Angular

Observable for Angular Output

Do you know you can use Observable for Angular Output?

Build an Angular component to display snow ❄️ effect

The holiday session is coming. Let add a simple snow effect to your Angular application ❄️❄️❄️

Disable a reactive form control using custom directive

We will write a custom directive to disable a reactive form control by passing a boolean flag on the template

Angular Jira Clone Part 08 - Create placeholder loading (like Facebook's cards loading)

My eight tutorial is to explain how to build a placeholder loading component

Angular Jira Clone Part 07 - Build a rich text editor

My seventh tutorial will focus on another kind of text editor - a rich text HTML editor

Angular Jira Clone Part 06 - Build a markdown text editor

My sixth tutorial will focus on another interesting feature - a markdown text editor

Angular Jira Clone Part 05 - Build an interactive drag and drop board

My fifth tutorial will focus on one of the most interesting feature - drag and drop board

Angular Jira Clone Part 04 - Build an editable textbox

My fourth tutorial will focus on the first custom UI element - editable textbox

Angular Jira Clone Part 03 - Setup Akita state management

My third tutorial will go further into the application state management with Akita

Angular Jira Clone Part 02 - Build the application layout with flex and TailwindCSS

My second tutorial will walk you through how to build the application layout that has navigation, sidebar and content section

Super Expressive - Easy Peasy Regex Generating

Struggling to write regex from scratch, checkout super-expressive, and a playground written by my friend @nartc

A childhood memory Tetris game built with Angular 10 and Akita

I made a retro Tetris game with Angular. The first game that I have ever built :)

Angular Jira Clone Part 01 - Create a new repository and set up a new Angular application with CLI

I spent my spare time to build a cloned Jira app with Angular 9, Akita and ng-zorro in about two weeks, including the weekend

Angular Jira Clone Part 00 - Prerequisites

You should know some basic Angular, TypeScript and git knowledge before starting

I built a Jira clone application with Angular 9, Akita and ng-zorro

I spent my spare time to build a cloned Jira app with Angular 9, Akita and ng-zorro in about two weeks time, including the weekend.

How to configure TailwindCSS with Angular and why you should use it

This post gives you a glance at TailwindCSS and how to use it with Angular. If you're reading this and you don't know what TailwindCSS is, where have you been?

Angular - Using Visitor design pattern with Typescript

If you have multiple concrete classes that inherit from the same base class, or implement the same interface. You should consider using visitor pattern. It will save you from dozens of if-else block or switch/case and typecasting

Understand and prevent the most common memory leaks in Angular application - Subscription unsubscribe

Remember to clean up your Rx subscriptions. In my experience, this is by far the most common cause of memory leaks in Angular applications

The different between [value] and [ngValue] when passing to select option

The different when using value and ngValue on Angular form

Why I don't like ngrx and what are the alternative options?

I like the Redux concept. But not NgRx :)

JavaScript: Understanding the Weird Parts Notes

Below notes were taken from an Udemy course JavaScript: Understanding the Weird Parts

Angular CDK Drag/Drop List inside a table (not Material Table) - Handle rows distorting width

Angular async validator to validate an input field with a backend API

Write a custom async validator to validate an input field with a backend API in Angular reactive form

Angular - Correct singular/plural form of a noun using custom pipe or NgPlural

Pluralization is a problem in its sphere. We need to always correctly define grammar in our apps based on the singular/plural value

How to export a table or an array in Angular to Excel file (xlsx)

Export data to Excel is very useful on the data list for nearly every web application. The export feature helps to download the data list in a table as a file format for offline use

Angular formArray/formGroup - Validate at least one checkbox was selected

I prefer to use FormGroup to populate the list of checkbox. For checking at least one checkbox was selected, write a custom validator.

Angular [(ngModel)] and debounce

In the use case of search, we don't want to hit the server endpoint every time user presses a key, it should flood them with a storm of HTTP requests. Basically, we only want to hit it once the user has stopped typing after sometimes (for instance 300ms) instead of with every keystroke.

Angular render recursive view using *ngFor and ng-template

How to use ng-template to render view recursive in Angular

Angular Tips: Avoiding unnecessary RxJS in vendor.ts

Analyze webpack bundle with source-map-explorer. Optimize moment.js

I found that source-map-explorer tool shows an easy-to-understand-and-explore visualization to help you debug where all the code is coming from.

Integrate Angular 2+ and Webpack in an ASP.NET MVC 5 application

I will summarize the steps needed to integrate Angular 2 and Webpack build process in an MVC 5 application