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