0:00:25
welcome back guys to another episode of
0:00:28
bill break and fix brought to you by the
0:00:33
one of the frozen raw coder which is
0:00:36
tori and the normal one which is zayn
0:00:39
how are we doing today
0:00:41
um i think tori's gone froze and we'll
0:00:46
wait for him to come back in few minutes
0:00:49
and hopefully it's all
0:00:52
oh he he jumped out
0:01:05
when he comes back up
0:01:14
that's all right oh if you got bullied
0:01:17
that must have been a pretty fast
0:01:20
she came back already
0:01:24
oh yeah it's played the video and then
0:01:27
it's just spinning
0:01:34
well the good thing is that you are here
0:01:40
right so let's play the acknowledgement
0:01:44
and pray our respects to the elders of
0:01:47
the past present and future so
0:01:51
i begin today by acknowledging the
0:01:53
traditional custodians of the land on
0:01:55
which we gather today and pay my
0:01:57
respects to the elders past present and
0:02:00
future i extend their respect to
0:02:02
aboriginal and torres strait islander
0:02:09
that is looking very good how's your day
0:02:13
pretty good pretty good
0:02:15
yeah i'm not choosing
0:02:18
that's what i like to hear
0:02:22
which is great and um got some pending
0:02:25
stuff done as well so
0:02:28
this always makes up for the
0:02:31
productivity of the days in him
0:02:34
and he's stuck again
0:02:39
uh we'll just wait for him to come back
0:02:52
in the meanwhile just to give about a
0:02:54
bit of background of the project we are
0:02:59
say an enhanced version of an open
0:03:01
source project or existing one which is
0:03:05
called strong scrambler
0:03:08
what there is basically a web app kanban
0:03:14
what we are doing is we are
0:03:17
backing it up by persistent storage so
0:03:21
at the moment what's happening is that
0:03:27
so if you if you wanna
0:03:32
get your information back is basically
0:03:36
server and if the service turned off all
0:03:38
the information will go
0:03:40
so what we are doing is backing it up
0:03:45
which means that even if the server is
0:03:48
crashed for some reason
0:03:51
the data will always be there unless we
0:03:54
become bad boys and we delete the data
0:03:59
which is not going to happen obviously
0:04:01
because we're the good guys
0:04:06
tori is back in action
0:04:15
he's like yeah sorry
0:04:23
a little tired today
0:04:26
really had a long day
0:04:34
hey guys only tuesday man just hanging
0:04:37
there hanging there
0:04:38
yeah i'll be i'll be good
0:04:40
yeah i know you will
0:04:51
still got energy for a roar
0:04:56
that's how we like it
0:05:00
what we basically want to do is continue
0:05:10
or was that a sneeze
0:05:13
was that a sneeze or are you tired too
0:05:20
been awake since five so
0:05:32
i've got to keep ourselves hydrated
0:05:36
yeah right cool so uh what we're gonna
0:05:40
be doing today is we will wire up
0:05:46
actually i don't feel like coding today
0:05:50
come front end first
0:06:14
all right let me uh let me share my
0:06:32
okay we'll just wait for him to come
0:06:34
back so he can give me the
0:06:37
power to share my screen
0:07:16
all right columns and
0:07:26
and then we're gonna return this
0:07:41
thank you yeah i wanted to do something
0:07:44
then what i did was i stopped my mic and
0:07:49
cam and thinking that it would give me
0:07:52
an option to show it afterwards but it
0:07:59
go out and then come back in
0:08:07
i was doing when you were
0:08:10
away i was just updating this
0:08:14
function from yesterday
0:08:17
because i just i just thought about it
0:08:23
looked at some other
0:08:26
solutions to compare
0:08:29
equality and javascript and i was like
0:08:32
okay that's that's a pretty good enough
0:08:36
so this i mean this is fine i don't
0:08:38
honestly i don't know what the
0:08:41
the edge case would be where this would
0:08:47
so array called clutter returns
0:08:52
if daisy a probably
0:08:59
what does every do
0:09:01
ah so every is a array method that
0:09:09
the the predicate function this eq like
0:09:19
item in this array
0:09:23
the value that is returned to every has
0:09:26
to be true and if it's not
0:09:30
this returns false
0:09:39
it's a boolean one
0:09:40
yeah and there's another kind of similar
0:09:45
array method called sum
0:09:48
and some just looks for if one of the
0:09:51
values is true then it will return true
0:10:00
so this i was just
0:10:03
simply updating to say
0:10:05
we have our two columns that we're
0:10:08
comparing and then
0:10:10
we just check the length because they
0:10:12
should be of the same length
0:10:15
to be equal we're just checking to see
0:10:16
if these are this the equal
0:10:21
if they're the same length that
0:10:23
that check passes and then
0:10:33
let me rename this
0:10:44
this value will also be the column name
0:10:47
in the previous columns by that
0:10:50
index they should also be equal
0:10:56
because basically we're checking to see
0:10:58
is this the exact same array
0:11:02
so for every value it should be the same
0:11:05
value at the same index
0:11:09
and so that's basically every just
0:11:12
checks and make sure it's always
0:11:17
so this whole function will return a
0:11:22
and it will return
0:11:24
true or false so i can just replace
0:11:39
although the other one worked i just
0:11:41
don't know what the
0:11:44
downside to doing the string
0:11:49
so this will return
0:12:21
perfect so yeah we got that boolean
0:12:26
right so it returns
0:12:49
that can mean many things in programming
0:12:57
good enough for now
0:13:01
i'm just gonna cut this out and put it
0:13:06
in the global scope
0:13:08
because i don't know if we'll ever reuse
0:13:19
okay that's done so
0:13:21
what are we on to next
0:13:24
cool so now what we want to do is
0:13:28
enclose that in a request
0:13:39
that post request will talk to the root
0:13:52
so if they're not equal we run this
0:13:57
so so we're gonna make a new post
0:14:04
um actually won't that be
0:14:14
four things with two things
0:14:22
having four things to do two things
0:14:25
because we are already saving the board
0:14:30
ignore me ignore me i'm not in my senses
0:14:33
at the moment just please continue
0:14:37
so are we gonna make another
0:14:49
i know i know i know
0:14:51
i know what you really want
0:14:56
i know what you really want you really
0:15:04
um i'm just thinking from from a point
0:15:07
of view that if we do make a post
0:15:10
yeah from as in for justin columns then
0:15:14
that would mean basically
0:15:17
just putting the columns
0:15:19
going the back end
0:15:21
and then inserting them in the timer db
0:15:27
doing the other things as well
0:15:32
that's what i'm thinking at the moment
0:15:34
do we really want to do that
0:15:38
what are our alternatives then
0:15:41
our alternatives would be there when we
0:15:47
the board columns are in the board
0:15:52
creation do you mean in the board what's
0:15:55
the board creation
0:15:57
board id board name board
0:16:00
uh board id board name passcode
0:16:09
how does that work when they save it
0:16:20
itself no i mean if they if they update
0:16:24
the columns how do we handle that part
0:16:29
they change the name if they make a new
0:16:33
just update the column array
0:16:37
no i mean and then they click save
0:16:42
like so where are we sending the the
0:16:44
post request or whatever
0:16:47
so that's what i'm thinking that do you
0:16:49
really really need a post request
0:16:51
because we can just include the
0:16:56
columns in the post request when we are
0:17:00
creating the board itself
0:17:05
do you know when we um
0:17:07
we're going to press
0:17:14
do you want to go to the power where
0:17:16
we're hitting the save button
0:17:33
yeah so that's the same button that
0:17:36
we're hitting while i was thinking that
0:17:49
yes is very so it comes down if you go
0:17:56
let me just i don't like that it's ugly
0:18:00
his paws could validate no so that's an
0:18:03
invalid passcode go down
0:18:08
do you want me to liveshare like
0:18:11
actually might as well
0:18:14
then you can code too
0:18:21
running for away from foot today
0:18:39
okay so what's happening in there do you
0:18:42
want to go in there yeah so we're back
0:18:49
the arrays are equal
0:18:55
do back want to go at the top or
0:18:58
as in the beginning of the method i'm
0:19:01
just going to open up the live share
0:19:06
did you send it to me just sent it in
0:19:42
apparently you haven't
0:19:44
given me permissions
0:19:48
apparently you haven't given me
0:19:54
right or am i doing something wrong
0:20:00
ah okay never mind
0:20:12
you have been ignored
0:20:17
wow look at all my buddies they're all
0:20:22
shout out to all you fellas
0:20:27
yeah you can you can read them right no
0:20:29
problem i trust you
0:20:42
this is the array equals so if you go
0:20:49
if array equals that one then this
0:20:51
postpass knows hang on
0:20:56
if array equals this
0:20:58
so we are basically
0:21:01
saving only the notes
0:21:04
and that here right
0:21:13
if the column this is for the columns
0:21:21
basically this just checks if the
0:21:23
columns the board columns have changed
0:21:27
and if they have then what we were gonna
0:21:30
do is send a post request
0:21:33
to update the poor the board columns in
0:21:38
and then just swap the
0:21:41
new columns and make that the previous
0:21:48
yeah that does make sense uh what i was
0:21:52
is the code that's actually saving the
0:21:55
board id board name and passcode
0:21:59
when we are pressing save
0:22:03
is that here as well
0:22:06
well what we do is we the only
0:22:09
the only request right now that we have
0:22:11
when we click save as we validate
0:22:25
i think it was this one that was after
0:22:30
we valid so we validate
0:22:34
um we send this validation request to
0:22:40
we check to see we we get a true
0:22:44
boolean we get a boolean
0:22:48
you know true or false
0:22:51
then we are calling this patch notes on
0:22:59
this loop right now that's all it does
0:23:02
and then for each note we send a patch
0:23:09
so that's what we have at the moment
0:23:13
okay which means that the board is being
0:23:17
created before this as in
0:23:19
so basically what i was after is
0:23:25
ah no that's your method
0:23:33
talking about this
0:23:34
one use your method that you implemented
0:23:40
it's like it's like it's like the lord
0:23:42
of the rings man it's the one ring to
0:23:50
let's bound all the other rings together
0:23:57
you have no idea how tempted i am to use
0:23:59
that now just like just like the just
0:24:02
like the evil ring man
0:24:04
yeah actually still tempted by its power
0:24:10
to focus on that one all right let's
0:24:13
just create a post request forget it
0:24:15
forget it let's create that
0:24:19
the thing is if we make a post request
0:24:21
then we also have to
0:24:23
make a new backend route
0:24:26
yes that's what we didn't want it to do
0:24:29
but i'm like okay that seems to be
0:24:36
there's there's three options i can
0:24:44
use this method yeah i knew you were
0:24:50
which also involves cleaning up the back
0:24:54
there's okay the current we are not
0:24:59
a single step because we are
0:25:05
five more days to finish this
0:25:06
functionality that's it
0:25:08
the other option is to create this new
0:25:11
post request which
0:25:13
involves creating a new backend route
0:25:18
the third option is to include
0:25:29
or post note or figure out some way to
0:25:46
second one is fine just go all right so
0:25:48
create a new route all right yeah yeah
0:25:53
even though i didn't want to but
0:25:56
yeah forget it just do a little copy and
0:26:20
we'll call this post
0:26:33
this is just going to take in the board
0:26:43
we can get rid of all these
0:26:45
do we need the passcode are we sending
0:26:55
i'm really tempted to do one more thing
0:26:57
but no i'm not i'm not gonna do that
0:27:02
yeah but you can tell me
0:27:06
yeah so i was gonna say that with this
0:27:09
post bold columns we can include the
0:27:27
already ready to go
0:27:32
okay post no um and all we got to do
0:27:35
what are we calling it on the back end
0:27:37
do you did we name it something already
0:27:46
actually let me let me keep this for now
0:27:52
what route are we going to send it to
0:28:03
so we're going to make a new route
0:28:05
board columns like this
0:28:12
i really don't want to do this but yeah
0:28:28
we don't need any of that do we need the
0:28:30
board name do we need to send along the
0:28:38
or just the board ideas enough to look
0:28:42
i think poor id should be fine
0:28:44
okay so we can get that from the
0:28:52
or the path i mean
0:28:59
all we need is the do you want to keep
0:29:18
or maybe just columns
0:29:24
sure what's shorter words
0:29:38
let me just call this
0:29:50
and we just await it
0:29:57
can get the response
0:30:03
um do we do anything if there's an error
0:30:06
do we error handle it or anything
0:30:10
we'll probably just sort of try catch
0:30:16
do we have a try catching here
0:30:20
i don't have a try catching here
0:30:24
but actually i don't think it matters
0:30:28
um because nothing in here is actually
0:30:31
sending the request
0:30:35
this is um so this returns the status or
0:30:39
so if it's undefined do we
0:30:41
send a message or something
0:30:46
if there's an arrow it would just
0:30:49
basically show up the prompt
0:30:55
which one the toast message
0:30:58
oh man where is that
0:31:06
toast message or alert and it'll come up
0:31:12
i don't think i made it global
0:31:16
all right yeah i can make this global
0:31:23
yeah might as well
0:31:37
where to throw this junk
0:31:42
it's like my drawer
0:31:44
i open my desk drawer
0:31:49
just talk control find and it will come
0:31:53
that's a little quick no i mean i'm just
0:31:55
looking for a place to dump it
0:32:03
yeah right at the top and then
0:32:10
leave it with all the rest of the global
0:32:26
back to where we were
0:32:30
oh wow jeez where is this thing
0:32:33
it's easy to get lost in here
0:32:51
then we're gonna call that
0:33:19
you know what i think there is one tiny
0:33:24
um which is i don't think it will show
0:33:30
yeah because you got to call this like
0:33:34
probably do a return
0:33:38
is this a global mess method
0:33:41
yeah i think it is it must be
0:33:44
where does this even come from is this
0:33:47
kind of maybe this comes from script j
0:33:48
yes yeah it's coming from there
0:33:55
it's not yes it's coming from there
0:34:07
oops i'm going the wrong way
0:34:10
the map is saving me on the side little
0:34:13
green lines so we can probably do
0:34:17
first and foremost and if it fails we
0:34:22
return it and not go
0:34:40
function yes so do a
0:34:42
return before settler alert message so
0:34:52
it will return you the prompt itself
0:34:56
and just come out oh but we need to um
0:35:00
open alert what is it alert open
0:35:09
i mean before we so
0:35:12
all right right so in the topia only
0:35:15
setting the text of it
0:35:20
it's actually i think changes the css
0:35:24
class name or something
0:35:26
that's brilliant work though
0:35:30
making the props dynamic
0:35:36
yeah oh yeah good for toast messages and
0:35:38
stuff so this will exit out uh yeah
0:35:45
here little exit out of this block of
0:35:51
all right it should exit out completely
0:35:57
i think it would exit out completely
0:35:59
because we're doing a return and it will
0:36:02
just take us back to the app itself
0:36:11
i think it will because there's a nested
0:36:16
it will take us back to the outer scope
0:36:22
okay how about if we have a
0:36:25
try this and have a look
0:36:28
oh no that's not gonna work because oh
0:36:33
it will work because it'll fail we'll
0:36:35
see if the ui opens yeah
0:36:37
oh yeah yeah cool okay
0:36:44
okay i'm gonna go into stream again
0:36:58
face code remember
0:37:03
do you use two monitors or just the one
0:37:06
uh for the stream it's only one but
0:37:11
oh yeah i i use two when we're streaming
0:37:16
usually you don't see me looking at my
0:37:20
because i got the stream over on my side
0:37:34
uh what is it that's dev test
0:37:39
this one has stuff
0:37:45
create the columns
0:37:58
oh oops i need to enter the right
0:38:03
too fast is it just one two three four
0:38:21
see what happens oh here we go
0:38:23
balls and notes saved successfully
0:38:27
did even go in that method
0:38:34
filter the resource index
0:38:39
oh it did say true
0:39:02
it won't come in there
0:39:15
because it's comparing
0:39:19
two different arrays
0:39:24
and one that's on screen at the moment
0:39:31
uh we haven't hooked that part up yet so
0:39:34
the columns already existed in script.js
0:39:38
and i created another
0:39:42
global variable called prev columns
0:39:51
the only time preview columns ever gets
0:39:53
updated is when we set it here
0:40:01
um uh okay so ensure it would he should
0:40:06
sure in there yeah
0:40:08
so i don't know why i didn't
0:40:11
do you wanna maybe console.log it and
0:40:15
if the quantity print is not equal
0:40:21
wouldn't be equal now
0:40:27
because it should be
0:40:28
comparing an empty array
0:40:35
so maybe my code is not good
0:40:40
why wouldn't i save successfully
0:40:46
the array did come
0:40:51
uh what what array
0:40:57
and i think to be honest ignore me
0:41:00
um not fully present
0:41:06
did he sh did he show the error
0:41:09
no so i guess i made a boo-boo
0:41:18
if they're the same
0:41:21
blank if column length
0:41:36
hey geckdev how are you thanks for
0:41:54
which is what we had
0:41:59
yeah okay then just lack of water i
0:42:30
are you sure that every is being used
0:42:36
so what you are saying there is if
0:42:40
columns length is equal to
0:42:48
if this is true and
0:42:59
um i can't see probably yeah
0:43:10
call names and index so
0:43:12
for each column name
0:43:18
check if the column
0:43:21
that column name is on in the previous
0:43:30
in the columns array
0:43:33
the same as the previous columns
0:43:38
index of that column yeah
0:43:45
then give us both true
0:43:52
do you want to maybe um i'm gonna test
0:43:54
it right here yeah i was gonna say that
0:44:02
all right so we know this should be true
0:44:09
now this should be false
0:44:24
do you wanna maybe console what comes
0:44:28
as a result of the condition
0:44:37
so if you go back to the code
0:44:40
where you were using the every method of
0:44:52
if i have if they're not equal
0:45:00
is that doing something weird
0:45:04
so you're checking here that if all the
0:45:09
in the columns array and previous
0:45:11
columns are not equal
0:45:15
it should be they should be false if
0:45:22
if they're not the same
0:45:24
see if uh if you don't mind i'll just
0:45:36
i'm tired false false
0:45:56
did we get anything
0:46:06
should not happen is saying something to
0:46:10
do with the object
0:46:12
it says index.html at one
0:46:30
all right let me um
0:46:33
look at this columns
0:46:51
but i don't see i'm a little teapot
0:46:59
um probably it's not coming in there
0:47:04
yeah i don't think it is
0:47:07
so how did previous columns get updated
0:47:21
are you sure that our arrays are equal
0:47:28
uh yeah we we looked at it here
0:47:32
so we can we can actually test it right
0:47:36
all right and then we have columns
0:47:40
and preview columns
0:47:42
which are true because they are the same
0:47:49
and now they should be false
0:47:57
can't do that like that i gotta
0:48:01
so let me let me let's just compare to a
0:48:12
so we want this if it's false
0:48:16
then this should it should hit it
0:48:21
do you want to put that to true
0:48:24
it should come because that can confirm
0:48:26
there's something is wrong in the
0:48:31
right array equals method
0:48:40
because if this shows a console log then
0:48:44
that means that our condition isn't
0:48:46
doing what we wanted to do
0:49:06
proof columns is empty to start
0:49:14
i don't know if you're going to see that
0:49:15
on my screen i just wanted to
0:49:23
let's create some columns here
0:49:27
just want to see please call
0:49:30
oh proof columns got updated why that's
0:49:34
that's why it's not working
0:49:37
proof calls should not be updated though
0:49:42
columns should be updated not proof
0:49:47
yeah i don't know why prove cons
0:50:09
and i would work if it wasn't an array
0:50:12
so i wasn't thinking
0:50:14
but it's it's it's memory passed by
0:50:17
reference so it's not making an actual
0:50:23
but in this case i don't even know why i
0:50:24
did that doesn't matter
0:50:27
all right now this uh oh we gotta go
0:50:32
change make that false
0:50:37
change it back to them uh exclamation
0:50:54
one little slip and it's all over
0:51:02
now i got pie all over my face
0:51:12
i don't even know where that came from
0:51:19
yeah so it's coming in the manual i'm a
0:51:26
all right board id is not defined yeah
0:51:33
all right this is this is working
0:51:37
you know we should sense we should hide
0:51:45
there you go can you find all the
0:51:56
like if you click on something in the
0:51:57
corner there's like a little teapot that
0:52:02
or whatever you want your imagination
0:52:10
absolutely all right we can save this i
0:52:16
all right my job is done it's your turn
0:52:33
we on the right yep we are add
0:52:48
to be honest he's just let's just spend
0:52:54
having the chatter right here
0:52:57
actually yeah why not
0:52:59
is that is that what do you call that an
0:53:02
aussie a little chat
0:53:04
you have a slang for it or no
0:53:23
let's have a coffee
0:53:27
means what's happening yeah coffee
0:53:34
i'm surprised it's not it's not
0:53:37
it's coffee it's not
0:53:39
it's not a beer or something bear
0:53:42
beer o'clock okay yeah
0:53:47
beer clock is also like let's get
0:53:49
together and drink
0:53:53
we we have that in the u.s too
0:54:02
when i first came to
0:54:04
australia they were
0:54:06
calling it barrel clock and i was like
0:54:10
what's that we gather all the clocks and
0:54:12
put the bears on it
0:54:14
and everyone just cracked up
0:54:23
know it's more of having having
0:54:31
it's time to open up a bear and i was
0:54:33
like oh bear o'clock yeah it actually
0:54:36
makes much more sense
0:54:41
what do you guys say in us
0:54:46
for having a chat or having a beer we
0:54:48
have a beer o'clock
0:54:54
yeah we have beer o'clock
0:54:56
there's a lot of drinking in the u.s so
0:54:58
yeah there's a lot of
0:55:01
discussion around drinking
0:55:10
having a chat i don't think we have a
0:55:12
particular slang that i can think of off
0:55:14
the top of my head
0:55:18
but you guys have a an aussie
0:55:21
seems like there's slaying for
0:55:28
slang for if you want to go for a smoke
0:55:31
a short really short break there's slang
0:55:40
each other's names
0:55:51
we did it we ran out of the clock
0:55:55
we ran out of time we were really having
0:55:59
good speed everyone was focused and
0:56:04
all right so today we finished up a bit
0:56:07
more of the front-end code
0:56:11
uh post request to the back end
0:56:14
and in the next episode
0:56:20
do that and i'm not gonna be there it's
0:56:22
gonna be on using internet
0:56:29
no problemo all right
0:56:33
guys want to have on
0:56:35
join us more enthusiasts more enthusiasm
0:56:41
i don't know what's happening
0:56:47
if you guys want to join us um
0:56:56
alright guys thanks for joining and if
0:56:58
you want to see how
0:57:00
we do the next part of the task feel
0:57:03
free to join us yes same place
0:57:08
and a different time
0:57:12
same time same day
0:57:15
same time what i forgot completely
0:57:21
same place same place and a different
0:57:24
there we go have a great night
