Python for Entrepreneurs Transcripts
Chapter: Build web apps with Pyramid: Applied web development
Lecture: Register on the site (handle GET section) demo

Login or purchase this course to watch this video and the rest of the course contents.
0:03 Let's come back to our web app and add the ability for people to register for our account. Now, I've done a little bit of pre-work,
0:10 so we don't have to do everything from scratch, I've created an account controller and down here
0:15 I've created the folder, input three entirely empty page templates, or views down here, and I've used our add controller routes
0:23 and registered that controller for all the standard routes that we have for other controllers. Over here you can see we have this /accounts view,
0:33 and we have a /accounts/sign in view. Now, let's do the same for register, so we are going to come over here and we are just going to say register,
0:44 now notice, we are going to have to come back and make a change to this, this is not going to be sufficient for the way we want to write our code,
0:51 technically we could get away with this but we are going to want to add a second method in a moment,
0:56 but let's just start here, this is going to be our, let's just put a note to ourselves, "GET /account/register", OK, let's just make sure this works.
1:09 Here we are in our home page, notice I've added a register option up here
1:13 and if I click it, it just takes us to account/register, hey create an account, so the first thing we have to do is create the form,
1:20 so we are going to go over here to our register page and notice we are using our view layout, our shared layout
1:27 and notice how and completely simple and wonderful this is, this is the full content of this page, let's start by adding a form,
1:34 so remember the form action is going to be empty and the method is going to be POST, it's how we are going to submit the form,
1:41 and then we want to put a couple of inputs in here, so we can have an input of type text and we can set the value,
1:49 we are going to put something here in a minute, we are going to have the input of type, say this is, let's go and give these names,
1:57 so the name, it's going to be email, and this name is going to be password, and this can be confirm_password, something like that.
2:06 Now obviously, we don't want the password type to be text, we want it to be those little dots, that obscures the text that's in there
2:14 so we can do that by putting that to be password type, and then ultimately we want to have some mechanism for submitting this back
2:20 so we'll add a button and you can set the type to be submitted and here we'll just add the message register.
2:27 Now just prepare yourself, this is not going to look very good, it's going to look probably straight out of 1994,
2:33 but we'll be able to apply some styles and techniques to it later when we get to the front-end frameworks to make it really nice-looking.
2:41 So if we refresh the page, we now see this here, so what is this? OK, so let's try to make this little nicer,
2:50 notice that we don't know what's in here, there is a couple of ways we could do it, we could have the text preceding it,
2:56 saying like "email address:" and then put the form, "password:", put the form,
3:00 and so on, or we could make it a little cleaner and try to put this all in one, there are some drawbacks to this but I kind of like it,
3:08 we'll say email address, we could put a placeholder here, and if we do that, when I refresh you can see it says email address
3:14 but of course as you type, it goes away. That's lovely. So let's go down here and put the placeholder,
3:20 and this will be "password" and then this will be "confirm password", like this,
3:27 alright, that's looking good, and now we just need some new lines on it here,
3:33 so everything wraps, like I said, everything is looking straight out of 1994 here, I guess it's not quite that bad, but it doesn't look great,
3:41 maybe we could put just a little bit of padding before we carry on, so I am going to create a class called standard form
3:49 and any of the standard forms we are are going to put padding onto their inputs,
3:53 so let's go down here and say "any time we have a standard form and it has an input", whether that is text or whatever, we are going to put a margin,
4:01 I said padding, but let's put margin of 10 px. Let's do the same for buttons. So we can, remember, this is or if we separate with the comma,
4:10 so if it's contained within standard form and it's input, it has a margin,
4:14 if it's contained within a standard form and it's a button, also this, so let's see how that works.
4:18 Little better, it's not amazing, but it'll have to do. Let's add one more thing here for just the inputs, say the width is going to be 350 px.
4:31 There we go, like I said, not amazing but I think this will totally do for a form, now if we try to register, what happens?
4:38 It looks like it works, we can put something in here and it refreshes and whatever I put in there just went away.
4:44 But it is actually posting back, and being processed, up here, I can show you that, like so,
4:50 if I come over here and do a little print, calling register, remember I've got to rerun this app to see Python changes,
4:57 and we go over here and click it, and see it is calling it but we are not doing anything to get the data, we are not obviously processing anything,
5:07 now we want to get to our GET/POST/redirect pattern.


Talk Python's Mastodon Michael Kennedy's Mastodon