Effective PyCharm Transcripts
Chapter: Server-side Python web apps
Lecture: Creating server-side projects
Login or
purchase this course
to watch this video and the rest of the course contents.
0:00
Let's go and create a web application,
0:02
a server side python based web app in PyCharm.
0:06
Now, just like before I could go and find a folder and drop it in
0:09
here and just start writing code.
0:11
But with the web apps sometimes there's a little more setup and configuration and it might
0:16
actually be easier to start from here to be honest.
0:18
I still often start from scratch if I'm doing something like Flask or Fast API but
0:22
if I was doing pyramid, I would start with either this or maybe cookie cutter
0:26
So we go over here,
0:27
we click new project and then these are service side web apps.
0:31
We could do Django and you can see what's going to create a virtual environment wherever
0:35
we want that to go or pick an existing template.
0:39
And then if you expand out this more settings,
0:41
you can see we could pick the template language to be either Django templates or Jinja2
0:45
templates, name the folder,
0:48
give the application name and decide whether or not.
0:51
To enable the admin backend. We go over to pyramid.
0:54
The settings are a little bit different.
0:56
Same thing virtual environment. But then we give it a name.
0:59
We choose from its selection of template languages,
1:03
Chameleon my favorite. And you can even choose the database back end.
1:06
Is it ZODB, SQLAlchemy or bring your own,
1:10
you know, Mongo DB or whatever you want to write.
1:13
But we're going to do Flask.
1:14
I think Flask is the right mix of really popular and well known and not too
1:18
complicated. So we're going to create one of these and really Jinja2 to is the
1:23
primary option here create a new virtual environment and I've already copied the path into our
1:29
GitHub repository into this web server side thing.
1:32
And let's give it a name,
1:33
first flask or something like that.
1:36
Let's go see what we get.
1:42
Did you see that? It was actually downloading flask.
1:45
So in addition to just creating the files,
1:48
the sort of starter files and start a structure here.
1:50
It also realized that we depend upon Flask.
1:53
So it automatically added that. Let's go ahead and let it add what it thinks
1:57
it needs to run here. So it's created a few things you can see our
2:01
'app.py' this is your sort of Hello World flask app.
2:04
And quite literally it says Hello world.
2:07
And then we have our static folder where we could put stuff like if we wanted
2:10
we could come over here and make a directory called CSS and into the directory
2:15
we could put something like 'site.css' when you create our html templates,
2:21
we're gonna put them over here.
2:24
So let's go out and do that.
2:25
Let's convert this from Hello World to actually use uh template and we can see some
2:30
of the cool features. So notice it's already detected that it's a Flask app.
2:35
If we hit the edit configuration,
2:37
you can see it has certain things like here's the target.
2:40
We're going to use this Flask Environment Flask debug and so on.
2:44
So it's going to use the Flask run style instead of running this app directly.
2:49
Although you could run it with this right here.
2:53
So we go, you can see up here that it shows the settings,
2:56
here's the app, here's the environment and here is whether or not the bug is
2:59
turned on and let's just click it.
3:01
See what we get. Hello world.
3:03
A little underwhelming. Not the most incredible thing in the whole wide world,
3:06
is it? Let's go and actually add something to do with templates.
3:12
Some html because really that's the way things are supposed to be done.
3:16
So first of all this is forward slash(/)
3:18
I like to name this index and just say a little flask,
3:23
something like that. And then we could add some sort of secondary thing,
3:28
but let's just start by having an index or here so we can add HTML5
3:33
call this index. I like this method name to match the file name.
3:37
Right, So we can set the title and let's just go put an H1 its
3:42
capital expand that will say hello to the flask.
3:47
World from PyCharm now over here.
3:52
We need to do something like Flask,
3:56
render template. What are we gonna do?
3:59
We got to give it a template name.
4:01
Right, check this out. I told you there's this cool integration between the template
4:05
folder. If it's marked as a template directory.
4:08
That's the purple in the main framework.
4:10
So I go over here at this command space.
4:13
It auto completes. Why did auto complete?
4:15
Well there's only one option there.
4:17
If I get it to type it out of my type,
4:18
I see it knows into that templates folder that this is the one if there's subdirectories
4:24
it knows about those. So we can come over here make a new directory
4:28
called call this home when you put this in there.
4:32
For example, PyCharm actually automatically did that.
4:39
Re factoring when I did that file move,
4:41
which is pretty awesome. But let's just go and type it again just to see
4:44
what happens. So if I type home then I type this,
4:47
see it auto completes and then right here there's this to allow us to jump over
4:52
there and we can jump back so we can navigate super quick between this view method
4:57
and that. Let's make sure things still work the first time that you run this
5:01
it's going to say we already have this app running you can see is running
5:05
down here, we're gonna have to start over in order for it to take up
5:08
the changes that we did and that's just how python works.
5:11
That's how we can't share port things like that.
5:14
So we'll just help to do this now.
5:16
If we hit this, check it out.
5:17
Hello to the flask world from PyCharm.
5:21
Super. Cool. Right, so we're now using this template,
5:24
The final thing that might be interesting to do here is to pass some sort of
5:28
data. So let's just go over here and put a random number.
5:33
So we'll put a number, this is going to be something from random which we
5:36
can import create a random randint between 50 and 100.
5:43
We'll just say number=num.
5:45
So we'll pass these keyword arguments.
5:47
These will appear over here as variables that we can either work with through python expressions
5:53
or turn into strings. So I'll put a little div and then we'll say your
5:58
number of the day is and in Jinja we do a double curly brace that will
6:04
tell you were about to take a variable,
6:06
it was passed over and turn it into a string.
6:08
What we're gonna do, we're gonna work with number that auto complete all that is
6:12
cool. So let's rerun it again,
6:16
go back over here, refresh Your day,
6:20
your number of the day is 100 incredible.
6:22
You got 93 52 69 59 awesome.
6:28
So is it impressive? No,
6:30
is it a good start. Absolutely.
6:32
The thing I want to have you take away here is this deep integration notice we
6:37
have automatic, we have auto complete for things like four and then I guess maybe
6:43
more easy. See as if we haven't and an end for we have all these
6:48
sort of auto complete type things for the Jinja language which that doesn't make sense what
6:54
I wrote but shows you some Auto complete as well as the fact that this data
6:58
there is being passed over. Notice our variables is num,
7:01
but the keyword argument is number and that's what it auto completed when I typed in
7:06
Super, super cool. So the integration and just getting us off on the right foot pretty awesome.