What is Angular? (Explained for Beginners)

hey everybody what's going on I'm handy I'm a self-taught software developer and in today's video I'm gonna answer the question what is angular but I'm gonna answer that for the beginners out there for people who are brand-new to software development maybe you've just learned JavaScript or HTML and CSS and you're looking to get into a framework and you heard about angular select what is it why should you learn it I'm gonna cover that in today's video so let's just get to it I want to do this fast and easy so what is anger so anger is a front-end framework like we said and it's really meant to develop single page applications now let's break that down so what is a front-end framework because I'm sure you've heard this a lot and there's a lot of fun and frameworks out there and people use that term interchangeably interchangeably with libraries sometimes so it can get a little bit confusing so the way I look at a front-end framework is it's really meant to make your life easier to develop a single-page application or just applications in general because if you've ever built a website you know that for example using javascript to interact with the Dom it can work it's great but there's a lot of heavy lifting that goes on in between there's a lot of stuff that you do a lot of code you have to write jQuery the library jQuery which is sort of going out of fashion at this point do do front-end frameworks used to do a lot of the heavy lifting that you would have to do with the Dom but even beyond jQuery there's a lot of stuff that you need to do there's a lot of different in general there's just a lot of challenges with building large complex applications making sure that the code is maintainable making sure that follows good patterns of design making sure that the different parts of the application are using the drive principles you're not reusing code all over the place which is really hard using the old paradigm of HTML and JavaScript so what a front-end framework basically does and I'm talking about whether it's angular or react or view if they have a certain approach to developing a website or a single page application meaning one page it gets loaded in your browser and just handles everything so angular specifically uses a couple different approaches that we'll get into that will make more sense but to give you a sense of what angular is so angular was originally developed by developers at Google it's still maintained by the developers at Google but it was developed back in 2010 that was angular version 1 and that was called angularjs it's really important to remember that cuz if you hear angularjs it means something different from angular well angularjs had a certain approach to you know their way of going about building applications the the I used it and I remember it very vividly but now they moved to version 2 I think that was in 2014 maybe 2015 so angular version 2 and above is now called angular so if you hear angular that's version 2 all the way through what now is the most latest version which is seven so just keep that in mind if your angular it's different from angularjs so what are some of the key features here let's just kind of cover some of the basics and try to explain what they mean so the first thing I would explain about angular is that they it's a component based front-end framework so everything is based around components and really I love this idea because if you think of your standard website everything on that page is really a component right so if you got your let's just think of like your own personal website you've got a nav bar up top maybe you've got a side bar and the side bar you've got different widgets you've got a main page with content in it and each one of those things you can think of as its own isolated component right like it has its own template meaning it has its own HTML and each one of those templates reveals data right so maybe there's data in the JavaScript that's making the title a certain way or making the text a certain way either way that's the way you can think about a website just like as a paradigm right so you can think of a website like that well what angular is done is they've basically implemented that as an approach for designing websites so what you can do is you can create reusable components and each component is just worried about two things really if you think about it it's worried about a template right so the HTML and it's worried about some sort of data that needs to fill that template and it handles all the in-betweens right so that's where you've heard the term data binding so you can basically for example let's say you have an input in your template you can bind that either one way meaning kind of read-only or two ways meaning you can modify the data in the input and it can go back and forth you don't have to worry about hooking up a you know get document dot get element by D getting that value out of there like angular will just take care of that for you so it's very nice either way you can create components in isolation you can use them all over the place and it really helps when you're developing large-scale applications because really what you want to do is you want to have loose coupling and high cohesion in terms of the modules in your application if you've heard that before so you want to have little modules all over the place or in this case components that don't depend on each other too much and that inside of that component there all the logic is just related to itself that's a advanced topic for another day but that's one of the things that I love about angular that makes it easier to develop very complicated large complex applications that pass data around another feature that ingo provides for developers is that it uses client-side routing over server-side routing so let's go old-fashioned here for a second let's say we created a personal website here and it's got three pages well when you go to the nav bar and you click on any of those pages what's gonna happen is your your HTML your JavaScript will make a request off to the server to get it that new page you know about me dot HTML or you know home page HTML or contact me H tml and so when you make those requests the server technically is routing those pages to you right you have to make a request for each you get to pull once you get the HTML file and you pull in more JavaScript what's cool about front-end frameworks and angular specifically is that it will provide client-side routing so if the browser if the front-end is considered your client what that means is when you click on the navbar to go to a different page angular won't actually need to go to the server to get the files or the data for that page technically that's not always true but just fall with me here ok there could be other situations that I don't wanna get into right now but for the most part angular will handle them and you can just go from route to route to route and you're technically wouldn't have to go to the server if you don't need any other information maybe you need data for sure you definitely need maybe data to fill those you know those components or those pages but as far as getting the the templates or the general JavaScript that can all be in the front-end you don't have to make tons of requests over to your servers so that can be very helpful one of the best features at my opinion is the dependency injection which makes unit testing a lot easier if you want to know more about unit testing I actually created a video it's really good it's based mostly in c-sharp but even if you from a different programming language I think you can pretty well understand it so check that out but angular has built-in dependency injection and dependency injection is terrific it is allows you to unit test because any time that you unit test let's say a component which can you really call module you want to make sure that that module which typically modules will depend on other outside modules like right so for example if you have one module that needs an HTTP module that makes HTTP requests well if I want to test this service here in isolation but it depends on an outside module I can't you know I have to do something with this module here I don't want it to make HTTP requests because if it depends on that module that's making HTTP requests then I can't really test this in isolation so what dependency injection allows you to do is the dependency injection activator or a thing that goes out and pulls that service in and provides it for your module well you can tell it to mock it in a unit test and in production you could tell it to give it the actual module so if you didn't understand that don't worry it's not a big deal but dependency injection pretty much provides that so unit testing is very easy and angular and in fact the angular CLI which is the tool that you can use to build components and run your angular application on your local environment well it will actually create unit tests for you so you don't have to go through this process of setting up unit testing which in JavaScript from you is very painful when I did it at my first company I was actually I tried to help doing that so yeah so unit testing is a lot easier and it's a key component to having applications that don't break a lot so you know developers definitely love that really the reason that I tend to really love angular and you know a lot of front-end frameworks definitely do this as well but angular it was my specific where I specifically have a lot of experience is that it isolates the the view layer from the model layer and the way you can think about this is just that you've got your HTML and then you've got your component right and your HTML just as worried about displaying data so when I have my HTML file and I want to make something really pretty and I want to make sure that the data's gonna be there I just work on the view basically and just make sure it looks pretty I tell the view where the data is going to be coming from or what the data is and the component worries about getting the data back maybe from a server making sure the data is in the you know massage in the right way so it's easy for the view to use so you separate the view in the model and just very easy to develop you don't have to think about wiring up things you don't have to think about things breaking it's just a lot simpler than the old paradigm of making websites so that's what I really like about it now the question is should you learn angular now my answer is yes I love angular I think it's great I have had a lot of experience with helping people learn angular through my mastermind program and I will tell you that people get very frustrated when they first learn it there's a lot of reasons for that one is that it's it's like learning a new programming language in a way because it's again it's angular's paradigm it's they're opinionated approach to developing websites so you have to basically learn how they want you to build a website after you go through that process after you go through some of the frustration of learning you know for example a little bit of typescript of learning maybe es6 if you haven't been introduced to it because angular does use a lot of es6 features such as classes and modules so once you go through that process and you've actually built a few websites or even a website of your own with angular you'll start to see the benefits now I don't think like people love to get in this argument what's the best framework look I think it goes great if you learn angular pretty well you'll be able to transition to react you'll be able to transition to view and you just it's a different paradigm to learn but at the end of the day like at least what you've learned angular is what's possible with front-end frameworks so I would recommend looking if you're really trying to get your first job and you don't want to waste a lot of time I highly recommend look doing research and finding out like in your area what's the best to learn like for some places and some locations like west coast especially react is all the rage here in Chicago I would probably recommend angular so it really just depends on where you live but again if you learn angular full-tilt you're not gonna go wrong it's not be the end of the world but if you want to really strategize then maybe think about where your location is and do a little research on it so I hope this helps this is my you know what is angular for beginners I hope you liked the video so leave a like and make sure that hit subscribe below this channel is 100% about teaching people how to become software developers no matter who you are no matter where you come from I want to make anyone who's willing to put in the work and effort I want to help them along in their process alright just let you know too I've created a free report of the five best programming languages to learn in 2019 I just put that out recently I've spent a lot of time on it it's really highly detailed so if you want a free copy of that report go to Andy Serkis com forward slash report the link is also in the description below definitely pick up a free copy of that before you head out other than that thank you so much for watching and peace out as always guys

Channel: Andy Sterkowitz

Views: 293,645

Keywords: angular, angular 7, angularjs, learn angular, angular.js, angular tutorial for beginners, angular for beginners, angular for dummies, what is angular, what is angular 7, angular2, angular 2, javascript, front end framework, web development, web development 2019, front end framework 2019, what is a front end framework, software development, programming, front end software developer, web developer

Id: VAkio68d51A

Length: 11min 24sec (684 seconds)

Published: Mon Feb 25 2019