Sass – Nested @font-face results in invalid syntax

Just wanted to share one issue which I have faced recently with my current angular-cli project. Basically, issue related to the @font-face CSS at-rule and it’s only occurs with Angular CLI prod build.

Migrating from Webpack custom build to Angular CLI

I would like to share my approach – how I migrate the older Angular (v5.x) Application with custom webpack build to Angular CLI.

In past, I was against using Angular CLI. I wanted full control over everything that happens to my application. So I carefully configure Webpack, setting the correct configuration options and choosing couple of cool plugins. I was using this custom webpack build configuration for around 2 year without any major issues. Since the application was large, I hesitate to touch this custom webpack build configuration.

Basics of Webpack – module bundler

Webpack is a module bundler. It takes you code transforms and bundles it, then returns a new compiled version. If you want to write ES6 Javascript code or React then I think Webpack is the better option.

webpack – Module Bundler

Yarn: A more powerful Javascript package manager than npm

Yarn – A new package manager for Javascript

Facebook has launched Yarn, an open source Javascript package manager that promises faster, reliable and an improvement over popular Javacript package manager – npm.

Now play Solitaire or Tic-Tac-Toe on Google

Looking to do some time pass with a round of solitaire on your phone? You no longer need a separate app for that – Google is rolling out a couple of simple games right into its search engine and standalone Google Search app. The most popular two classic games of all time – solitaire and tic-tac-toe – available both on the desktop web and in its search app.

For example, type in “solitaire” into the search box, and the game will pop up as a card in the search results. Tap it, and you’ll be taken to a full-screen version of the game, where you can select your difficulty level ahead of game play.

Solitaire

If you Google for “tic-tac-toe” or “tic tac toe”, you’ll also see a playable game in a card in the search results. You can adjust the settings here to Easy, Medium or Impossible. You can also play against another person and choose whether you’re “X’s” or “O’s”. Meanwhile, Google will keep track of your score across rounds.

Tic-Tac-Toe

The playing games is not the only fun you can have in Google Search. You can also settle a bet by typing “flip a coin“. Now to flip a coin you don’t need actual coin you can do it on Google as well 🙂 . Enjoy games on google…….!!!!!!

Possible bug in grid menu of ui-grid when enableFiltering: true

Today, I noticed that when I have a bunch of columns and I’m enabling filtering option of ui-grid (v3.0.7), the gridMenu itself scrolls to top while clicking on an individual option in the menu. Please find plunker below:

Plunker

Get filtered rows from Angular ui-grid with pagination

We have various aggregationTypes in ui-grid (3.2.6). I am using ‘sum’ aggregationType to display total to the column footer. But it seems that when I’m using filter and pagination together in ui-grid, my column sum is always calculate on only visible rows.

Implement “Joins” in MongoDB equivalent to SQL

Since I am coming from a SQL background so writing queries in SQL where I join tables is quite simple but I guess I am missing that in Mongoose / Mongodb. In earlier version of MongoDB we can’t perform “joins” equivalent to SQL.

As of MongoDB 3.2 above statement is no longer correct. The new $lookup operator added to the aggregation pipeline is essentially identical to a left outer join.

MongoDB Pagination using skip() and limit()

How to implement pagination with MongoDB??

Let’s for example I have collection named ‘persons’ and add some documents on it.

db.persons.insert({fname:'John', lname: 'Paton'});
db.persons.insert({fname:'Bob', lname: 'Warner'});
db.persons.insert({fname:'Pankaj', lname: 'Gupta'});
db.persons.insert({fname:'Atul', lname: 'Mishra'});

The traditional approach to pagination requires use of  skip() and limit() MongoDB cursor functions. Let’s have a look how we can use these cursor functions to achieve pagination.

db.persons.find().skip(ITEMS_PER_PAGE * (PAGE_NUMBER - 1)).limit(ITEMS_PER_PAGE);

“ITEMS_PER_PAGE” – Represents number of items per page.

“PAGE_NUMBER” – Represents current page number.

Use db.persons.count() to get the number of documents in the collection and implement the pagination navigation links.

This pagination technique works as you expect and is excellent in every way – as long as you have a small set of data. If you have a collection with hundreds of thousands of documents, this method of pagination will fail – it will become slower with every increasing page. That’s because the cursor has to start from the beginning of the collection to the skip position for every request, and with increasing page number the skip position becomes farther and farther.

 

AngularJS: Injecting service into a HTTP interceptor (Circular dependency)

Recently, I’m getting circular dependency error while I’m injecting my service to HTTP interceptor. Code works well if I’m remove my service dependency from HTTP interceptor.

Find my interceptor code below where I’m injecting my ‘waitingDialog‘ service which have ‘$uibModal’ (angular ui-modal) dependency.