Mastering PyCharm Transcripts
Chapter: Server-side Python web apps
Lecture: Concepts: Server-side apps

Learn more about this course
Login or purchase this course to watch this video and the rest of the course contents.
0:01 Let's review the core server side concepts that we saw
0:03 for creating Python full stack web apps with PyCharm.
0:08 We start by saying create new project and we have a couple of options
0:12 we've got Django, Flask, Google App Engine, Pyramid and Web2Py
0:17 so there's a lot of things that we can create here
0:20 and honestly, if you really needed something else
0:22 you probably could create it outside of PyCharm
0:25 and import it somehow, it's pretty flexible.
0:27 But, here we have these options and we chose Pyramid
0:30 because Pyramid is a little more involved
0:33 and so the tooling support that PyCharm brings
0:36 is actually more helpful, like if we created a Flask app
0:38 it would really just be like running a separate Python file,
0:42 so I was able to show a little bit more of the tooling,
0:45 you'd see a similar experience with Django as well.
0:48 So, we saw there's a new improved way
0:53 for creating these virtual environments inside the project
0:56 which is the way I'm doing things these days, I really like that.
1:00 Okay, so we say create a new one and off it goes.
1:04 We also saw that you choose a template language,
1:07 Chameleon, Jinja 2, Django, Mako, and then within the html template
1:13 you have to work with that particular template language,
1:15 and PyCharm has support for all of them,
1:18 so I didn't show you every single variation, like I didn't show you Jinja 2
1:21 but here is the template attribute language that comes with Chameleon
1:26 and you can see all the intellisense and autocomplete stuff is there
1:30 that you would expect, so it makes it super easy to work with it,
1:33 like when I did that omit tag thing, I thought it was exclude tag
1:37 but I just typed tag and it said oh yeah, you mean omit tag,
1:40 oh yeah that's right, that's what that is.
1:43 So it's super helpful to have this.
1:45 We also saw that PyCharm supports zen coding
1:47 this is client side as well, it's straight up html stuff
1:50 so, we can say div.menu ul etc and we hit expand that via tab
1:57 and it expands out to this whole nice prebuilt html structure
2:01 and even guides you through filling out the elements,
2:04 like it takes you through what goes into the individual lis,
2:07 sometimes that is helpful, sometimes it gets in the way,
2:09 but pretty to cancel the navigation part out, but this is a really nice way.
2:14 The hardest thing I find about it is remembering to use it
2:17 it basically uses exactly css syntax
2:20 so if you know the web well, you can pretty much imagine what to do there.
2:23 We also saw that PyCharm balances the tags
2:29 so here we have a div, maybe we want to change it,
2:31 we're going to change it to a span
2:33 and all we have to do is highlight the div type span
2:35 you can even just delete the div and the re-type span
2:39 if you're careful about how you do that
2:41 and PyCharm will balance the closing tag, which is super nice.
2:43 We also saw that it has css autocompletion, so that's great,
2:50 it pulls it in from basically all the referenced css files
2:54 so you saw it came from bootstrap, this is the bootstrap button info
2:57 and it can also come from our own custom css elements and css files.
3:05 One thing to be aware of, you'll get auto complete for everything in the project
3:10 even if it's not going to be included in that page,
3:13 like we created our ours.css file and put button list in it and that showed up
3:18 but we actually never included button list on that page,
3:22 so it's more like, it looks like this is what in the project and I can help you
3:27 but it's still up to you to make sure the css gets included correctly.
3:29 We also saw you can navigate the DOM really well
3:32 with this little thing at the bottom,
3:34 and they recently added this for the code navigation in Python as well
3:38 until recently this was just on the server side,
3:41 if you even hover over it, it will give you more details as well
3:44 as you can see here that div show main.
3:46 If we go and tell the system that the top of our website is the resources root,
3:54 we get lots of help for the static files
3:57 and for whatever reason, at least at the time of this recording
4:00 that doesn't happen in PyCharm,
4:02 they may actually added this as a feature request,
4:05 so who knows, maybe you won't have to deal with this,
4:07 it will just happen, just understand why it happens.
4:10 So if we go and we set the directory, not the static directory
4:14 but the one that contains the static directories as resources root
4:18 you all of the sudden get all sorts of autocompletion,
4:20 the errors about the file not being there and go away, all that kind of good stuff.
4:24 So notice, the little icon down here that says this is a resource root
4:28 it looks, I don't know, I'm not sure what that icon means
4:31 but it means resource root.
4:33 And then when we do it, not only do the errors go away but we get autocompletion.
4:37 The last thing to talk about here on the server side is
4:40 running tasks before you launch the website.
4:44 So some web applications require you to say
4:48 compile down certain types of Javascript
4:52 into a minified version or something to that effect.
4:55 So you can create file watchers, you can create a gulp task,
4:59 you can run an npm script, you can compile TypeScript,
5:01 there's all sorts of little do this before my project launches if you need them,
5:06 we'll see more about TypeScript in the next section
5:10 but if you are doing these types of things, it's really great
5:13 you can even run another configuration
5:15 so if you need like a Python file to make sure
5:17 the database is set up just right on new machines or whatever,
5:20 you could run that configuration and then run your web app,
5:24 so, all sorts of flexibility here.