Detailed Notes
We continue using the application as a way to track the tasks we have chosen for bug fixing and improving the user experience. This session is aimed at UX improvements.
You can view source for today and all prior days by reviewing the tag Day 52 at this GitHub: https://github.com/robbroadhead/develpreneur-pythontutorial
Transcript Text
[Music] all right welcome back we are cranking our way through our to-do list wrapping up our application doing some uat and things like that finding some bugs along the way so let's start with uh completing a task goes to the edit so for some reason when we click complete on our task list we're going out to edit so let's take a look at task list and what happens when we do complete is it calls complete task with an id and it just comes in and uh let's see it should simply be making a request oh but we do we have a form on here we do not so interestingly enough as it comes through it does a send it updates uh it gets that task it's a display to none and then it just does a return oh which is because it's the i'm sorry that's where our problem is and the problem is because on click we're actually doing a go page and so we would need to do here is because we're clicking the complete is actually within that dip so we need to change essentially where our click is for the edit and so we want to do here is move this click outside of this div and we'll probably go ahead and do it for either of these others so let's just go ahead and say it's either going to be here or here but or due date so if they click in any of these sections but not if they click in the complete button section so if we do that and now reset a complete task goes to edit there we go now what it's doing here is interesting is we managed to lose something what did we lose oh probably because we got rid of the element by task id so we need to do here that id we don't want there i want the id up on the overall we just wanted to move the on click so we move too much that's all right so now um [Music] and we'll just reload it there we go so we're down to 12. so let's go take a couple here oh let's see we had here our about page is broken uh so we need and that was on the login so let's um well we'll log out and we'll see here that we've got about and it's trying to hit about so we can do that fairly easily right we can come in we are going to create an about and we're going to do our about page and we're going to make a view for it and we don't need to worry about being authenticated up in here so he's just going to uh let's just grab do that we don't really have any params i guess oop where is about home oh here we go about page and we're going to render i don't really need to send params and we're just going to do about that html and actually we don't even need to do that uh we're just going to do and we'll leave it like that yeah we'll keep it like that so we're going to do that way we can always add to it later if we want to do something sort of interesting so let's take our now let's take our register page and we're going to duplicate him call him about and so here we're going to leave uh we don't need to do a login and we'll just sort of drag dress this one up a little bit so this is going to be the uh call it the goals manager application we don't need a form we don't need a button and what we're going to do is let's see we'll have let's do a little thing here welcome to the goals oops goals manager version 1.0 [Music] and then let's see oops i should pray spell version right and we'll just say uh check out developpreneur dot com for more information or follow our or let's see our youtube channel and we'll create a link here for our channel uh let's see let's just do it this way we're gonna do it like this and we'll make youtube channel the link and right now we're just gonna do it like this we're just gonna create something simple boom now we have a you know we have an about page we could go to about uh the log out was something we wanted to fix so let's fix that so uh if we go to what was that was that that was an internal let's go look at that guy so about uses base okay so base is here and what we need to do is we need to check if they are logged in or not so we're going to do a little if here and an end if and we're going to need to do based on that is we're going to have an else because what we want to do is they are either going to log out oh internally there oh i'm sorry so this is actually this is only going to show here so it's either home about or register and then this is going to be i believe we call it register uh where did that go i thought we did a register page somewhere oh see oh i'm sorry actually we're good because it's not there it's in the whoa it's in the admin so it was what uh accounts register i believe that's how we set it up so let's take a look back here so we get our home got that register its accounts profile oops and that's not spelled right it is accounts register oh we don't need to do that i guess we just do register there we go okay so now we're gonna be able to register and we've got all of those guys figured out so home about register let's log in and so now we've got to go to our roadmap immediate got our home we've got 12 but we went in and fixed a couple things so uh shows log out when logged out we don't need that and the about page broken we got that so let's do a slimmer display of tasks in the time frame so let's go back over to our time frame and so here like we've got oh yeah we've got tasks are pretty fat so let's try to cut these down to one row and this is going to be in our time frame edit and here so let's see what happens if we just get rid of our line break okay so we shrunk it up a little bit there and let's take that that class is called tasks but let's call it tasks slim and we're going to move our button a little bit we'll push that little further out and here we oh we need to move our on click here as well so it's going to be here so we don't run into issues with a completion there and actually with our task list uh let's see we can take that same thing and we go over here and we're gonna fix our complete button here and let's see we've got it within the div there we go so we'll take that and now we're not going to see our complete if they're already complete on the time frame edit and so now we lost a bunch of stuff so what we need to do is create our slam wherever we put that class class class class class class there task slim so now we want to do and this is something that we've run into this problem before it doesn't always reset stuff properly so we may not be able to see it but we want to look for tat there's tasks and this is going to be tasks slim and we'll base it off of tasks but let's shrink this up a little bit so let's take the padding and cut that down by a lot so instead of two let's go to two and three instead of ten uh the margin bottom we're gonna drop that to 4 margin left we'll leave the margin left and right there [Music] and let's see actually let's shrink this down just a little as well and whoop so we'll have to reload the um reload the style and this thing has been sort of picky about that so let's see if we can get it to work otherwise we have to see it next time actually what we can do there we go so what we're going to do is go to tasks slim which is here we're going to take all of that and we're going to do an inspect just so we can show it let's see inspect here so task slim if we do that and this is going to be this is going to be tasks well okay so second last it so if we do that then it does allow us to slim those things up quite a bit so we will go with that and uh also let's see a description fee oh let's get rid of this so i can read this a little bit better and what did we want to do we wanted to slim that up so slimmer display of tasks there we go so we'll complete it oh we don't have it working right so let's see what did we break there so if we go to time frame edit complete it should be complete task oh we don't have complete task over here so let's go back to that task list and we're going to take that same little script actually we're going to take that and well we'll keep it here i was going to say we could move it up and we might be able to that's something we may want to at some point do is actually take those scripts and and have like maybe a task related scripts or something like that from the javascript side but for now we're going to leave it like this and we're going to come to the slimmer hit complete there it's completed and this is going to look better next time around i promise so that'll wrap it up this time we're getting our our task list down here we're starting to get down uh it doesn't have our account though oh because that's the wrong one so we still got some bugs that we've got to you know work out here but we're definitely getting better and working our lists down and even though we've have added a few as we've gone so that'll wrap it up this time as always go out there and have yourself a great day a great week and we will talk to you next time you
Transcript Segments
[Music]
all right welcome back
we are cranking our way through our
to-do list
wrapping up our application doing some
uat and things like that finding some
bugs
along the way so let's start with
uh completing a task goes to the edit
so for some reason when we click
complete on our task list we're going
out to edit so let's take a look at task
list
and what happens when we do complete is
it calls complete task with an id
and it just comes in and uh
let's see it should simply be making a
request oh
but we do we have a form on here
we do not so interestingly enough
as it comes through it does a send it
updates
uh it gets that task it's a display to
none
and then it just does a return
oh which is because it's the i'm sorry
that's where our problem is and the
problem is because
on click we're actually doing a go
page and so we would need to do here
is because we're clicking the complete
is actually within
that dip so we need to change
essentially where
our click is for the edit
and so we want to do here is move this
click
outside of this div
and we'll probably go ahead and do it
for either of these others so let's just
go ahead
and say it's either going to be here or
here
but or due date
so if they click in
any of these sections but not if they
click in the complete button section
so if we do that and now
reset a complete task goes to edit
there we go now what it's doing here is
interesting
is we managed to lose something what did
we lose oh
probably because we got rid of the
element by task id so we need to do here
that id we don't
want there i want the id up on the
overall
we just wanted to move the on click so
we move too much that's all right
so now um
[Music]
and we'll just reload it there we go
so we're down to 12. so let's go take a
couple here oh let's see
we had here our about page is broken
uh so we need and that was on the login
so let's um
well we'll log out and we'll see here
that we've got about and it's trying to
hit
about so we can do that fairly easily
right we can come in
we are going to create
an about
and we're going to do our about page
and we're going to make a view for it
and we don't need to worry about being
authenticated
up in here so he's just going to
uh let's just grab
do that we don't really have any params
i guess
oop where is about home oh here we go
about page
and we're going to render i don't really
need to send params
and we're just going to do about that
html
and actually we don't even need to do
that
uh we're just going to do
and we'll leave it like that yeah we'll
keep it like that so we're going to
do that way we can always add to it
later if we want to do something sort of
interesting
so let's take our
now let's take our register page and
we're going to duplicate him
call him about
and so here we're going to leave uh we
don't need to do a login
and we'll just sort of drag dress this
one up a little bit so this is going to
be
the uh call it the goals manager
application we don't need a form
we don't need a button
and what we're going to do is let's see
we'll have
let's do a little thing here
welcome to the
goals oops goals manager
version 1.0
[Music]
and then let's see oops i should pray
spell version right
and we'll just say uh check out
developpreneur
dot com for more information
or follow
our or
let's see our
youtube channel
and we'll create a link here
for our channel uh let's see
let's just do it this way we're gonna do
it like
this and we'll make youtube channel the
link
and right now we're just gonna do it
like this we're just gonna create
something simple
boom now we have a you know we have an
about page we could go to about
uh the log out was something we wanted
to fix so let's fix that
so uh if we go to
what was that was that that was an
internal
let's go look at that guy so about uses
base
okay so base is here and what we need to
do is we need to check
if they are logged in or not
so we're going to do a little if here
and an end if
and we're going to need to do based on
that
is we're going to have an else
because what we want to do is they are
either going to log out
oh internally there oh i'm sorry so this
is actually this is only going to show
here
so it's either home about
or register
and then this is going to be i believe
we call it register
uh where did that go i thought we did a
register page somewhere
oh see
oh i'm sorry actually we're good because
it's not
there it's in the whoa it's in the
admin so it was what
uh accounts
register i believe that's how we set it
up
so let's take a look back here so we get
our home
got that register
its accounts profile oops
and that's not spelled right it is
accounts register
oh we don't need to do that i guess we
just do register
there we go okay
so now we're gonna be able to register
and we've got all of those guys figured
out
so home about register let's log in
and so now we've got to go to our
roadmap
immediate got our home we've got 12
but we went in and fixed a couple things
so uh
shows log out when logged out we don't
need that and the about page broken we
got that
so let's do a slimmer display of tasks
in the time frame
so let's go back over to our time frame
and so here like we've got oh yeah we've
got tasks are pretty
fat so let's try to cut these down to
one
row and this is going to be in our time
frame edit
and here so let's see what happens if we
just get rid of
our line break
okay so we shrunk it up a little bit
there
and let's take that
that class is called tasks but let's
call it tasks
slim
and we're going to move our button a
little bit we'll push that little
further out
and here we oh we need to move our on
click here as well
so it's going to be here so we don't run
into
issues with a completion
there and actually with our task list
uh let's see we can take that same thing
and we go over here and we're gonna fix
our complete button here
and let's see we've got it within the
div
there we go
so we'll take that and now we're not
going to see our complete if they're
already complete
on the time frame edit
and so now we lost a bunch of stuff so
what we need to do
is create our slam wherever we put that
class class class class class class
there task
slim so now
we want to do and this is something that
we've run into this problem before it
doesn't always
reset stuff properly so we may not be
able to see it
but we want to look for tat there's
tasks
and this is going to be tasks slim
and we'll base it off of tasks
but let's shrink this up a little bit
so let's take the padding and cut that
down
by a lot so instead of two let's go to
two and three instead of ten
uh the margin bottom we're gonna drop
that to 4 margin left
we'll leave the margin left and right
there
[Music]
and let's see actually let's shrink this
down just a little
as well
and whoop
so we'll have to reload the um
reload the style and this thing has been
sort of picky about that so let's see if
we can get it to work otherwise we have
to see it next time actually what we can
do
there we go so what we're going to do is
go to
tasks slim which is here
we're going to take all of that
and we're going to do an inspect just so
we can show it
let's see inspect here
so task slim
if we do that
and this is going to be
this is going to be tasks well
okay so second last it so if we do that
then it does allow us to
slim those things up quite a bit so we
will go with that
and uh also let's see
a description fee oh let's get rid of
this so i can read this a little bit
better
and what did we want to do we wanted to
slim that up
so
slimmer display of tasks there we go so
we'll complete it
oh we don't have it working right so
let's see what did we break there so if
we go to time frame edit
complete it should be complete task
oh we don't have complete task over here
so let's go back to that
task list and we're going to take that
same little script
actually we're going to take that and
well
we'll keep it here i was going to say we
could move it up and we might be able to
that's something we may want to at some
point do is actually
take those scripts and and have like
maybe a task related scripts or
something like that
from the javascript side but for now
we're going to leave it like this
and we're going to come to the slimmer
hit complete there it's completed
and this is going to look better next
time around i promise
so that'll wrap it up this time we're
getting our our
task list down here we're starting to
get down uh it doesn't have our account
though oh because that's the wrong one
so we still got some bugs that we've got
to you know work out here
but we're definitely getting better
and working our lists down and even
though we've have added a few
as we've gone so that'll wrap it up this
time
as always go out there and have yourself
a great day a great week
and we will talk to you next time
you