How to screen Angular developer skills

JavaScript frameworks are developing at a rapid pace, translating to frequently updated versions of some of the most popular choices including Angular, React, and Vue.js. In this post, we will focus on Angular developer skills, what Angular is, and how to screen a developer for Angular skills.

The very first version of Angular was introduced in 2009 and is the result of innovative work by Google engineers, Misko Hevery and Adam Abrons. Angular is an open-source framework with highly advanced JavaScript support and  is a part of the JavaScript ecosystem. Overall, it has received warm commendation from the development community.

Angular’s solid code base and the fact it is developed, maintained, and supported by Google are the main reasons why Angular is relied upon by developers for building highly interactive web applications. In the 2020 StackOverflow Developer Survey, Angular was ranked as the third most used web framework technology. Since the beginning of 2019, the Angular developer community has grown 50 percent compared to 2018, as stated in NG-Conf 2019.

Looking at its high marketability pace in this era of technological advancement, Angular is being increasingly used for enterprise-scale applications. Let’s discover more about Angular.

1. What is Angular?

The first thing to note is that Angular (without “JS” in the name) had a predecessor, named AngularJS. The names are almost the same, but technically they’re different tools. After being released in 2009, it was replaced by the “new Angular”, commonly known as Angular 2+, or just Angular in 2016. So strictly speaking, it’s been in use since 2016. Now that we have that out of the way…

Angular is a web development platform built-in TypeScript that provides developers with robust tools for creating the client-side (front-end) of web, desktop, and mobile applications.

In 2010, Angular’s primary advantage was that it let you turn HTML-based documents into dynamic content. Before AngularJS, HTML was much less convenient to modify, meaning that users couldn’t actively interact with interfaces on HTML pages as easy or quick as they can today.

There were some ways to build dynamic, single-page applications (SPAs) but they were too complex for convenient programming. Angular architecture reduced development effort aimed at creating dynamic content and the users benefitted from web pages with dynamic forms and elements.

The new Angular, compared to Angular JS, provides the same benefits as its parent (dynamic pages, etc) but with modern tooling, better performance; at a larger scale. Contemporary features from 2016 to present-day are designed to be much more user-friendly than those in 2010.

1.1. What is Angular used for and what problems does it solve?

The primary function of Angular is to build complex web applications. It can also be used for building universal apps (i.e, one codebase to be deployed on both web and mobile platforms, similar to React Native).

Being a web framework means Angular instinctively helps speed up the process of building web applications by allowing the developer to write much less code. Angular also uses HTML to define the UI of the application. HTML, compared to Javascript, is a declarative and intuitive language; and much less complicated. Incorporating experienced angular developers into your team can significantly enhance the efficiency and quality of web application development. It also means a developer doesn’t need to invest time in program flows and solving problems like “in what order must the scripts be loaded”. Essentially, you can define what you require and Angular will take care of it.

The use of TypeScript for increasing the maintainability of code and the performance score that improves as you make more complex applications are two great USPs for Angular. Additionally, the specific ecosystem choices can allow Angular to become the main instrument for long-term and heavy-investment projects where a steep learning curve is compensated for by stability and ongoing tech support.

1.2. Is it similar to any other languages or frameworks?

On the UI, it’s similar to what used to be called the “presentation layer” in templating languages such as JSP (Java Server Pages), JSF (Java Server Faces), or ASP (ASP.net). On the logic layer, it’s similar to enterprise technologies such as Java/.net.

React is another web framework that Angular is often compared to. Similar to Angular, React is used in the development of single-page as well as mobile applications. It differs, however, where React is much smaller in size and usually requires additional libraries while developing complex React Applications.

Vue is another framework that is often compared to the aforementioned two. Vue works in the View layer of an application while possessing a virtual DOM feature and supporting additional libraries, similar to React. Vue also has a template style similar to Angular, but performance-wise it is much more lightweight; meaning, it is more useful for building user interfaces and solving complex problems. This is opposed to Angular’s penchant for developing enterprise-scale applications.

1.3. What are its main advantages or features?

Angular comes out of the box with lots of tools used for the most common programming tasks. These include: structuring the UI with components, communication with back-end structure via HTTP, handling forms (Angular supports two approaches: template-driven forms and reactive forms), and handling application logic in services. And, of course, automated unit and e2e testing.

What is special about Angular is its design is aimed at large-scale applications. Angular has an advanced modularity system, combined with Dependency Injection, which makes it highly configurable for complex applications to keep the modular (but clearly increases the difficulty).

2. What is important for an IT Recruiter to know about Angular?

