Angular 2 Tutorial for Beginners: Learn Angular 2 from Scratch | Mosh

Поділитися
Вставка
  • Опубліковано 17 лис 2024

КОМЕНТАРІ • 885

  • @JDLuke
    @JDLuke 8 років тому +2

    I'm a long-time Java back-end developer who decided to expand my skill set a bit with Angular. I spent the entire weekend struggling with what felt like a foreign country. Seven minutes into this video and I'm beginning to feel right at home. Good job!

  • @talalshoaib3099
    @talalshoaib3099 8 років тому +19

    MOsh... I don't know who you are..but I know you are a genius....
    Thanks a million times for posting such a great stuff!!!

  • @shadowburnx4400
    @shadowburnx4400 7 років тому

    Hey Mosh,
    Just wanted to say that I spent a week reading through documentation on angular 2 and found myself very confused. A friend from work pointed your video out to me as a good starting point. It completely dispelled all of the confusion I had and made everything so easy to follow. I enjoyed the 1 hour video so much, I took you up on your Udemy special and bought the course. I must say that it has been the best $15 I have ever spent. Completely worthwhile.
    Thank you so much for taking the time to make such fantastic videos, and I hope other users see enough value in them to also pay for them.
    thank you again.

  • @KevinCarbonaro
    @KevinCarbonaro 8 років тому

    From all the angular 2 videos I've seen on the Internet, this one is the most clear and easy to follow. It provides direct instructions while at the same time explaining each part without over-loading a viewer's brain with lots of complicated information. Thanks! Keep it up!

    • @KevinCarbonaro
      @KevinCarbonaro 8 років тому

      +Programming with Mosh yes i just bought your course and enjoying it. I like the cheatsheets a lot...makes for a good reference to remember how everything goes together.

  • @leoespejo7437
    @leoespejo7437 8 років тому +154

    This guy is simply awesome. Best course I've seen in a while.

    • @jerryho3657
      @jerryho3657 8 років тому

      is there the same course just the angular 1.x

    • @SlavchoDimitrievski
      @SlavchoDimitrievski 8 років тому +6

      I also liked the way he explains ... keep up the good work mate :)

    • @lstecklov
      @lstecklov 7 років тому

      Leo Espej

    • @ayeshrodrigo2197
      @ayeshrodrigo2197 7 років тому +3

      This guy is awesome. Made me interest in angular within minutes! Explains in the best way possible.

    • @RoMeRo8888
      @RoMeRo8888 7 років тому

      Leo Espejo малышарики

  • @atislav
    @atislav 8 років тому +69

    if the form input doesnt work just replace it with: this.renderer.setElementStyle(this.el.nativeElement, 'width', '200'); and the same for onBlur()
    you're welcome :)

    • @sieurgrigri
      @sieurgrigri 8 років тому

      thx!
      Know why?

    • @ZawilecxD
      @ZawilecxD 8 років тому +2

      According to this: github.com/angular/angular/blob/master/CHANGELOG.md#breaking-changes
      "renderer.setElementProperty, ..setElementStyle, ..setElementAttribute now take a native element instead of an ElementRef"

    • @MN-sc9qs
      @MN-sc9qs 8 років тому

      Thank you!

    • @strokerzmiddleeast233
      @strokerzmiddleeast233 8 років тому

      Thanks pal :)

    • @lochanaranatunga4309
      @lochanaranatunga4309 8 років тому

      Thanks a lot man!

  • @sankettajane2370
    @sankettajane2370 8 років тому +30

    In case anyone else runs into errors regarding the "typings" library after trying to run "npm install", I was able to fix it by manually installing the library. From the command prompt type: "npm install -g typings". Once it's installed you should be able to run the "npm install" without any errors.

    • @MrLovelake
      @MrLovelake 8 років тому

      +Sanket Tajane Thanks man, that was exactly what I'd been through

    • @jofu6488
      @jofu6488 8 років тому

      +Sanket Tajane Thanks :)

    • @arborinfelix
      @arborinfelix 8 років тому

      Thank you very much...

    • @chetan1483
      @chetan1483 7 років тому

      Thanks Sanket, that saved lot of time

    • @anthonylombard8573
      @anthonylombard8573 7 років тому

      You rock!

  • @AnhPham-fo2yz
    @AnhPham-fo2yz 8 років тому +6

    People like you are making the world a better place sir

  • @SunOfRa
    @SunOfRa 7 років тому

    This was a no brainer. Watched 5 minutes, enrolled in the course. Bless you Mosh. We need more tech-savvy folks who have the same friendly, enthusiastic energy as you. Can't wait to go through the course!

  • @Ali.Rahimy
    @Ali.Rahimy 7 років тому

    Thanks Mosh. Just a kind reminder to people watching this video: After you installed node you should install the following as well:
    npm install -g lite
    npm install -g lite-server
    npm install -g concurrently --save
    npm install -g es6-shim@^0.35.0
    npm install -g reflect-metadata@0.1.2
    npm install -g rxjs@5.0.0-beta.6
    npm install -g zone.js@^0.6.12
    npm install -g angular2
    If you are using Linux, please do not forget sudo the commands above eg:
    sudo npm install -g lite
    You might also need to replace "concurrent" with "concurrently" in" your package.json file prior to running npm start command
    In the meantime please don't forget to decrypt the content of seed folder before doing all of the above

  • @michaelmanger9532
    @michaelmanger9532 7 років тому

    3 mins and I am already in for the rest of the tutorial. I have been planning to learn Angular Js for a year now and I am finally doing it now. Thank You

  • @sriram6781
    @sriram6781 7 років тому

    When i read books or watch videos the first few minutes i will decide whether to continue with it or not based on how author explains it. This video is the best one ever! I like the way he begins and the flow is wonderful!!!

  • @Josh1billion
    @Josh1billion 8 років тому +1

    Great tutorial. Purchased the rest of your course. :) For anyone else purchasing, Section 3 is where the remainder of the course starts.

  • @bitNirvana
    @bitNirvana 7 років тому

    It is by far most simplistic and useful tutorial for Angular 2 beginners. Point to point description of different features. A lot of information in these 54 minutes. Thanks for sharing Mosh.

  • @bahiagui
    @bahiagui 8 років тому

    Mr. Mosh,
    thanks for your help. You've helped me a lot, so far. Unfortunately, I'm unemployed and I just can't afford your complete course, regardless of being sure it's worth it. Once I have founds back, be sure I'm gonna pay you back applying to your course. My family thanks you as well.

  • @aniketyadav5024
    @aniketyadav5024 5 років тому

    He's one of the best if not the best programming tutor online ever!

  • @ControllerTape
    @ControllerTape 7 років тому

    I just want to say thank you so much for this course. Every introductory tutorial I've seen looking into Angular and Node.js have been a bit like throwing you into the deep end with a cement block; watching your course, you covered so many concepts that most Angular tutorials either barely gloss over or leave out completely. I was starting to feel like I wasn't going to bother with Angular simply because the learning curve was so steep it wasn't worth the time to learn, but now I think I'm ready to get started, and I'll definitely be looking into your full course.

  • @LMacNeill
    @LMacNeill 8 років тому

    SO paying for this course on Udemy!!! 9 hours of instruction for a HUGE discount if you click on the link in the description. No, I'm not getting paid to say this. I was blown away by the discount. HAD to buy the course at that price. After this one video, I learned a lot -- I'm very much looking forward to finishing the entire course.

  • @othmane8994
    @othmane8994 8 років тому

    I don't understand why people are hating this !! This tutorial is really awesome, it covers the very basics of angularjs 2, this is what we really call from scatch ;) Very well done mosh and keep up the good work.

  • @kodygann6893
    @kodygann6893 8 років тому

    Finally! A tutorial that you can actually get everything - node, git files, cmd line, project files - up and running step by step without pulling your hair out.

  • @cariencombrink
    @cariencombrink 8 років тому

    Finally.. someone who can teach!!! THANK YOU SO MUCH!!!!

  • @larskuijlenburg5558
    @larskuijlenburg5558 8 років тому

    After seeing this tutorial video I purchased the course on Udemy. This is (for me personally) a very effective style of teaching. One of the most interactive an hands-on tutorials i've seen so far. Good job on this one

  • @breasteee
    @breasteee 8 років тому

    This is by far the best introduction to Angular 2 I've seen so far. Thanks!

  • @AyomideFagbohungbe
    @AyomideFagbohungbe 8 років тому

    I have to admit that this is the best intro tutorial video I've seen in a while. Well done bro... Good job.. Very straight to the point.

  • @contro07
    @contro07 8 років тому +2

    I would not recommend this course to a beginner. But for a person with experience in Java, JavaScript and AngularJS 1, this course is perfect. Really good explanations, simple code but lots of functionality. I started learning Angular 2 a few days ago, but now after this video I think I can carefully start changing (small) existing AngularJS 1 apps into Angular 2 apps. This would be a nice way to learn it the right way, I guess.

  • @vivekmeka6913
    @vivekmeka6913 7 років тому

    Finally stumbled on the best online tutor ever. Mosh, you are awesome. Keep uploading. Cheers ☺

  • @RavalJaydeep58
    @RavalJaydeep58 7 років тому

    The way Mosh explain is awesome.... I learned .Net in couple of hours after watching his video...

  • @almobin3576
    @almobin3576 8 років тому

    This guy teaches us like his brother...!! Hey Man thanks for helping like this!! You've got a full time student and a subscriber too!!!

  • @raghuZanne
    @raghuZanne 8 років тому

    Bought the course and love it! I am still on 3rd section, totally worth it. Thank you very much for the discount code!!

  • @joseignacio1012
    @joseignacio1012 8 років тому

    the clearest technical tutorial I have ever listened to

  • @narayanadhurti1603
    @narayanadhurti1603 7 років тому

    I have never seen a wonderful training class for free.Really rocks.

  • @buneriblogger
    @buneriblogger 8 років тому

    Google should hire this guy to get started with any new technology :) I am reading angular article since last 3 days, got too much confused, but this guy help me to get started. awesome guy.

  • @satishakumar1073
    @satishakumar1073 7 років тому

    Best video on angular 2 for beginners who want understand architecture how stuff works and how to get started.

  • @JaisAbhay
    @JaisAbhay 6 років тому +1

    I finally founded the best person on UA-cam to learn some cool stuff from. Thanks Mosh!

  • @anthonigardner8558
    @anthonigardner8558 8 років тому

    So just bought the course. Needed to learn Angular 2 and have been struggling a bit, health and time contraints etc. This summed everything in one neat package and was enough to encourage me to buy the full set :)

  • @LivvieLynn
    @LivvieLynn 6 років тому

    Good start/pace. Fact I can watch at 2x speed and understand is great. If I get stuck, 1x speed feels like I have someone there to lean back on.

  • @敲键盘的猫
    @敲键盘的猫 8 років тому

    It's really helpful for me and is much better than the tutorial in official website. The tutorial really confused me but you show me how easy it is to build an angular app. Thanks!

  • @RameshKumar-yk5nr
    @RameshKumar-yk5nr 7 років тому

    i am new learner about angular and i have so much confuse about angular js 1 and angular js 2 but after watching this video i have clear all doughts thank you so much and i was skip angular js1 and directly learn angular js2

  • @ekiran29
    @ekiran29 7 років тому

    Best course so far for beginners. I was so lost with all the documentation around angular but this video explains all the concepts very nicely. Well done!

  • @iamdhison
    @iamdhison 8 років тому

    Best Course for who are starting with Angular 2...Well explained and Handon.

  • @lindsaymward
    @lindsaymward 8 років тому +7

    Thanks for the video! I note that Angular 2 now uses "let course of courses" instead of "#course of courses".

  • @kefetDtcom
    @kefetDtcom 7 років тому

    I bought this course yesterday. Yes it is updated, also it is not that much difficult with the update he has.. I wish all the instructor were like him.. .

  • @claudiotormen759
    @claudiotormen759 8 років тому

    Thank you man, only by this video I have already learned a lot, and now I just purchased the full course. Let's have some fun.

  • @AssafBelleli
    @AssafBelleli 8 років тому

    Excelent lecture.
    You convinced me, I bought all the course, and I finally learned how to program Angular JS 2.
    Thank you.

  • @920webdesign
    @920webdesign 8 років тому

    Great intro to Angular 2. I especially enjoy the fact it has ZERO reference to 1.x. There are several changes to be aware of since the release of the vid.
    The angular2/core import now should look like this: from ''@angular/core"
    and @ 51:29...you no longer need the Renderer import. The correct way to set the width of the element is:
    this.el.nativeElement.style.width = "200px";
    fantastic job Mosh. I'll be signing up for the Udemy course shortly

  • @abhisb9
    @abhisb9 8 років тому

    One of the best angular 2 video tutorial available online. Thank you Mosh!!! :)

  • @TommyReady
    @TommyReady 7 років тому

    Just signed up for the course on Udemy, thanks for the quick start video. This got me really interested in learning more!!

  • @Mamos98
    @Mamos98 7 років тому

    Moshfegh Jan, Thanks for the course! Literally the best short course I've seen in a year! This made me switch to yarn (It's a bit complicated why that happened but it happened in a series of chained reactions caused by your video) and jump to angular 2 after a 4 year of angular 1 finally! Thanks and Happy Norooz BTW!! Sale khoobi dashte bashi!

  • @MartinStauber
    @MartinStauber 8 років тому +7

    this.renderer.setElementStyle(this.el, 'width', '200');
    should be updated to be:
    this.renderer.setElementStyle(this.el.nativeElement, 'width', '200');
    change in angular

  • @CarlosHenrique-th3qg
    @CarlosHenrique-th3qg 8 років тому

    Dude... You explain very well!!! I FINALLY UNDERSTAND ANGULAR 2. THANK YOU SO MUCH!! :D

  • @andreasnilsson9463
    @andreasnilsson9463 8 років тому

    Great video!
    I struggled a long time to find a good angular 2 tutorial. This one covers the very basics, helped me understand how angular is structured, and also helped me to keep going on my own. Perfect!
    thank you very much for making this video!

  • @markusseeliger8970
    @markusseeliger8970 8 років тому

    Thanks for that great tutorial. I have subscribed to the complete course and have never regretted it.

  • @cristiantodea4573
    @cristiantodea4573 8 років тому

    man, this is the 1st video I see from you, and you just earned a subscriber

  • @abathur2438
    @abathur2438 8 років тому

    wow, best angular tutorial I encountered so far.

  • @RezaRahmati59
    @RezaRahmati59 8 років тому

    Great Job! Mosh
    Not only the content is great but also the way that it delivers is so elegant, and you paid attention to every detail to make it perfect.
    Without any doubt I will take this video to our next "Lunch & Learn" meeting

  • @kishorshevate374
    @kishorshevate374 6 років тому

    This is amazing Angular 2 tutorial. I became his fan by just seeing 10 mins of this tutorial.

  • @Shakiole
    @Shakiole 8 років тому

    Thanks God... Finally i stumbled upon this amazing tutorial by Mosh... Thanks Mosh

  • @jafar1607
    @jafar1607 7 років тому

    Man. I hoped he was like other free youtubers.
    You are awesome

  • @rehmatunnisa6365
    @rehmatunnisa6365 7 років тому

    Best video and teacher so far for angular 2 for beginners!! I will highly recommend to watch the complete video
    I loved it
    thank you so much Mosh

  • @MenelaosKotsollaris34
    @MenelaosKotsollaris34 7 років тому

    Fantastic tutorial. Should be added as the official tutorial for the Angular2 development.

  • @tommabear
    @tommabear 8 років тому +1

    Hi Mosh, your teaching is always great, you explain things clearly and very logically

  • @simonkalu
    @simonkalu 8 років тому

    You are a great teacher. Thanks for delivering us from the land of Egypt. You concept in teaching is very unique. I can't wait to start your course

  • @AlanSarluv13
    @AlanSarluv13 8 років тому

    this tutorial is really easy to understood,
    you make everything simple and clear to be explained
    step by step from the basic structure to detail code
    totally recomended teacher.
    thank you Mosh.

  • @SubhamoyKarmakar
    @SubhamoyKarmakar 7 років тому

    Sir, You are the greatest teacher that I have ever seen! Just awesome!

  • @npvartak
    @npvartak 4 роки тому

    Learning is easy when a teacher knows how to teach. Very well presented video to get started on Angular.

  • @DrewNorman
    @DrewNorman 8 років тому

    I thought that Angular was going to be way over my head. Mosh dude this stuff is amazing and alot easier than I thought.

  • @XaeroDegreaz
    @XaeroDegreaz 8 років тому +8

    The part where we are instructed to add the CoursesComponent at time 28:00 no longer works in the release version of Angular 2. It seems we have to add it to the AppModule class' @NgModule decorator in the "declarations" property array. Hope this helps those who are watching this well-structured video after official release :)

    • @nishantcop
      @nishantcop 8 років тому +1

      That helps! Changed Code: in AppModule Class
      import { NgModule } from '@angular/core';
      import { BrowserModule } from '@angular/platform-browser';
      import { AppComponent } from './app.component';
      import {CoursesComponents} from './courses.components';
      @NgModule({
      imports: [ BrowserModule ],
      declarations: [ AppComponent, CoursesComponents ],
      bootstrap: [ AppComponent ]
      })
      export class AppModule { }

    • @ibuprofen303
      @ibuprofen303 8 років тому

      Why do they keep bringing out stuff that breaks stuff? This is a mess.

    • @nishantcop
      @nishantcop 8 років тому

      Yeah.. this tutorial was based on pre-release version so these things are expected :)

    • @ibuprofen303
      @ibuprofen303 8 років тому

      Nishant Rana
      Official stable now, yes? Having said that, I can't get the "Heroes" thing to work with Angular2 quickstart - Gives me "Cannot Get /" on the browser. I have latest versions of NPM and Node.

    • @nishantcop
      @nishantcop 8 років тому +1

      Well, officials are stable. Having said that, the issue you are facing, best place to work it out is to post it on stackoverflow. This will increase the visibility and pacen up resolution. Paste a link and I'll be able to take a look into that.

  • @JohnSmith-rn3vl
    @JohnSmith-rn3vl 7 років тому

    9:47 - This was the point where I left your tutorial. I need to know how a project is set up from scratch in order to create applications that a future employer will value. I am sure the tutorial is good and I may come back here after I get what I need elsewhere.

  • @marjanadneen5329
    @marjanadneen5329 8 років тому

    Clear and concise guide.Looking forward for more guides from yah!

  • @intuneknight9681
    @intuneknight9681 8 років тому

    Best tutorial ever, I was learning angular 1.x and I look at to many tutorials, so advance I mean people assume that you know a lot about angular or Javascript, and kind of difficult to understand and also in some point you can get lost, you make it simple and easy to get, is amazing for be honest I spend more time setting the env in webstorm than your course, anyway keep it up I already subscribe to your channel, I did your homework also I have the project one thing that I like is the CRUD project that will be very interesting and Angular2 is awesome also the way you explain your voice perfect man amazing.

  • @richardd.poeling6638
    @richardd.poeling6638 8 років тому

    Awesome video. You are a born teacher. Just the right amount of explanation without it becoming boring. I just signed up to watch the complete course at Udemy and am looking forward to learning more.

  • @BlueJay-z
    @BlueJay-z 8 років тому

    The best angular 2 video I've seen. Way to GO

  • @kadirdamene7587
    @kadirdamene7587 8 років тому +3

    The syntax has changed a bit since he made this video, for eg:
    *ngFor="#course of courses"
    Is replaced with:
    *ngFor="let course of courses"
    Also, i had to add the component name (CoursesComponent) in the ngModule in order to get that working.
    declarations: [ AppComponent,CoursesComponent],
    ---------
    See: angular.io/docs/ts/latest/api/common/index/NgFor-directive.html

  • @mohaawwkk
    @mohaawwkk 8 років тому

    This is one of the best tutorials I've ever seen. Big thanks!

  • @UsamaNada
    @UsamaNada 8 років тому

    this is how toturials should be made. great content and presentation.

  • @siddharth84s
    @siddharth84s 8 років тому

    Man, I second that you are freaking awesome. In ins I learnt more then in 2 days of looking. Very precise. Awesome job dude!!!!

  • @vivekmeka6913
    @vivekmeka6913 7 років тому

    Finally stumbled on the best tutor. Mosh you are awesome. Keep uploading. Cheers !!

  • @hkim201
    @hkim201 8 років тому

    Great informative tutorial ! Congrats on your first subscribe count!

  • @GuskiS
    @GuskiS 8 років тому

    Easy tutorial, thanks :) But I have two questions regarding angular 2:
    1) How do you change components value (ex. title) in parent component from child(and vice versa) or something like that?
    2) Are there parent-child relations regarding component, directives and so on? For example, if you inject them in parent, can they be used in child automatically without the need of redo the process for child?

  • @davidmaxwaterman
    @davidmaxwaterman 8 років тому +12

    I'm very tempted to buy the full course. but am put off due to it being out of date. I wish I could sign up to be notified when a new version is created.

    • @LMacNeill
      @LMacNeill 8 років тому +3

      According to the Udemy website, the course was updated on November 8, 2016, to include the final release of AngularJS 2. I just purchased it myself.

    • @suhasc9418
      @suhasc9418 7 років тому

      Hi... As you have bought this course.. Can I please know if the video content of the course too is updated to the latest?

    • @LMacNeill
      @LMacNeill 7 років тому

      Suhas C It is updated. It jumps around a bit, because of the update, and there are "cheat sheets" he has created that you need to download which tell you the few changes from what's in the video vs. what you actually need to put in your code. It's not too hard to follow along, though. Just pay attention to which file you're using and when.

    • @suhasc9418
      @suhasc9418 7 років тому

      LMacNeill Thats great to hear and Thank you so much for letting me know in detail. Thanks a lot!!

    • @VinothKumar5403
      @VinothKumar5403 7 років тому

      Previously i was struck,after seen your comment i'm cleared sir..thank you.

  • @AbdallaElmedny
    @AbdallaElmedny 8 років тому

    Great tutorial, didn't hesitate buying the full course.

  • @urbanelemental3308
    @urbanelemental3308 8 років тому

    I wanted to hate on this video because it's so long, but it's really good. Thank you.

  • @vishwakumarpatil1807
    @vishwakumarpatil1807 8 років тому

    Just what I needed to get started with ng2. Thanks!

  • @strokerzmiddleeast233
    @strokerzmiddleeast233 8 років тому

    Great Course. After trying numerous Angular2 courses, this is the first one I could actually complete. Thanks Mosh. Keep Going.

  • @akashgill870
    @akashgill870 8 років тому

    too good. i just watched 10 mins of video and couldn't resist myself to comment first.

  • @RushMcPato
    @RushMcPato 5 років тому

    I just started watching this video and it seems it’s simply great. Thanks!

  • @umairkhalid123
    @umairkhalid123 8 років тому

    After 1 hour tutorial I would only say 1 word for you. Awesome (Y)

  • @gideonz74b
    @gideonz74b 7 років тому

    Mosh, your enthusiasm is addictive... Awesome presentation!

  • @jonnysongs
    @jonnysongs 8 років тому

    Thanks Mosh you're a natural at this, keep it up!

  • @PS-dp8yg
    @PS-dp8yg 8 років тому +2

    Beautifully done! Well explained! The best on the topic.

    • @PS-dp8yg
      @PS-dp8yg 8 років тому

      I did that, I even purchased your course, and completed it.

  • @myingxue
    @myingxue 8 років тому

    excellent work, the best angular2 course I have seen so far.

  • @balajis8279
    @balajis8279 7 років тому

    You are the best.Now I started growing by watching your tutorials

  • @timoernst
    @timoernst 8 років тому +1

    Excellent step-by-step tutorial, thanks! I'll reference this in one of my screencasts.

  • @bain131
    @bain131 8 років тому

    Had a problem installing angular2-quickstart, then saw post from DoubleDurian. I did npm install typings -g then did npm install and it works perfectly!

  • @ComplexFold
    @ComplexFold 7 років тому

    Great Video! This is a introduction video doesn't go in very deep until you buy the course.

  • @kurrisudarshanreddy
    @kurrisudarshanreddy 8 років тому +1

    Apart form adding "typings":"^1.0.4" to "devDependencies" in package.json file we also need to change the single quotes to backticks of the template in the app.component.ts file under app folder.

  • @Lawler1079
    @Lawler1079 8 років тому

    This is a really good tutorial for Angular 2. Highly recommend.

  • @sreekurpad
    @sreekurpad 8 років тому

    You are awesome!! You explained the concept in simple terms and easy to remember

  • @davidkananda2896
    @davidkananda2896 8 років тому

    Great content and explanations. Purchased the full course! great course!

  • @disposedtrolley
    @disposedtrolley 8 років тому

    Fantastic! Just starting out with the Ionic framework and this has been really helpful