What Is Angular?

Explanation for Beginners


In this video you will learn what is Angular. If you are new to frontend developer and you have some css, html, javascript knowledge and now want to start learning some javascript framework but you don't know what, or you heard about Angular but don't know pros and cons exactly than this explanation for beginners is for you.

Introduction

Hi I'm Oleksandr Kocherhin from monsterlessons-academy, where I'm teaching you how to become a developer or improve your skills of being a developer in learning by doing way. And if you are new here don't forget to subscribe and I will link everything that I'm mentioning in the description.

Just to remind you this video is part of the free angular for beginners series So let's get started.

Content

So what is Angular? It's a frontend framework for developing single page applications. And the first question what does it mean? So normally if you build the website with like just a normal web application you backend will do all heavy lifting, render pages and so on. You will also get full page reload after each click on the link. The idea is that you have zero code about rendering data or templates in your backend. You simply always render empty html page which has javascript inside. Then you javascript checks what content should be rendered based on the current url and renders it. The when you click on some url on the page your page won't be reloaded and your backend doesn't do anything at this moment. Javascript simply sees that user clicks on link, removes old content and renders new content. This is exactly why it's a single page application because it's always a single html page where javascript just changes the content.

Now the question what the term framework means and what is Angular exactly. So it's just a bunch of javascript which give the the architecture about how to right your application. So it's not a library which will just have a bunch of functions but something which defines structure, follows some designs and patterns and helps you to build an application much much easier from start to the end.

Here is some Angular history. In was developed in Google at 2010 and it was version 1 which is called now Angular JS. It became really popular quite fast but at some point they decided to create version 2, improve architecture of the framework and so on. At the end they wrote everything from scratch and Angular 2 and above (for example now we have version 10) is completely other framework. So if you hear Angular JS it's a Angular 1 and Angular means modern framework what you want to learn.

Let's talk a bit about Angular architecture. The whole application is developed with components. So what is component? It's just an isolated part of business logic with some template and styling. For example a feed is a component, top bar is also a component and singleArticle is a component. So basically your whole application in Angular is splitted in components. Also it allows you to create reusable components. If for example you have a tag list on several pages it can be the same component which you just call on different pages.

The other important point is that you how it should work and not what exactly need to be done. In plain javascript if you want to change the color of the element when user clicks on it you need to to attach a listener and then on click modify the class or css of that DOM element. In Angular it works differently. You can define variables in your component and bind them to your template. So every time when you change a variable you template will also automatically update and you shouldn't think about working with DOM manually. So Angular makes all the heavy lifting and makes it by itself. This is why it's more about describing how your component will react on variables change than really building this reactions like in plain javascript.

One more important point is that we don't write javascript while developing Angular applications. We are writing Typescript. But it's not like you need to learn completely new language. 80% it's just Javascript but with typings. And what does that mean. Types define what type your variable is. Is it a string, boolean, number or object. If it's object what properties are inside and much more. You can also create you own types which makes your applications easier to understand and support. And what is more import Typescript prevents a lot of runtime errors because it validates the code on each code change while transpiling it to javascript to run in browser. Which means yes you need to learn at some point Typescript if you are developing Angular apps but you can start learning it without Typescript knowledge and it's completely fine.

One more really important feature of Angular is virtual DOM. So as you know updating DOM it really performance task so to solve this problem Angular building a DOM representation inside javascript which is called virtual DOM. Then it's much easier for Angular to apply changes to the DOM because Angular checks what changes are needed and to which part of the page by calculation the difference between old representation and new one. So it's much more efficient to work with virtual DOM then to modify DOM directly.

Should you learn Angular or not? You need to sure to learn some frontend framework if you want to work as a frontend developer. Angular is one of the 3 most popular frontend frameworks nowadays so you can for sure earn money with it. I would put it on the second place of popularity after React and before Vue. The level of entrance in Angular is higher than for example in React thats for sure but the amount of people what are doing Angular is also smaller than for example React so you have less competition and sometimes more money.

I want also to add that you can't go wrong. If you learn Angular or any other framework you can then later just to another framework, for example React, of course you won't use 100% of your Angular knowledge there but 70-80% for sure because all frontend frameworks nowadays are solving the same problems and have common features but just in different ways or paradigms.

Call to action

I hope that this video helps you to understand what is Angular and if you need to learn it or now.

Also don't forget to check my full courses regarding different web technologies. I will link them down in the description box below.

If you find this video helpful, don't forget to subscribe to this channel and hit subscribe button. And I see you in my next video.

🚨 Important

📚 References