Angular uses many concepts borrowed from technologies such as Java/.net, so for experienced back-end developers, Angular will seem familiar and won’t pose too much of a challenge.  Similarly, for projects requiring robust back-end support, it’s often beneficial to hire node js developers, who can ensure efficient server-side solutions.

However, there are some concepts that will require training for front-end developers who don’t have a great back-end knowledge. Examples of these concepts include dependency injection, service-oriented architecture, static typing, general OOP (Object-Oriented Programming) principles, and so on.

Nevertheless, Angular is a framework with lots of built-in features. And learning those features can take significant amounts of time and effort. This means that even experienced Angular developers will not know absolutely everything about the framework from back to front, do mind the pun.

2.1. How often does the tech stack change?

Officially, the Angular team is supposed to release a new major version every six months.

A new major version means that it may contain breaking changes, so the code which used to work on the previous versions could stop working. Because there might be breaking changes in the new major versions, these sweeping changes don’t occur very often.

A major reason might be the inconvenience developers would face by putting lots of effort into upgrading the framework only. So instead of a revolution each half-year, we rather see evolutionary growth.

An excerpt from the Angular website states:

In general, you can expect the following release cycle:

• A major release every 6 months
• 1-3 minor releases for each major release
• A patch release and pre-release (next or rc) build almost every week

2.2. Are there many resources/tools/technologies available?

As one of the most popular web frameworks, there are lots of open-source libraries available for Angular. Needless to say, there are a plethora of resources including books, tutorials, conferences, and blogs that are easily accessible.

Many popular component libraries are in existence, such as Angular Material (Google Material Design implementation for Angular) or ng-bootstrap (Twitter bootstrap implementation for Angular). As well as this, there are several popular state management libraries available, including NGRX, NGXS, Akita, not to mention various techniques within the pure RxJS library. In essence, there is no shortage of free and paid content available online for Angular.

2.3. What tools and techniques should an Angular developer be familiar with?

Angular developers should be expected to be familiar as possible with the framework itself.

It’s quite important for developers to have knowledge of architecture and design patterns since Angular is used to create usually large-scale projects.

Design patterns assist in keeping the sizable codebase and complexities in order and makes it easier to add new functionalities. Without design patterns, code is much more chaotic and difficult to maintain. Their functionality is not specific to Angular, rather, they are a general Computer Science topic – but their existence is especially important to Angular.

They should be also familiar with fundamental Angular dependencies:

• TypeScript – is the primary language for Angular application development. It is a superset of JavaScript with design-time support for type safety and tooling. Browsers can’t execute TypeScript directly, as Typescript must be “transpiled” into JavaScript using the tsc compiler, which requires configuration.
• JavaScript (the browser programming language itself) – since this is the environment in which Angular apps will be run in, especially, Asynchronous JavaScript.
• RxJS – a programming library providing reactive streams that are ubiquitous in Angular

2.4. What type of experience is important to look for in an Angular developer (commercial, open-source, scientific, academic)?

Scientific and academic experience is almost irrelevant. Commercial experience with building web applications usually indicates proficient Angular developer skill set, so is the most important factor.

Experience with using open-source JavaScript/TypeScript/Angular libraries is also necessary.

3. How to verify Angular developer skills in the screening phase?

One important thing to note is that you should never expect a developer to be strong at every feature of programming. It’s doubtful that; for instance, someone very experienced with CSS, HTML, and styling would also be an expert in architecture and design patterns. So try to find the Angular developer skills you need for your project and focus on those.

3.1. What to take into account when screening a CV?

Clearly, Angular skills and other web frameworks skills is a must for any CV in the role. However, other things to consider related to Angular developer skills include:

• Proficiency in JavaScript
• Browser (runtime environment) and DOM (Document-Object Model) experience
• A good Knowledge of HTTP as nearly all applications need to load external data for the client (Angular) app to process, display, and hand over to users, etc.
• The ability to work with CSS as applications need to have a nice layout afterall
• Architecture and design pattern experience to be able to handle complex business requirements with maintainable code

It’s crucial for an Angular developer to have vast experience with browsers, DOM, HTTP, and CSS. This is because: if something is impossible within the runtime environment, it’s also not in Angular. Intrinsically, a framework cannot go beyond its runtime environment.

Architecture and design patterns are equally as important because as mentioned above, Angular apps are rather big and complex. Big apps with poor design lead to high costs for application maintenance and adding to features, and that is certainly not ideal.

3.2. What glossary terms are important to know in Angular (including frameworks, libraries, and language versions)?

Aspects within Angular

Architecture	Modules Dependency Injection Components Performance techniques
State management	HTTP Services Stateful Services NGRX or NGXS or Akita etc.
Forms	Template-driven forms Reactive Forms
Templates	Components Pipes 3rd party libraries with built-in components, such as Angular Material, ng-bootstrap, etc.

