In this post we will try together to build a form consisted of different components and we will try various implementations to achieve the best architecture. The final pattern that we will implement is the smart dumb.

We will try 4 different approaches and soon I will create a 5th one which will use the exportAs. 
The post is quite long but it worth's diving in :)

Our form will have:

1. Wrapper component (smart)
2. Basic info component (dumb)
3. Address component (dumb)
4. Credit Cards component (dumb)

The protractor.conf.js file is meant to offer a configuration for our e2e tests. The default which come with each new angular-cli app is very good and works really well. We shouldn't extend it unless we expect more.

Although it works well on localhost, what about the CI server?

On this post I wont explain what kind of configuration you might need for your CI, but how to separate the configuration and how to use it

As web developers we have been developing web forms almost on every app. How many times have you spent time searching on google (or bing - no offense ) on finding solutions to pre-select an option on a select control while using angular? Yeah I know! Many times. And when you read the solution you are like "Ohh yess!"
Let's demystify this

In the release of ES6 (ECMAScript 2015) a new way of declaring variables in JavaScript has been introduced. Actually 2 new ways. let and const. With these two, we now have 3 different ways to declare variables. var, let, const

What are the differences? The main difference is the scoping 

• let
  Block scope
  
  
• const
  Block scope
  
  
• var
  Function scope

In nutshell, block scope is the code that is enclosed in curly braces

Node.js is single threaded and by default utilizes only one core of the CPU no matter how many cores the CPU has. Of course there are solutions of how to use all the cores but it's not part of this post. Just for the record, there are packages that does this job efficiently. Have a look at this link pm2.keymetrics.io/  

Well, what am I trying to solve here? Imagine that you have 2 different endpoints on your application, and one of them needs a lot of processing time. What the problem would be?

The javascript engineers have been troubled often with the callbacks and the callback hell. The rescue are the promises: an easy and convenient way to handle the asynchronous calls.

A promise is an alternative way which allows us to handle asynchronous operations in a more elegant way than callbacks

Let's assume a simple story which will help us understand this. (well OK, I know that its not the best example you've ever read)

A father asks his son to go and buy a newspaper. The father is awaiting for the newspaper and will start reading it when his son returns back. On the other hand, the father knows that his son, who loves playing out in the yard, has some possibilities to fall down and start crying. In this case he won't read his newspaper and he will have to care of his son.

There are two cases in the story; the father will read the newspaper. The father won't read the newspaper.

• What happens on a single part of JS code?
  
• Is the code interpreted or compiled?
• What is the variable shadowing?
• What is the variable hoisting?
• What are the closures

In the following slide presentation I will try to answer the aforementioned questions by showing what the JS engine does on a simple part of code
​
Javascript compilation - execution

* In the company that I work for, we have a ceremony, called DOJO, in which any employer can present his/her ideas about any subject he/she wants to share (though we are trying to be focused on technological stuff). As such, this slide presentation was one of our DOJOs

Recently I met the "pair programming" term, which refers to two developers working together in the same task. 
There are plenty ways for this to happen. The most common though is that a developer writes code, whereas  the other shares ideas.  

I have discussed with many developers that tend to be a sort of full stack developers and if you ask them about their position they reply that they are back-end developers. It seems that it exists an inexplicable reason of making the developers believe that back-end is 'harder' than the 'front-end' and of course the harder way, the better developer. (I am not fond of this idea).
Do what ever you want but be GOOD at it!

I found it interesting to start writing this article by explaining the wrong way of designing an angular application.
The so common way to design an application is to group your modules (controllers, routes, services, factories, directives etc). The controllers to be in a controllers.js file, the services to be in a services.js file and so on. None can say that this is a bad design, but you will notice in the near future that this is not a so maintainable design because it's hard to find and amend a route that is inside the routes.js file and this file has more than 100 routes.