Mastering PyCharm Transcripts
Chapter: Client-side web apps
Lecture: Front-end JavaScript frameworks

Login or purchase this course to watch this video and the rest of the course contents.
0:03 Now let's look at one of these Javascript frameworks
0:05 and see how we get even better support in PyCharm.
0:08 So here we have Angular JS and this is one of the more popular ones,
0:11 I showed you the Ionic example and of course,
0:14 that's based on Angular so that's pretty cool.
0:16 And over here is a little tutorial
0:18 on working with Angular JS like these little things here,
0:22 and you can go and edit the HTML and the CSS to make this happen.
0:26 So let's look over here, I do a little reformat,
0:29 we've got a link to Angular, this is Angular 1.0,
0:34 it doesn't really matter, the way it works is all basically the same.
0:39 So we come down here, we have our code here
0:43 first thing we've got to do is we've got to go here and say
0:46 this is an ng app, let's put that away there, like so.
0:52 So we'll say this is our app and then down here
0:55 we're going to have things like ng-click, so if I type ng
0:58 you can see I've got -bind, -app, -class, -cloak,
1:02 all the various things that you would do
1:04 and now we have actual Angular JS help not just HTML, CSS and Javascript,
1:10 but support for all that, let's have a look here.
1:13 One more time in our browser,
1:16 and see what we've created or copy and paste, take your pick.
1:20 So it looks pretty good so far, if we click around
1:22 you can see our little Angular JS app is working,
1:24 granted it doesn't do very much, but it's quite easy to build
1:29 as you can see with all the support for the Angular JS features
1:33 and I find this really helpful because I don't do Angular JS so much
1:36 so I am like is it ng-bind, is it bind colon,
1:40 how do you do conditionals in here, and all this kind of stuff,
1:44 controllers, routing, all the things you do in Angular,
1:47 it's really nice to be able to just leverage the intellisense that is built in here.