Aspects related to Angular

• TypeScript – the language in which Angular apps are written. While JavaScript is the mother of Web programming and used in most websites, TypeScript is a modern and object-oriented programming language that provides a better structure to manage large Web projects. TypeScript is being adopted by several large open-source projects and libraries including Angular. The main differences between JavaScript and TypeScript are:
  • TypeScript has a feature that is strongly-typed or supports static typing. That means Static typing allows for checking type correctness at compile time. This is not available in JavaScript.
  • TypeScript points out the compilation errors at the compile-time (which takes place during development). JavaScript, being an interpretive language, has no compilation errors. All errors are thrown into runtime so potentially more errors can leak into the app and cause problems for the end-user.
  • RxJS – reactive streams are used to support HTTP requests, WebSocket requests, Reactive Forms, Routing, Application State, and more.
  • Webpack – also called a bundler, it’s a tool that combines lots of loose files (tens, hundreds, or even thousands of them) and merges them into one logical file which is then executed. It comes with multiple benefits, with the most important being better performance and improved developer tooling.

3.3. Which versions are completely different? Which versions are similar to each other?

As touched on previously, each new major version of Angular can be interpreted as an evolutionary change. The 2016 update from AngularJS to the current Angular was more of a revolution with the fundamental changes that were made.

One of the most important changes was in Angular 9, which introduced the new compiler called Ivy.

Each version gets a new major number. So far we’ve had:

• Angular 2
  (There was no Angular 3, as internal Angular packages were out of sync with each other and then unified. Since then packages are backward compatible.)
• Angular 4
• Angular 5
• Angular 6
• Angular 7
• Angular 8
• Angular 9
• Angular 10

Releases can be seen in the changelog: https://github.com/angular/angular/blob/master/CHANGELOG.md

3.4. What other lines on a resume can show Angular developer skills?

Experience with other JS frameworks (or mobile apps) would be very beneficial. These include:

• AngularJS, Ember, React, Vue, and many others

A developer familiar with Vue or AngularJS would no doubt have to spend a bit of time learning Angular. However, the developer should already understand what are the typical tasks, what potential issues need to be solved, and what are the limitations of web apps. These would just need to be addressed in a different toolset (but the topics/issues/tasks are logically almost the same).

Experience with automated unit testing (tools such as Karma, Jasmine, Jest, Mocha, Ava, etc.) and/or e2e testing (Selenium, Protractor, Puppeteer) would also be beneficial if the developer’s role includes writing or maintaining tests.

4. Technical screening of Angular developer skills during a phone/video technical interview

Whether you’re an IT recruiter, a project manager, or a CTO, you are well aware that the success of your project rests on your ability to find top developers.

Below you‘ll find some example interview questions you can refer to when seeking a new Angular developer to build your web applications.

4.1. Questions that you should ask about an Angular developer’s experience. Why should you ask each of those questions?

• In previous projects, what did your everyday tasks consist of?
  • The answer to this question should tell you whether the candidate is more interested in the UI part (HTML, CSS, visual effects, fonts, etc.) or the logic behind the application (state management, services, modules). In general, it’s better to have developers of various specializations together in one team rather than have all CSS experts and no architecture design experts.
• In previous projects, have you been maintaining or creating a component library (set of components reused by multiple apps or multiple projects)?
  • This question asks about an advanced use case behind Angular components. If a candidate has been working on such a project, there is a high probability that they would spot more technical nuances (which is a plus) than developers who didn’t. Component libraries are difficult to create because they need to support multiple functionalities for various components.
• Have you been using external third party libraries for styles?
  • Many projects and businesses decide not to create their own design language (the look and feel behind a trademark or business). Instead, they choose to implement an existing language such as Angular Material and ng-bootstrap. These tools provide lots of useful functionalities, but learning them takes time. If you know your team is using a third-party library for styles, definitely ask the candidate about it. This might significantly affect the decision of whether to hire someone.
• Have you been automatically testing the applications you’ve written?
  • If your team maintains automatic tests such as unit, functional, and e2e, a candidate with experience in testing would be much more attractive than ones who don’t. Beware of candidates who have “never automatically tested their software”, or don’t believe that it makes sense or that it pays off.
• Have you been creating real-time applications?
  • The majority of applications load data from the server and display it to the user, such as your bank account balance. The value doesn’t change very often, so there’s no need to reload it every second. But some applications (e.g. taxi companies, or financial institutions) need to update their data every second, or even more frequently. If your application is a realtime app, then your Angular components need to reset the data way more often or use WebSockets over HTTP.

