Angular change detection

Change detection is responsible to update the view (DOM) data when state data has changed. By default, when a state value in component is changed, Angular updates all child component to sync the value between view and component for all time. We can take some strategy to avoid the unnecessary component update that will improve the Angular application performance. Most of the time (around 80–90% of projects), you don’t need to work with change detection, but if you work with large Angular application or handle with large data that’s time some change detection strategy make the application robust and fast…


In this article, we will see how to deploy a Angular application from GitHub to EC2 instance with Apache (httpd) web server. This process will be done fully automatic using AWS CodePipeline (CodeBuild, CodeDeploy). So we follow the CI/CD process to deploy Angular code in server. CI/CD practices are currently the most widely accepted choice to shorten software development and delivery cycle time.

Create angular app

Here, a hello world Angular app created using angular CLI. This is pushed in master branch of GitHub repo “ng-app-deploy-to-ec2-using-pipeline”. We can clone the repo from the link. Here, also added two important files buildspec.yml and appspec.yml…


Observable and Promise

When I started to work with the Angular 4 in 2017, I was little bit confused and faced difficulties to understand the concept of promise and observable and asynchronous behavior. Then I started to study about asynchronous behaviors and RxJS. Today I will share my experience about my asynchronous leaning and RxJS. Now a days, Angular is one of the powerful and popular front-end framework. One of the behind reasons of being a powerful framework is the use of RxJS. Angular uses RxJS Observable instead of promises for dealing with HTTP.

RxJS

RxJS (Reactive Extensions for JavaScript) is a library for…


Introduction:

In this article, we will create angular application that support internationalization (i18n) for three language English, Finnish and Bangla. I have seen angular translation documents that seem difficult and complex. This language translation is implemented using Angular Pipe. Translation using Pipe is very easy and understandable.

You can get the source code of GitHub from here. Please follow the installation instructions in readme file to run the application.

.component.html code

In html code, we can add i18n pipe after string like`{{ ‘Choose language’| i18n }}` that will translate to our expected language. here is the html code

.pipe.ts code


We’ll be start to build a CRUD (Create, Read, Update, Delete) App using RESTful API with Deno, Oak and MongoDB. Here we’ll use deno_mongo for interacting with the MongoDB instance and for frontend purpose use Angular 9.

Required applications:

Deno: Deno is a simple, modern and secure runtime for JavaScript and TypeScript that uses V8 and is built in Rust. For installation you can visit the official deno website.

Oak: One of the most popular middleware framework for Deno’s http server, including a router middleware. This middleware framework is inspired by Koa and middleware router inspired by @koa/router.

MongoDB: Please install MongoDB


Deno

Deno is secure runtime for JavaScript and TypeScript. It run on V8 engine, the Google runtime engine for JavaScript, and written on Rust language. It is created by Ryan Dahl who also creator of Node.js. First, he talked abut Deno in 2018 in “10 Things I Regret About Node.js”.

The main features:

  • Secured by default
  • Support typescript out of the box
  • Deno scripts can be bundled into a single JavaScript file.
  • Distributed Package Management
  • No more package.json or node_modules
  • It overcomes some shortcomings of Node

Installing Deno

There are different ways to install Deno: Using curl, iwr, Homebrew, Chocolate. Please see the official website here

Tushar Ghosh

MEAN | JavaScript | Node.js | React| Angular | Frontend

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store