0:00:26
to another session of buildbreaking fix
0:00:28
brought to you by the raw coders
0:00:31
exclusively today how we do know
0:00:36
pretty good i guess
0:00:41
sorry about for the last two days i
0:00:43
haven't been able to come on and um yeah
0:00:47
just some work priorities and really
0:00:51
long hours but now i am back and
0:00:56
um ready for some action all right cool
0:01:01
let's get the party started by
0:01:09
owners of the land and the
0:01:13
elders of the past present and future
0:01:15
alright so here goes
0:01:22
i begin today by acknowledging the
0:01:24
traditional custodians of the land on
0:01:26
which we gather today and pay my
0:01:28
respects to the elders past present and
0:01:31
future i extend their respect to
0:01:33
aboriginal and torres strait islander
0:01:40
all right guys that was
0:01:45
um so i hope you're already liking the
0:01:48
background music as well
0:01:51
you might be observing that it's just me
0:01:55
the super rural which is
0:01:57
the tory um he will be coming and
0:02:00
joining us he will just getting ready
0:02:03
with laptop firing up and all that
0:02:06
technical bits to get started
0:02:11
while he comes on to um
0:02:18
i'll just take you through as in what
0:02:21
we have been on the project
0:02:24
what we have been doing
0:02:26
etc so the project is actually a
0:02:33
and it's actually an open source project
0:02:37
but we're actually um adding persistent
0:02:43
and if you don't know what persistent
0:02:44
storage is it's basically
0:02:47
permanent storage which is kind of
0:02:54
that kind of storage all right
0:02:56
and the whole purpose of that is to
0:02:58
basically um when the user enters data
0:03:02
at the moment is not really being stored
0:03:05
um in persistently uh in the existing
0:03:09
open source project
0:03:10
which is by the way called scrumbler
0:03:17
just making sure that if the user
0:03:19
stores the data and they want to go back
0:03:26
maybe after say few months
0:03:29
a few years few days
0:03:31
a few weeks they can easily get to it
0:03:35
we're also adding some a really
0:03:39
mini function uh additional
0:03:44
um basically i'm adding
0:03:55
very good tori how are you doing
0:03:58
good man i i just got back from
0:04:01
vacation earlier today
0:04:06
it was it was nice i i like i love that
0:04:09
i love that place that we went it's
0:04:12
beautiful view should have just stayed
0:04:15
i would i would i totally would stay
0:04:21
just imagine you have kind of
0:04:24
a passive income and
0:04:26
you're i sing on the beach having a bear
0:04:32
curling along how would that feel
0:04:35
that's great i mean uh
0:04:38
the beach is very tiny near that place
0:04:41
but it's all right
0:04:43
it's very it's very it's like
0:04:46
you know other parts of bali it's kind
0:04:49
but in that place you can actually swim
0:04:51
because the waves are pretty calm
0:04:53
and it's not so much coral
0:04:58
ah okay yeah that's pretty good though
0:05:02
yeah yeah and then there's this amazing
0:05:06
from the from the hotel
0:05:14
i'll go there yeah you should totally
0:05:17
i think they're um
0:05:19
i think the plan is to
0:05:24
have the visa on arrivals
0:05:32
sometime in the next few weeks or
0:05:35
because they haven't had they haven't
0:05:43
that would make sense
0:05:46
especially if the country
0:05:52
that's how i feel good i'm tired i'm
0:05:57
yeah true i know that feeling now
0:06:00
yeah i think they would be good
0:06:02
especially if they're con
0:06:04
whoever the country is as in
0:06:08
whatever the country
0:06:14
increase their funding
0:06:18
in incoming i i think having tourists
0:06:22
there um would really boost up for them
0:06:31
cool so i've already done the
0:06:35
of the country and it's really good to
0:06:37
have you back which is fantastic good to
0:06:39
see you too thanks for having me
0:06:42
i hope you feel better
0:06:49
we miss you man uh but health com health
0:06:53
always comes first so
0:06:55
take rest as much as you can and feel
0:06:58
free to come back whenever
0:07:07
uh where we are in the project at the
0:07:09
moment is we are basically implementing
0:07:11
the passcode functionality
0:07:16
would be just bits and bytes to make the
0:07:18
ui as in the boards page look a bit more
0:07:22
presentable if you know what i mean
0:07:28
um the boards page huh
0:07:33
the board page and i think this time is
0:07:35
my turn to share screen so i'll get some
0:07:38
hands on in front end
0:07:54
let's get the party rolling
0:07:58
it's like the most elusive
0:08:12
now would you like to oh it's asking
0:08:17
to be updated yay after something today
0:08:23
so um what did you
0:08:26
what did you guys do
0:08:28
earlier in the week um i think i missed
0:08:31
maybe a stream or two or did you know
0:08:35
there were no streams for
0:08:48
my brain would not be there at all and
0:08:53
it's understandable
0:08:57
that is the thing but now we're back on
0:09:02
uh connects websock
0:09:06
i'll just shame my screen in a bit um
0:09:11
kind of go to the right
0:09:39
connect web socket device settings
0:09:49
wasn't pause code uh
0:09:51
in the front end isn't it
0:09:56
i'm just i'm just talking as in thinking
0:10:01
what was the question pass code uh yeah
0:10:04
passcode hyphen gui
0:10:17
yeah so i have just actually
0:10:20
uh i'm gonna switch
0:10:30
oh because i've got pending changes in
0:10:32
my websocket you're at the that's why
0:10:35
it's not allowing me to open it
0:10:42
what pending changes ever go
0:10:45
you why am i not sharing my screen now
0:10:48
oh yeah sorry i was gonna say that's bad
0:11:16
you can't see my code
0:11:19
i said code police they're coming
0:11:34
before they come here
0:11:38
all right so what did i do chain
0:11:41
what did i change in this
0:11:44
just added a line basically
0:11:46
an empty space wow that's a big change
0:11:52
maybe you were trying to test something
0:12:02
all right so going to switch
0:12:05
yeah maybe it was the github actions
0:12:08
thing maybe that's what
0:12:15
anyway that is done so i will just um go
0:12:18
on live server and see how we go from
0:12:50
um what do you have in there
0:12:56
you need the dot you need the dot
0:13:03
oh okay yeah actually sorry i don't know
0:13:08
it's all right no problem
0:13:11
we will figure it out
0:13:13
not too buddy my friend
0:13:18
so i'm trying to access it from there
0:13:22
so if i actually do a cd don't client
0:13:27
live server then ah there we go
0:13:31
so i had to come in in the client folder
0:13:41
um i'm just thinking how can we
0:13:49
so this is there this is the
0:13:52
oh yeah uh after this i forgot that
0:13:55
after this show on tuesday
0:13:57
i updated the ui a little bit
0:14:03
because i remember thinking about it
0:14:07
and so i figured i'd just update it
0:14:17
as in i was actually
0:14:20
wondering hang on this is not the way i
0:14:23
left it as in this was apparently
0:14:28
but this is really good work though
0:14:35
um hopefully it's good enough for now
0:14:39
yeah yeah for sure
0:14:42
all right cool so since this is all
0:14:45
right which is fine i'm just
0:14:48
saying oh this is a local host
0:15:08
do we have github actions on here
0:15:12
i don't know if we have github actions
0:15:18
uh let's have a look
0:15:23
see it in my file my folder structure
0:15:27
wait oh but i'm inclined that's why so i
0:15:38
anyways um and also it's um
0:15:44
the way it's configured
0:15:47
right now it's only gonna
0:15:52
s3 on the main or websocket branch so
0:15:57
like it's something we can just if you
0:15:59
want to add more branches you can add
0:16:01
more brand or you can just add any any
0:16:05
but i guess that doesn't
0:16:07
make sense if it's like okay so the
0:16:10
github actions are uh
0:16:14
kind of on branch level
0:16:17
oh yeah you have very you can set very
0:16:20
fine grain granular control over
0:16:25
stuff happens and what happened and like
0:16:43
all done you probably have to merge
0:16:48
passcode ui is there as well
0:16:55
continue locally for now and then oh
0:16:58
that we cannot probably do the merge
0:17:05
actually it might be a better idea if
0:17:07
you do that much because
0:17:09
my stuff is your code
0:17:16
i guess i don't know
0:17:17
yeah i don't know because
0:17:19
you mainly worked on
0:17:21
websockets okay all right
0:17:34
the reason why i said it because it
0:17:37
might take if you would take you say
0:17:43
half an hour max it might take
0:17:46
me probably at least three to
0:17:49
four hours because sure i'm happy to do
0:17:51
it i just hope i hope there's no like
0:17:55
big merge conflict or something
0:18:01
in that case how about if we
0:18:05
a time and then we can
0:18:08
go through it for the most together
0:18:12
fantastic or if i can just contact you
0:18:15
if there is a merge conflict that's fine
0:18:19
you yeah you want you want to merge
0:18:22
um websocket into main
0:18:36
first is dev and we merge it with
0:18:41
how uh everything is working on
0:18:45
dev if it's working fine
0:18:47
then we move from dev to master or main
0:18:54
all right cool so in in that case we can
0:18:58
just basically continue on the get board
0:19:07
how would the get bored functionality
0:19:11
the user will give a
0:19:15
a board a board name
0:19:22
are you there tori
0:19:23
yeah i'm listening okay so a user will
0:19:27
give a borden board name
0:19:30
and i'm thinking and i don't know how
0:19:48
you know the drill
0:19:53
exists already then this
0:20:01
oh so if it finds a board
0:20:04
it'll get the board
0:20:07
yes so say for example saying
0:20:11
testing already exists
0:20:14
then this will appear as get get
0:20:23
how won't that conflict with the
0:20:26
the other pop-up that says this board is
0:20:38
step as in as a part of um
0:20:42
get board functionality so
0:20:45
go button turns into a get
0:20:49
we would check that if
0:20:51
the call was pressed by the get button
0:20:56
we will be by passing that pop-up
0:21:00
if that makes sense
0:21:03
okay so they're gonna
0:21:05
search for a board
0:21:08
with this go button
0:21:10
and then if there's a match
0:21:12
it'll turn into a get button
0:21:19
when they student types it
0:21:23
it would kind of be an autobind
0:21:27
if that makes sense
0:21:29
what do you mean by that
0:21:36
we oh sorry my bad no sorry i don't know
0:21:39
anything about anybody
0:21:42
i think it's either called autobind or
0:21:46
so basically what happens
0:21:48
is that see if these are two components
0:21:52
and then this is a person and that this
0:21:56
this is a text and if you want to change
0:22:02
this to anything else
0:22:04
based on what's here
0:22:07
then it would basically be
0:22:09
like if zayn is testing and if it's all
0:22:14
present in the database then this
0:22:19
change into a get button
0:22:22
as as they're typing
0:22:27
so when they're done typing
0:22:36
and how hard would that be
0:22:39
i've done it a billion times
0:22:48
i can't say it's the perfect d-bounce
0:22:51
function but i can write a d-balance
0:22:53
function pretty easily now
0:22:56
right ah yeah i mean have you got any
0:22:59
suggestions how we should
0:23:06
if we look at the code
0:23:14
what is it did i rename it
0:23:16
or what is it named i think there's a
0:23:27
so inside the function create new board
0:23:32
there's a way to get board names on line
0:23:41
queries all the board names from the api
0:23:45
yeah and right now if there's a match
0:23:48
then it opens the alert
0:23:52
so if you wanted to
0:23:59
while you're typing
0:24:02
we could move this function
0:24:14
like an event listener
0:24:18
instead of doing that can because i
0:24:22
don't really want to touch the
0:24:26
database as in that
0:24:29
kind of constantly so what i was
0:24:32
basically had in my mind
0:24:46
we get all the ball board names in the
0:24:48
background okay and then we
0:24:54
sure so that's that's even easier then
0:24:58
so we can just move this
0:25:04
out of that function we can just
0:25:10
cut it and then move it into
0:25:15
on load functions somewhere down there
0:25:27
do one want to see your screen
0:25:30
uh yeah sure i can um
0:25:33
i'm just i'm looking for the code where
0:25:37
where the place is i haven't looked at
0:25:38
this code in a while so i'm like
0:25:43
oh okay code code amnesia
0:25:57
so we have this like
0:26:00
uh can you can you add my screen
0:26:02
oh yeah i just is sorry i need to
0:26:06
improve on this habit
0:26:09
um so we have this ad
0:26:13
um so when we land on home
0:26:21
we want to have like some stuff happen
0:26:23
then because i guess right now we don't
0:26:25
have anything except we add some event
0:26:32
all right so that just listens for that
0:26:36
event listeners so i can make another
0:26:43
um unless you want to type man
0:26:45
i don't want to take all the coding all
0:26:54
so it has been a while that i've touched
0:26:56
front end as in of
0:27:00
so i really want to get in to that as
0:27:06
the pattern i used for the last one
0:27:13
671 is like i made a function called
0:27:18
and so we could just make what i was
0:27:21
thinking is just make another function
0:27:23
called load home page and just put
0:27:27
whatever stuff you want to happen
0:27:30
when you load the home page
0:27:34
and then we'll just we'll just attach it
0:27:43
production environment and
0:27:45
local dev environment in the right
0:27:47
places and that way
0:27:50
um everything that you want to happen
0:27:52
will just happen when it hits that route
0:27:55
and then it'll add the event listeners
0:27:58
go fetch the board and that's pretty
0:28:00
much it pretty simple
0:28:02
okay so we're adding it
0:28:07
as in beginning with 79.
0:28:14
you can make a new function
0:28:17
i would make so if it was i would make a
0:28:19
new function called load
0:28:26
okay let's do that right at the bottom
0:28:33
yeah we can always move it
0:28:46
oh it's been a while
0:28:48
it feels good though right
0:28:53
one home page mode
0:29:07
how are we gonna do
0:29:14
all you need to do is just
0:29:16
um from the create
0:29:20
boards function on like
0:29:24
line hold on sorry there's a
0:29:34
are you done are you done
0:29:40
he understands you look at that
0:29:45
he he was rude he ignored me because i
0:29:49
so all you got to do is cut line 26
0:29:54
that's all you need to do is cut line 26
0:29:56
and just throw that down in in the
0:30:00
the function you just made
0:30:05
and now you can just hold
0:30:08
yeah so now you you'll have all the
0:30:10
board names on page load and it's stored
0:30:13
in that board names
0:30:16
variable which which is a global
0:30:20
so it's it's available in the global
0:30:22
scope and i think it should work
0:30:27
like you can you can test that the
0:30:30
alert still pops up if you enter a board
0:30:33
with the same name
0:30:38
um i think where you want to add that
0:30:48
you want to add that on
0:30:59
i don't know why i have them do
0:31:01
duplicated but i do ones for local ones
0:31:05
production probably don't need
0:31:12
yeah wherever it says home.html right
0:31:23
page home page load
0:31:30
this is all brand new to me to be honest
0:31:38
the front end in a probably not a great
0:31:40
way but it does the job
0:31:48
i did one bad thing
0:31:55
i didn't create a branch
0:32:00
you can still do it now
0:32:03
yes that's what i'm going to do but in
0:32:05
order to do that i need to undo all the
0:32:07
changes first no you can you can just
0:32:10
check out can't you
0:32:13
ready yeah you can just check out
0:32:33
oh okay i didn't know that interesting
0:32:37
yeah and it just brings any changes with
0:32:39
you i know i've done that so many times
0:32:44
thank goodness that works
0:32:49
okay that one is there
0:32:52
we needed that one
0:32:59
uh environment yeah oh
0:33:02
and that one yeah i don't know
0:33:04
i probably probably don't even need
0:33:07
those different ones but i guess there's
0:33:10
good practice though to be honest
0:33:16
oh okay i just hate
0:33:18
duplicated code i hate it
0:33:22
i'm not the only one trust me can't
0:33:29
okay cool so if that would work that
0:33:31
means that on page load we would have
0:33:37
in that variable yeah
0:33:40
so let's check that
0:33:49
don't try this with me again
0:34:02
i did type it right
0:34:04
client on the actually
0:34:07
or hard refresh it or not
0:34:11
it doesn't want to do it
0:34:16
save all the changes
0:34:22
where can i save all
0:34:24
actually i don't even need all these
0:34:29
i hate an additional open file
0:34:33
just keeps it really
0:34:53
why are you doing this to me
0:34:57
why do i want it actually yeah i want
0:35:00
home to destination
0:35:06
right this is not found
0:35:11
is that even there
0:35:16
on the html this is there
0:35:25
am i doing something wrong
0:35:53
okay that's your folder
0:36:07
okay so that should come
0:36:10
why am i checking if i haven't even
0:36:19
you know actually you don't have to i'll
0:36:20
show you a way you don't even have to
0:36:27
kill um what was there there was an
0:36:30
error uh it's syntax error
0:36:34
that always are only valid
0:36:37
functions and on top left level i'm a
0:36:43
wine is code in the front and more to be
0:36:50
saying that a weight is only better in
0:36:57
oh the awakening that's why that's why
0:37:01
um i don't you don't actually need to
0:37:04
wait for it it'll be fine
0:37:09
i'll just be stupid but you can't you
0:37:12
can change it to anything if you want if
0:37:14
you want to await there that's that's
0:37:16
fine it won't hurt i don't think
0:37:22
changes and more changes
0:37:27
all right let's check out this beast
0:37:31
come on dude don't play around with me
0:37:40
what about just hitting the back button
0:37:43
huh that's weird i don't know why it
0:37:48
it's in the backbone
0:38:18
so we need to check
0:38:21
it for the board names so there's a very
0:38:24
just type in the dev tools board names
0:38:27
because it's a global variable so it
0:38:28
should be available there
0:38:32
i didn't know this
0:38:34
look looks like it loaded all the board
0:38:37
yeah which is fantastic
0:38:40
okay so it's loading all the board board
0:38:44
now basically we're going to take this
0:38:56
compare it with any of the ones that are
0:39:02
right now before you move on to that
0:39:05
if you type if you type in test board
0:39:08
all lowercase do you get the pop-up
0:39:12
hopefully that's not broken and
0:39:20
yeah how about that
0:39:22
um i wasn't hoping this would stop me
0:39:38
he's just giving me this
0:39:44
cannot read properties of undefined
0:39:47
reading for each for each
0:39:50
for each underfund and get valid
0:39:53
that's probably something i did probably
0:40:01
did you fetch all that you did fetch the
0:40:08
go as a bad person
0:40:10
push some broken code
0:40:22
pose again cannot be properties of when
0:40:24
the point for each get valid
0:40:27
i guess it's coming from here
0:40:45
online 581 it's supposed to return
0:40:48
passcode and it doesn't
0:40:55
supposed to return it back from that
0:40:58
ah right right i see i see
0:41:03
i think it's the next line
0:41:06
the one below it on 581
0:41:13
i think that's the problem
0:41:25
that's weird i thought i tested it
0:41:34
before each still an error oh i'm
0:41:47
so in in get valid password
0:41:51
you're supposed to pass in the form data
0:41:54
yeah that's what i'm thinking uh in
0:42:07
that was the night when i was doing like
0:42:09
really weird stuff so it makes sense
0:42:12
yeah true true don't
0:42:15
i mean i do these kind of mistakes
0:42:24
it can't be fixed no big deal
0:42:28
so and there if you just pass in the
0:42:31
form data it should work
0:42:36
you probably should rename those
0:42:38
variables but yeah that should work
0:42:43
what's it doing um
0:42:52
submitting it and then preventing the
0:42:58
setting they've been target
0:43:04
yeah and it's passing that
0:43:06
even from the form
0:43:09
and then what's it doing is
0:43:12
yeah about the password
0:43:15
yeah it's looping over each input
0:43:22
and getting the password
0:43:24
um from each input field
0:43:27
and then it's just returning the
0:43:29
password i kind of like refactored the
0:43:31
code after i refactored some of the css
0:43:38
that's good yeah i don't know maybe i
0:43:40
made it worse because it's broken
0:43:44
that's not really a refactor
0:43:48
con's passcode and then you'll
0:43:51
gain the valid passcode from the form
0:43:53
data which is here
0:44:13
fix my own problem
0:44:15
you fixed my problems man good job thank
0:44:19
what a weird night
0:44:23
okay so board already says please enter
0:44:25
another one okay cool
0:44:27
so now what we need to do is basically
0:44:45
type if we don't change this button
0:44:49
get that probably should have mattered
0:45:03
go that would mean that
0:45:05
we won't see this anymore
0:45:10
oh um we will but it will be
0:45:14
like a board already is this if this is
0:45:18
you your board please enter the passcode
0:45:23
and then get the board
0:45:30
what do you reckon i mean i think
0:45:36
if there's a get bored feature and a
0:45:38
create board feature
0:45:40
i think there should just be
0:45:45
in the ui you can click on like like
0:45:47
kind of like a login where you have like
0:45:53
get a board form and like you can put
0:45:56
them both on the home page
0:45:59
but like you know how you have like sign
0:46:03
yeah yeah yeah right yeah but like
0:46:06
they're only one form you don't see both
0:46:10
personally i think for the users using
0:46:15
be less confusing for them because they
0:46:17
would just go click on whatever
0:46:22
whatever tab makes sense then it can
0:46:24
just default to the create a board page
0:46:30
they just click on a tab like get a
0:46:32
board and then it shows
0:46:34
basically it's the same form we just
0:46:40
and then just change the words from go
0:46:42
to get and instead of name your new
0:46:46
get your board by your name get the
0:46:53
so essentially what your
0:46:57
i've understood which say in two ways so
0:47:01
the first is that we create
0:47:12
so the first one would be is that we
0:47:21
at the moment all right
0:47:26
this is basically a line in the page
0:47:31
ah come on no i'm not expecting anyway
0:47:40
thing that's saying
0:47:42
create a new board and then this can be
0:47:55
i was thinking you just have like um
0:48:00
a a tab a tab like you know like
0:48:05
folder tabs button tabs like you just
0:48:09
on oh right right i see i see yeah so
0:48:13
you just have like you land on the
0:48:17
by default the tab that's selected is
0:48:20
create a board but then there's button
0:48:24
get a board or like
0:48:32
get an existing board right
0:48:35
yeah yeah i think i know exactly what
0:48:39
so basically in this way so it's
0:48:47
these are the tabs so
0:48:56
yeah yeah basically yeah exactly and
0:49:03
and honestly we don't even have to
0:49:07
recreate the javascript or i mean the
0:49:09
html we can just change everything in
0:49:12
javascript i guess
0:49:21
or we could just make
0:49:32
on home but it's hidden until you click
0:49:34
the tab so one way is more
0:49:37
javascript intensive which is good and
0:49:40
bad depending on how you look at it the
0:49:42
other way is just like duplicating some
0:49:45
html code which is totally fine
0:49:49
that's probably easier honestly to just
0:49:51
duplicate the form
0:49:56
if it wasn't react or some other
0:50:00
it's really easy to just change the
0:50:06
well that's why we use frameworks right
0:50:20
oh i should do that to be honest i have
0:50:23
no idea about the css
0:50:27
oh we can't potentially there must be a
0:50:32
or we could use bootstrap
0:50:36
to do that we could have used bootstrap
0:50:39
for the whole project
0:50:40
we're gonna bring it in
0:50:45
okay so now that we um we know how to
0:50:48
deal with this one let's jump back
0:50:52
to that one and organize those things
0:51:00
what we basically want is
0:51:10
and the same as that one as an over tab
0:51:15
but that would have a
0:51:17
get functionality and this would have a
0:51:26
let's get the party started um
0:51:41
i sent a i sent a link we can just
0:51:45
copy it from css tricks
0:51:50
good old css tracks good old css
0:52:05
yeah you don't need to read the article
0:52:10
that is that is hilarious
0:52:13
hey you know what when it comes to this
0:52:17
i'm not great at it to be honest so
0:52:20
all right before the whole group is
0:52:22
researching okay we don't probably need
0:52:26
at the moment at least
0:52:27
they use radio buttons
0:52:35
but they're like styling the radio
0:52:40
oh that's interesting
0:52:42
that's pretty that's a pretty neat like
0:52:45
trick you don't even need javascript
0:52:48
yeah yeah absolutely
0:52:51
so if we go to it was css for this
0:52:57
this one well then you have to write
0:52:59
more css so i'm opposed to that
0:53:21
i forgot how to make comments on css ah
0:53:37
i can find another article too
0:53:47
no javascript needed why would you
0:53:49
advertise your article like that's not
0:54:01
there's always good old ww3 schools
0:54:09
yeah there's no avoiding the css
0:54:18
okay if we do this
0:54:21
and then where does this go in onto html
0:54:30
scrambler no password password password
0:54:39
so our this one has to be part of the
0:54:44
name your new boss chrome blur
0:54:46
keyboard board name okay here we go
0:54:49
we'll probably come over here
0:55:02
okay let's see what do we have over
0:55:07
tabs you know what
0:55:11
here tab is already there
0:55:18
actually i'm going to take my chances to
0:55:31
i think that was the parent class tabs
0:55:36
or was it did it just say tab
0:55:40
ah tab you're right
0:55:43
you're right it was a parent class
0:55:46
yeah i i think you want that one yeah
0:55:50
you just need two tabs right
0:55:56
so one and two get rid of this one
0:56:01
oh yeah the id says tab three
0:56:04
if you if you if you yeah there you go
0:56:15
i don't think it'll look like anything
0:56:17
without the css really
0:56:24
oh oh sweet wow that was fast you're a
0:56:36
well the important thing is that we
0:56:38
understand the code
0:56:40
yeah exactly that's the main thing oh
0:56:45
page just copy and paste without
0:56:48
understanding what's going on yeah
0:56:49
that's why we picked that one
0:56:52
we picked it because we understand it i
0:56:55
don't like to worry you wanna go
0:56:57
explaining it what was doing
0:57:03
well it's it really it's just html and
0:57:05
css i'm just saying i'm just i'm just
0:57:08
kidding i'm putting you on
0:57:10
it's pretty neat though that they didn't
0:57:12
use javascript because i would have
0:57:14
reached for javascript so that's yeah
0:57:16
they styled the the radio button in such
0:57:19
a way that it just looks like a tab
0:57:24
which is pretty smart to be honest yeah
0:57:27
i mean that's why if you're really good
0:57:29
at css like you can do a lot of cool
0:57:35
okay we want to decrease the width of it
0:57:56
uh is it inside the
0:58:09
oh it's inside oh it's a table i don't
0:58:17
uh yeah it's t body tr tv that's a table
0:58:22
oh wow yeah that's a table
0:58:29
okay so we can do this eight percent
0:58:32
no that might be a bit
0:58:48
isn't that that ever too much
0:59:01
i'd say let's pop the form inside the
0:59:05
tab and see how it looks then we can
0:59:09
cool let's do that
0:59:11
so content comes here
0:59:15
which would be our content form this
0:59:26
create another page for
0:59:28
this whole thing but this is too much
0:59:44
i'm just thinking to create another html
0:59:50
this and then just
1:00:06
in my work projects
1:00:08
that's how we do it
1:00:10
oh you can you can import
1:00:12
html and then import
1:00:26
html if you want to really
1:00:31
i don't recognize your code
1:00:34
i did not know that
1:00:38
in that case i may be wrong as well
1:00:40
you may be thinking
1:00:42
you may be thinking of a framework
1:00:46
uh i'm basically thinking about
1:00:58
because there would be some build
1:00:59
process and then it would probably
1:01:05
that would make sense i mean maybe i'm
1:01:08
maybe i'm wrong maybe you can do that
1:01:09
i'd be sweet if you could
1:01:12
actually i'm gonna
1:01:19
i don't know how you
1:01:20
import html i'd have to look that
1:01:40
i know you wouldn't be the case to be
1:01:45
okay cool so this is being
1:02:09
name your new board okay so this is that
1:02:19
oh with with some limitations i guess
1:02:24
of course there was limitations
1:02:37
okay label and then dip content
1:02:46
cool so this is the content here we need
1:02:48
to play around with this one a bit
1:03:02
i mean the the idea of it
1:03:08
and then it really helps i think to kind
1:03:14
yeah it's pretty it's pretty obvious
1:03:15
like to me i'm not a user
1:03:27
we can figure it out later
1:03:33
just some css no big deal
1:03:45
yeah like why isn't it
1:03:48
doing what i wanted to do i'm so bad
1:03:53
okay so create what this is the one
1:04:02
okay but we would probably have to put
1:04:04
back around this one and then the idea
1:04:07
is when you click on tab two that'll
1:04:10
just take you to the ghetto yeah
1:04:14
just phenomenal to be honest
1:04:17
yeah it'll be great
1:04:22
let me just line this one up properly so
1:04:25
i don't mess up the sexy formatting you
1:04:56
that's the first half here and that's
1:04:58
the second time voila
1:05:10
and that's the first time where does
1:05:15
okay so this one can come closer
1:05:22
this is there and then
1:05:36
sounds good we can
1:05:41
at this stage and i'll just push the
1:05:45
nice good job nice for example
1:05:52
teamwork makes the dream work
1:05:57
how many of them are there
1:05:59
i don't need yeah i need this one i need
1:06:02
that one as well yeah thanks for fixing
1:06:07
she makes them mad come on i call those
1:06:18
i don't want that in my code
1:06:27
that was hilarious to be honest
1:06:35
i want to have our code readable as much
1:06:46
okay cool brilliant
1:06:48
i'm gonna add this
1:08:00
needed changes and just
1:08:03
your brain and my hands
1:08:06
to get it all done
1:08:08
which is your brain too your brain too
1:08:14
all right cool so that brings us to the
1:08:23
thanks a lot for watching
1:08:27
joining as well and
1:08:29
yeah if you want to see how we've
1:08:33
the new design for
1:08:35
creating a gap board if you feel free to
1:08:38
join us on sunday now where we will try
1:08:41
our best to finish the
1:08:45
uh the new design and then fold on to
1:08:49
the actual get functionality
1:08:51
so we'll see you on sunday until then
1:08:55
wherever you are in the world
1:08:57
good evening morning
1:09:00
if you're in melbourne have a good night
1:09:03
or in bali which is have a good evening
1:09:07
yeah i'm going to have a good dinner
1:09:17
have a great night cheers don't forget
1:09:19
to turn up the volume