4.2. Questions that you should ask about an Angular developer’s knowledge and opinions. Why should you ask each of those questions?

• Explain how an async pipe works in Angular.
  • This question verifies if a developer understands one of the fundamental tools widely used within Angular apps. See the detailed explanation below.
• Let’s assume we have a component that stores an HTTP request in a stream, and this stream is bound to the template using three different async pipes. How many physical HTTP requests does this component make?
  • This question is super important as being unaware of how async pipes work often leads to creating apps that make too many requests, therefore slowing down both front-end and back-end layers.
    The quick answer is: if there are no subjects and no share operators, then the component makes three requests (which is not right). If there is a subject/share operator used properly, there should be only one request supplying all the async pipes.
• What rules and principles do you follow when writing unit tests?
  • This question checks the knowledge and experience of testing in Angular and in general. When building big apps in Angular it’s especially important to trust the quality of your app – and it’s nearly impossible without automatic tests (as manual testing is extremely expensive).
    General principles for testing are:
    – Tests should run independently and should not rely on their order
    – Skipping a single test should not make any other test fail, and vice versa
    – Tests should check only a single behavior/attribute.
    – A given functionality should be tested once. Because if the functionality is broken, it’s not logical to continue testing
    – Unit tests should mock their dependencies, e.g. HTTP calls. That’s because if a test was checking both components’ behavior and was failing because the server replies with an invalid HTTP response, it can’t be due to the component. Checking everything (including dependencies) should be done in so-called e2e tests

4.3. Behavioral questions that you should ask an Angular developer. Why should you ask each of those questions?

• You’re working on a project for some time and notice there is an ongoing issue – whenever a component changes, many tests fail and they have to get updated. What would you think about it and what would you do?
  • This question checks the both attitude of a developer, teamwork skills, and their tech experience of Angular apps. Criticizing an existing codebase is not constructive and immediately a deal-breaker. The preferred approach would be to analyze the reasons together, agree on them as a team, and create a measurable plan as to how the situation could be improved over time.
    Suggesting to abandon activities in order to refactor tests and implementation makes little sense from a business perspective, as in reality teams aren’t just able to stop delivering new features.
• A new Angular version was released last week. Would you intend to upgrade the application, if so – when?
  • Generally, the question is about keeping the balance between maintaining the high technical quality of the project and business goals. If the developer says they’d perform a quick check to see whether this task could be easily accomplished (the upgrade turns out to be simple to navigate, but first a check is necessary) – then it would be a great answer.
• You are about to start creating an Angular application, but you don’t know whether it’s going to be big or small. The business can’t tell if the app is going to grow. What tool would you use to provide state management?
  • This question verifies the mindset of a developer – whether they are likely to introduce needless additional tools (which increases the complexity and the cost to deliver features) or keeps things simple. A good answer is to keep data in Angular services if the application is small-scale. You can think about additional state management libraries (NGRX, NGXS, Akita, etc.) when the application gets bigger and more complex. The context for this question is developers tend to use libraries when they’re not necessary, just because they want to get to know them in order to write it down in their CVs. This is a popular issue in the front-end development community.

5. Technical screening of an Angular developer’s skills using an online coding test

Finding a high-quality developer that has the potential to work according to your concept is a tough nut to crack. It is a time-consuming, costly, and cumbersome endeavor. And with the mushrooming of online communities filled with thousands of remote developers, taking the right decision can be a bit overwhelming. Thankfully, there are some steps, checks, and procedures that can help you take the right decision.

5.1. Which online test for Angular developer skills should you choose?

When looking for the right Angular developer skills test you should make sure it matches the following criteria:

• The test reflects the quality of professional work being carried out
• The duration is not too long, one to two hours max
• The test can be sent automatically and is straight-forward in nature
• The difficulty level matches the candidate’s abilities
• The test goes beyond checking whether the solution works – it checks the quality of the code and how well it works in edge cases
• It’s as close to the natural programming environment as possible and allows the candidate to access relevant resources
• It provides the candidate the opportunity to use all the libraries, frameworks, and other tools they regularly come across

5.2. DevSkiller ready-to-use online Angular developer skills tests

DevSkiller coding tests use our RealLifeTesting™ methodology to mirror the actual coding environment that your candidate works in. Rather than using obscure algorithms, DevSkiller tests require candidates to build applications or features. They are graded completely automatically and can be taken anywhere in the world. At the same time, the candidate has access to all of the resources that they would normally use including libraries, frameworks, StackOverflow, and even Google.

Companies use DevSkiller to test candidates using their own codebase from anywhere in the world. To make it easy, DevSkiller also offers a number of pre-made Angular tests like the ones here: