This post is for beginners who might be looking to get a junior Angular developer job and want to get prepared for interviews when they are called upon.
Let’s talk through some probable interview questions you might face when seeking a junior developer job using Angular.
One of the most popular questions you will probably hear is to explain lifecycle hooks.
In simple terms, a component’s instance lifecycle basically starts when Angular boots up the defined class and renders the component with all the children inside the DOM and continues with all the detected changes, view and component updates, and finally ends when Angular destroys the instance and removes the component from the DOM.
Hooks are basically functions you can use to tap into these various key events in the lifecycle of a component’s instance.
Angular has eight popular hooks you should know, and here is a table of what they are used for.
Hook | Purpose |
---|---|
ngAfterContentChecked | Called when the content is updated or checked for updates (after |
ngAfterContentInit | Called once when the content is initialized (after the first |
ngAfterViewChecked | Called after the component’s views and child views have been checked (after |
ngAfterViewInit | Called when the component’s views and child views have been initialized (after the first |
ngDoCheck | Custom change detection—detects and acts upon changes Angular wouldn’t detect on its own (after |
ngOnChanges | Called when data-bound input properties have changed (before |
ngOnDestroy | Cleanup called before the component/directive is destroyed. |
ngOnInit | Called on initialization (after the first |
You can read more about them here in the official documentation.
In a lot of interviews you will be asked about what Ivy is. This question will expose your knowledge of how Angular has grown over time and if you have been following the growth.
So Ivy is the code name for Angular’s next-generation compilation and rendering pipeline. With the version 9 release of Angular, the new compiler and runtime instructions are used by default instead of the older compiler and runtime, known as View Engine. – Angular Docs
Ivy can be likened to React Fiber, the rewrite the famous React Hooks were built on top of. Ivy ensures you do not have to learn anything new, and it is also backward-compatible. It is easier to publish, has a shorted build time, smaller bundle sizes and a significant improvement on runtime performance. Also, remember the old compiler is called the View Engine—that is also a possible question.
This question can be answered in a lot of ways. You can say components are used to create widgets or add to the user interface, while directives are used to add new behaviors. This means you can use components to build out an element and directives to customize said element. Every component is a directive; both components and directives have lifecycle hooks, can take input and output statements and have templates and styles.
In other words, components are Angular app building blocks—each one has a template, TypeScript class and stylesheet. Directives are classes that add behavior to Angular apps, a lot of which are built in and you can access using the Docs.
This is favorite one of interviewers: What is dependency injection? It is a design pattern which Angular uses to make classes independent of dependencies, reducing boilerplate code and making easily manageable apps, plus it’s essential for unit testing. Angular classes request dependencies from external sources like objects rather than creating those dependencies.
There are constructor injections that provide dependencies through a class constructor—setter injection for using a setter method, and interface injection for using a provided injector method and implementing an interface.
You can read more about it here and here.
This is a very important type of question for junior roles. Are you part of any Angular Developer community? Do you attend local Angular meetups, Google Code Jams, Google Developer Groups? Angular has a lot of communities across over 90 countries and in popular cities all around the world, so it would be beneficial to join one of them near you.
Resources are another similar angle. Do you follow the Angular blog on Medium? Are you part of Angular content publications (like this one you are currently reading)? Having these can sometimes increase your chances and show that you are excited about the Angular product, the people and the tools and community around it.
There is a lot you can mention in this section. Some things you could note include how you use TypeScript by default—depending on your background and point of view, this can be a pro or a con. Angular has very long-term support, however it has a really big codebase compared to a lot of similar frameworks. The learning curve can also be a hindrance, but it is also fully featured with a large ecosystem, so it balances out. Put some thought into your own opinions on this matter so you can articulate a cohesive response.
Change detection is one of those things that just works and helps ease your use of Angular, and you may never really need to think about it. It is basically the Angular framework feature that makes sure data in the component is in sync with the view. It works by detecting changes like clicks, HTTP requests and other events, and instantly deciding if the view needs to be updated or not.
There are two types—the default one and onPush
for when data is explicitly pushed into the component using an input statement or an observable.
You can learn about it in the documentation here.
These are a few things to start thinking about and researching before attending your first junior Angular developer job interview. I hope you found this helpful, and I wish you success in your job search. Happy hacking!
Nwose Lotanna Victor is a web technology enthusiast who documents his learning process with technical articles and tutorials. He is a freelance frontend web developer based in Lagos, Nigeria. Passionate about inclusion, community-building and movies in Africa, he enjoys learning new things and traveling.