what’s going on everybody welcome to part 17 of our go language tutorial
part 17 of our go language tutorial
part 17 of our go language tutorial series in this tutorial what we’re gonna
series in this tutorial what we’re gonna
series in this tutorial what we’re gonna be talking about is combining basically
be talking about is combining basically
be talking about is combining basically everything we’ve learned up to this
everything we’ve learned up to this
everything we’ve learned up to this point adding a little bit more to our
point adding a little bit more to our
point adding a little bit more to our HTML template and getting our first kind
HTML template and getting our first kind
HTML template and getting our first kind of proof of concept of our web
of proof of concept of our web
of proof of concept of our web application project news aggregator
application project news aggregator
application project news aggregator thing okay so up to this point we’ve
thing okay so up to this point we’ve
thing okay so up to this point we’ve kind of we’ve kind of got like these two
kind of we’ve kind of got like these two
kind of we’ve kind of got like these two separate scripts and I just kind of want
separate scripts and I just kind of want
separate scripts and I just kind of want to show them both before we in the end
to show them both before we in the end
to show them both before we in the end basically what we’re going to do is
basically what we’re going to do is
basically what we’re going to do is combine them okay so in the previous
combine them okay so in the previous
combine them okay so in the previous tutorial this is the code that we wrote
tutorial this is the code that we wrote
tutorial this is the code that we wrote to just kind of exemplify how we do
to just kind of exemplify how we do
to just kind of exemplify how we do templating and go and then it previously
templating and go and then it previously
templating and go and then it previously what we’ve done is made this aggregator
what we’ve done is made this aggregator
what we’ve done is made this aggregator script basically right that visits the
script basically right that visits the
script basically right that visits the site map of sitemaps grabs the sitemaps
site map of sitemaps grabs the sitemaps
site map of sitemaps grabs the sitemaps visits those sitemaps grabs the titles
visits those sitemaps grabs the titles
visits those sitemaps grabs the titles the keywords and the locations of those
the keywords and the locations of those
the keywords and the locations of those articles from every sitemap which is
articles from every sitemap which is
articles from every sitemap which is there’s like a bunch of sitemaps and
there’s like a bunch of sitemaps and
there’s like a bunch of sitemaps and eats each sitemap has some values it’s
eats each sitemap has some values it’s
eats each sitemap has some values it’s almost about 1500 articles basically so
almost about 1500 articles basically so
almost about 1500 articles basically so anyway we’re gonna combine these two
anyway we’re gonna combine these two
anyway we’re gonna combine these two things together now so what I’m going to
things together now so what I’m going to
things together now so what I’m going to go ahead and do is like inside like our
go ahead and do is like inside like our
go ahead and do is like inside like our program itself is going to be this web
program itself is going to be this web
program itself is going to be this web app so I’m gonna keep this as the main
app so I’m gonna keep this as the main
app so I’m gonna keep this as the main function and then basically what we’re
function and then basically what we’re
function and then basically what we’re going to do is kind of combine we’re
going to do is kind of combine we’re
going to do is kind of combine we’re gonna bring the news aggregator over to
gonna bring the news aggregator over to
gonna bring the news aggregator over to the go web app so the first thing that
the go web app so the first thing that
the go web app so the first thing that we want to do is is we want to modify
we want to do is is we want to modify
we want to do is is we want to modify the new zag page struct because
the new zag page struct because
the new zag page struct because basically what its gonna take is we can
basically what its gonna take is we can
basically what its gonna take is we can still pass the title but news is not
still pass the title but news is not
still pass the title but news is not going to be a string news is gonna be a
going to be a string news is gonna be a
going to be a string news is gonna be a basically it’s gonna be a map where the
basically it’s gonna be a map where the
basically it’s gonna be a map where the map where the key is a string and the
map where the key is a string and the
map where the key is a string and the value is going to be a news map value
value is going to be a news map value
value is going to be a news map value also we’re pulling in format net HTTP
also we’re pulling in format net HTTP
also we’re pulling in format net HTTP HTML template we basically need to bring
HTML template we basically need to bring
HTML template we basically need to bring in io util and the XML
in io util and the XML
in io util and the XML versions so grab this and again if you
versions so grab this and again if you
versions so grab this and again if you don’t have either of these two scripts
don’t have either of these two scripts
don’t have either of these two scripts that’s totally fine you can go to the
that’s totally fine you can go to the
that’s totally fine you can go to the text-based version this tutorial then
text-based version this tutorial then
text-based version this tutorial then this part 17 and just everything is
this part 17 and just everything is
this part 17 and just everything is there that you that you need so yeah so
there that you that you need so yeah so
there that you that you need so yeah so anyway copy io util coming over here
anyway copy io util coming over here
anyway copy io util coming over here chasing that in and then we’re also
chasing that in and then we’re also
chasing that in and then we’re also going to grab the xml encoding cool okay
going to grab the xml encoding cool okay
going to grab the xml encoding cool okay now what we’re going to go ahead and do
now what we’re going to go ahead and do
now what we’re going to go ahead and do is we need the the news map struct we
is we need the the news map struct we
is we need the the news map struct we need let’s look over here probably
need let’s look over here probably
need let’s look over here probably we’re gonna need news we’re gonna need
we’re gonna need news we’re gonna need
we’re gonna need news we’re gonna need sitemap index and news maps so i think
sitemap index and news maps so i think
sitemap index and news maps so i think we’re just going to take all three of
we’re just going to take all three of
we’re just going to take all three of these so site map news and news map let
these so site map news and news map let
these so site map news and news map let me just make sure yeah yeah okay so i’m
me just make sure yeah yeah okay so i’m
me just make sure yeah yeah okay so i’m just going to throw this down here
just going to throw this down here
just going to throw this down here actually let’s throw it right your site
actually let’s throw it right your site
actually let’s throw it right your site map news news map new zag page cool okay
map news news map new zag page cool okay
map news news map new zag page cool okay once we’ve done that what we’re gonna go
once we’ve done that what we’re gonna go
once we’ve done that what we’re gonna go ahead and do is we can take let’s take
basically our entire main function is
basically our entire main function is gonna be we’re going to put that in the
gonna be we’re going to put that in the
gonna be we’re going to put that in the news AG handler
news AG handler
news AG handler so rather than and then basically p will
so rather than and then basically p will
so rather than and then basically p will be our news map basically our news map
be our news map basically our news map
be our news map basically our news map value our news the news variable will be
value our news the news variable will be
value our news the news variable will be news maps so let’s take all the code in
news maps so let’s take all the code in
news maps so let’s take all the code in the main function basically to here we
the main function basically to here we
the main function basically to here we don’t need to do this part right so
don’t need to do this part right so
don’t need to do this part right so we’re just gonna take this block of code
we’re just gonna take this block of code
we’re just gonna take this block of code here all of that copy that and go over
here all of that copy that and go over
here all of that copy that and go over here and then inside the new zag handler
here and then inside the new zag handler
here and then inside the new zag handler at the top before here we’re just gonna
at the top before here we’re just gonna
at the top before here we’re just gonna paste this will be tabbed over whoops
paste this will be tabbed over whoops
paste this will be tabbed over whoops and now i think that’s fine this might
and now i think that’s fine this might
and now i think that’s fine this might this this will probably screwing
this this will probably screwing
this this will probably screwing something up that’s okay let’s do rather
something up that’s okay let’s do rather
something up that’s okay let’s do rather than that now it’s news maps and news is
than that now it’s news maps and news is
than that now it’s news maps and news is now
now
now use map and let’s see we don’t want that
use map and let’s see we don’t want that
use map and let’s see we don’t want that err we don’t need that anymore we don’t
err we don’t need that anymore we don’t
err we don’t need that anymore we don’t need a print okay well we can print the
need a print okay well we can print the
need a print okay well we can print the output here that’ll be fine just in case
output here that’ll be fine just in case
output here that’ll be fine just in case we do hit some errors might as well this
we do hit some errors might as well this
we do hit some errors might as well this won’t make them explicit and see them
won’t make them explicit and see them
won’t make them explicit and see them [Music]
[Music]
[Music] okay
I’m gonna that’s gonna be giant if we
I’m gonna that’s gonna be giant if we printed that out I kind of want to run
printed that out I kind of want to run
printed that out I kind of want to run it before we do our template but that’s
it before we do our template but that’s
it before we do our template but that’s okay let’s just build the template first
okay let’s just build the template first
okay let’s just build the template first and get into it so new zag template and
and get into it so new zag template and
and get into it so new zag template and I’m gonna go ahead and we can leave the
I’m gonna go ahead and we can leave the
I’m gonna go ahead and we can leave the title there and then what we’re gonna do
title there and then what we’re gonna do
title there and then what we’re gonna do is we’re just gonna build a table so the
is we’re just gonna build a table so the
is we’re just gonna build a table so the table that I’m gonna use is basically
table that I’m gonna use is basically
table that I’m gonna use is basically like to build a table you’re gonna have
like to build a table you’re gonna have
like to build a table you’re gonna have some table tags and historically when
some table tags and historically when
some table tags and historically when I’ve done things with web development
I’ve done things with web development
I’ve done things with web development I’ve had once in a great while someone
I’ve had once in a great while someone
I’ve had once in a great while someone that complains that hey you never
that complains that hey you never
that complains that hey you never covered what hTML is if you don’t know
covered what hTML is if you don’t know
covered what hTML is if you don’t know HTML there’s like a billion HTML
HTML there’s like a billion HTML
HTML there’s like a billion HTML tutorials out there so find one if you
tutorials out there so find one if you
tutorials out there so find one if you want to learn HTML super simple though
want to learn HTML super simple though
want to learn HTML super simple though it’s just tags okay that’s that’s not
it’s just tags okay that’s that’s not
it’s just tags okay that’s that’s not complicated so you should be able to
complicated so you should be able to
complicated so you should be able to learn it on your own no problem
learn it on your own no problem
learn it on your own no problem so then T head so table head and then
so then T head so table head and then
so then T head so table head and then you’re gonna have whatever the those
you’re gonna have whatever the those
you’re gonna have whatever the those columns are so and then these would be
columns are so and then these would be
columns are so and then these would be table headers so slash table header and
table headers so slash table header and
table headers so slash table header and then we’re gonna say you know basically
then we’re gonna say you know basically
then we’re gonna say you know basically you’re gonna have the the article title
you’re gonna have the the article title
you’re gonna have the the article title and then we’ll have keywords for that
and then we’ll have keywords for that
and then we’ll have keywords for that article so title keywords and now what
article so title keywords and now what
article so title keywords and now what we’ll do is title will actually link to
we’ll do is title will actually link to
we’ll do is title will actually link to the article so that’s what’s going to go
the article so that’s what’s going to go
the article so that’s what’s going to go on in the head now what we’re gonna do
on in the head now what we’re gonna do
on in the head now what we’re gonna do is in the body so tea body what we’re
is in the body so tea body what we’re
is in the body so tea body what we’re gonna go ahead and do is add some table
gonna go ahead and do is add some table
gonna go ahead and do is add some table rows so TR TR and basically here you’re
rows so TR TR and basically here you’re
rows so TR TR and basically here you’re gonna have to well actually let’s do
gonna have to well actually let’s do
gonna have to well actually let’s do this
this
this TR like this and then you would have
TR like this and then you would have
TR like this and then you would have table data okay and in this case table
table data okay and in this case table
table data okay and in this case table data is your column so table data table
data is your column so table data table
data is your column so table data table data and it would be like a title and
data and it would be like a title and
data and it would be like a title and then here would be like a keyword
then here would be like a keyword
then here would be like a keyword something like that okay so what I’m
something like that okay so what I’m
something like that okay so what I’m gonna do is now I’m gonna save that and
gonna do is now I’m gonna save that and
gonna do is now I’m gonna save that and I’m gonna try to run this because I
I’m gonna try to run this because I
I’m gonna try to run this because I still I’m like skeptical as heck about
still I’m like skeptical as heck about
still I’m like skeptical as heck about getting an error so let’s go ahead and
getting an error so let’s go ahead and
getting an error so let’s go ahead and go run go touch go and I’ll allow it
go run go touch go and I’ll allow it
go run go touch go and I’ll allow it yeah and then it was /ag for the page
it’s probably gonna take a long time to
it’s probably gonna take a long time to load that because pretty not the whole
load that because pretty not the whole
load that because pretty not the whole map what I didn’t mean to do that I’m
map what I didn’t mean to do that I’m
map what I didn’t mean to do that I’m not sure why it printed out that whole
not sure why it printed out that whole
not sure why it printed out that whole map um I’ll have to go back and look at
map um I’ll have to go back and look at
map um I’ll have to go back and look at that oh my gosh uh why did it do that
that oh my gosh uh why did it do that
that oh my gosh uh why did it do that why did it print the whole map out I’m
why did it print the whole map out I’m
why did it print the whole map out I’m pretty sure we just built the table we
pretty sure we just built the table we
pretty sure we just built the table we just did title why did it do the entire
just did title why did it do the entire
just did title why did it do the entire map why did it do the entire map because
map why did it do the entire map because
map why did it do the entire map because we never asked news bat news map to run
we never asked news bat news map to run
we never asked news bat news map to run like that do we know that shouldn’t have
like that do we know that shouldn’t have
like that do we know that shouldn’t have done it
done it
done it why oh okay we didn’t change the
why oh okay we didn’t change the
why oh okay we didn’t change the template okay that makes a little more
template okay that makes a little more
template okay that makes a little more sense okay so okay yeah it all
sense okay so okay yeah it all
sense okay so okay yeah it all definitely passed cool so we forgot to
definitely passed cool so we forgot to
definitely passed cool so we forgot to change this so this needs to be news egg
change this so this needs to be news egg
change this so this needs to be news egg template to plate got HTML so let’s save
template to plate got HTML so let’s save
template to plate got HTML so let’s save that and let me let me go ahead and
that and let me let me go ahead and
that and let me let me go ahead and rerun that mm-hmm
rerun that mm-hmm
rerun that mm-hmm so anyway loading this page is gonna
so anyway loading this page is gonna
so anyway loading this page is gonna take a while so it’s running all that
take a while so it’s running all that
take a while so it’s running all that code which is something we’re gonna talk
code which is something we’re gonna talk
code which is something we’re gonna talk a little bit more about in the coming
a little bit more about in the coming
a little bit more about in the coming tutorials but let me see if we get a
tutorials but let me see if we get a
tutorials but let me see if we get a table this time still gonna take a walks
table this time still gonna take a walks
table this time still gonna take a walks is still gonna pull that information
is still gonna pull that information
is still gonna pull that information cool okay so we have a really basic you
cool okay so we have a really basic you
cool okay so we have a really basic you know title keyword this is a simple
know title keyword this is a simple
know title keyword this is a simple table heel here here
table heel here here
table heel here here heel is a table now what we want to do
heel is a table now what we want to do
heel is a table now what we want to do is populate this table so it looks so
is populate this table so it looks so
is populate this table so it looks so what I’m gonna do is is we basically
what I’m gonna do is is we basically
what I’m gonna do is is we basically need to iterate over all this this this
need to iterate over all this this this
need to iterate over all this this this data so what I’m gonna do is come into
data so what I’m gonna do is come into
data so what I’m gonna do is come into our HTML template here and basically we
our HTML template here and basically we
our HTML template here and basically we want to do is we want to iterate as many
want to do is we want to iterate as many
want to do is we want to iterate as many table rows as we have data so so the way
table rows as we have data so so the way
table rows as we have data so so the way that we can do this is just I can go
that we can do this is just I can go
that we can do this is just I can go we’re going to use a range
we’re going to use a range
we’re going to use a range so we’re gonna use range but it’s kind
so we’re gonna use range but it’s kind
so we’re gonna use range but it’s kind of wonky um as far as I can tell I think
of wonky um as far as I can tell I think
of wonky um as far as I can tell I think this is this is like custom go
this is this is like custom go
this is this is like custom go templating I don’t really think they’re
templating I don’t really think they’re
templating I don’t really think they’re using something like like in in Python
using something like like in in Python
using something like like in in Python you use Jinja templating which is kind
you use Jinja templating which is kind
you use Jinja templating which is kind of separate from Python but this I think
of separate from Python but this I think
of separate from Python but this I think is with go so anyway if anybody knows if
is with go so anyway if anybody knows if
is with go so anyway if anybody knows if this was like custom made for go or if
this was like custom made for go or if
this was like custom made for go or if this came from somewhere let me know
this came from somewhere let me know
this came from somewhere let me know because it’s weird that you have to
because it’s weird that you have to
because it’s weird that you have to switch things around but anyways you do
switch things around but anyways you do
switch things around but anyways you do so we’re going to still use range but it
so we’re going to still use range but it
so we’re going to still use range but it works this way range and then you’re
works this way range and then you’re
works this way range and then you’re gonna say okay key
gonna say okay key
gonna say okay key don’t forget your dollar sign that’s how
don’t forget your dollar sign that’s how
don’t forget your dollar sign that’s how you’re gonna specify a variable that so
you’re gonna specify a variable that so
you’re gonna specify a variable that so that you could use it later so key and
that you could use it later so key and
that you could use it later so key and then value because that’s what’s gonna
then value because that’s what’s gonna
then value because that’s what’s gonna be returned and then colon equals and
be returned and then colon equals and
be returned and then colon equals and then again it’d be dot news cuz that’s a
then again it’d be dot news cuz that’s a
then again it’d be dot news cuz that’s a value that was passed here and then what
value that was passed here and then what
value that was passed here and then what you would do is I’m just going to make
you would do is I’m just going to make
you would do is I’m just going to make some space but you would then you know
some space but you would then you know
some space but you would then you know do things right and then you have to end
do things right and then you have to end
do things right and then you have to end the range at some point you have to end
the range at some point you have to end
the range at some point you have to end you know what is what are all the things
you know what is what are all the things
you know what is what are all the things that you’re gonna do in this range so
that you’re gonna do in this range so
that you’re gonna do in this range so then you just do end okay so the things
then you just do end okay so the things
then you just do end okay so the things that we’re gonna do are make table rows
that we’re gonna do are make table rows
that we’re gonna do are make table rows and stuff and that’s why you have the
and stuff and that’s why you have the
and stuff and that’s why you have the ability to add logic like this so that
ability to add logic like this so that
ability to add logic like this so that you can throw in both HTML and you can
you can throw in both HTML and you can
you can throw in both HTML and you can throw in you know variables so now we
throw in you know variables so now we
throw in you know variables so now we can use we can do like key right so that
can use we can do like key right so that
can use we can do like key right so that would be like your title will just be
would be like your title will just be
would be like your title will just be key and then the the keyword column
key and then the the keyword column
key and then the the keyword column that’s going to be your values so it’ll
that’s going to be your values so it’ll
that’s going to be your values so it’ll be dot or yeah value but value had two
be dot or yeah value but value had two
be dot or yeah value but value had two things right because remember value is
things right because remember value is
things right because remember value is corresponding right that news is the
corresponding right that news is the
corresponding right that news is the news map which has keys which are the
news map which has keys which are the
news map which has keys which are the titles then the values we’re going to be
titles then the values we’re going to be
titles then the values we’re going to be keywords and locations right so if we
keywords and locations right so if we
keywords and locations right so if we want the keywords we need to do value
want the keywords we need to do value
want the keywords we need to do value dot key word and the reason why we’re
dot key word and the reason why we’re
dot key word and the reason why we’re having to do that is like I said before
having to do that is like I said before
having to do that is like I said before it’s basically responding you know here
it’s basically responding you know here
it’s basically responding you know here keyword it’s a news map struct because
keyword it’s a news map struct because
keyword it’s a news map struct because remember the
remember the
remember the Mapp is string for four keys and then
Mapp is string for four keys and then
Mapp is string for four keys and then the value was a news map value and all
the value was a news map value and all
the value was a news map value and all that anyway so yeah that’s why we use
that anyway so yeah that’s why we use
that anyway so yeah that’s why we use dot keyword here okay
dot keyword here okay
dot keyword here okay now interestingly enough like obviously
now interestingly enough like obviously
now interestingly enough like obviously this will be the title but then but we
this will be the title but then but we
this will be the title but then but we kind of want that title to be a link so
kind of want that title to be a link so
kind of want that title to be a link so now let’s convert that to a link so a
now let’s convert that to a link so a
now let’s convert that to a link so a href and then I’m gonna say target
href and then I’m gonna say target
href and then I’m gonna say target equals blank so it opens a new window if
equals blank so it opens a new window if
equals blank so it opens a new window if you click on it and the the actual URL
you click on it and the the actual URL
you click on it and the the actual URL is the value dot capital L location and
is the value dot capital L location and
is the value dot capital L location and then we come on the other side here and
then we come on the other side here and
then we come on the other side here and just close off that tag it did it for me
just close off that tag it did it for me
just close off that tag it did it for me now I’m confused
now I’m confused
now I’m confused cool I think that’s right anyway okay so
cool I think that’s right anyway okay so
cool I think that’s right anyway okay so now we have all of our table rows in
now we have all of our table rows in
now we have all of our table rows in here and then end and then let’s just
here and then end and then let’s just
here and then end and then let’s just kind of clean this up a little bit cool
kind of clean this up a little bit cool
kind of clean this up a little bit cool so so yeah so that’s a little more
so so yeah so that’s a little more
so so yeah so that’s a little more complex use case of templating and go
complex use case of templating and go
complex use case of templating and go where as you know to do this to do it
where as you know to do this to do it
where as you know to do this to do it like a range and then append that to the
like a range and then append that to the
like a range and then append that to the go code like if you’re trying to do that
go code like if you’re trying to do that
go code like if you’re trying to do that in line and go at least the way I’m
in line and go at least the way I’m
in line and go at least the way I’m thinking that I would do it would it
thinking that I would do it would it
thinking that I would do it would it would be kind of messy whereas this is
would be kind of messy whereas this is
would be kind of messy whereas this is so much cleaner and it’s just so much
so much cleaner and it’s just so much
so much cleaner and it’s just so much more concise and if you were to read
more concise and if you were to read
more concise and if you were to read this I think it’s much more legible okay
this I think it’s much more legible okay
this I think it’s much more legible okay so let’s go ahead and break the web
so let’s go ahead and break the web
so let’s go ahead and break the web server and then I’m gonna go ahead and
server and then I’m gonna go ahead and
server and then I’m gonna go ahead and restart the web server I will allow it
restart the web server I will allow it
restart the web server I will allow it and then we’ll head to the AG page and
and then we’ll head to the AG page and
and then we’ll head to the AG page and this might take a while for it to run
this might take a while for it to run
this might take a while for it to run it’s got a purse all those sitemaps cool
it’s got a purse all those sitemaps cool
it’s got a purse all those sitemaps cool and now we have the entire table which
and now we have the entire table which
and now we have the entire table which is massive it’s just absolutely massive
is massive it’s just absolutely massive
is massive it’s just absolutely massive but as you can see you’ve got you know
but as you can see you’ve got you know
but as you can see you’ve got you know your keywords over here and then you’ve
your keywords over here and then you’ve
your keywords over here and then you’ve got the titles here and then if you were
got the titles here and then if you were
got the titles here and then if you were to click on that title it would take you
to click on that title it would take you
to click on that title it would take you to the Washington Post
to the Washington Post
to the Washington Post where you can read articles with their
where you can read articles with their
where you can read articles with their paywall interesting paywall I’m gonna
paywall interesting paywall I’m gonna
paywall interesting paywall I’m gonna wager that’s really easily defeated see
wager that’s really easily defeated see
wager that’s really easily defeated see if we can’t get the first I’m trying to
if we can’t get the first I’m trying to
if we can’t get the first I’m trying to get the first few lines of anyway I’m
get the first few lines of anyway I’m
get the first few lines of anyway I’m gonna wager if we were to view the
gonna wager if we were to view the
gonna wager if we were to view the source here
yeah pretty sure we were just looking at
yeah pretty sure we were just looking at it I’m pretty sure that is the article
it I’m pretty sure that is the article
it I’m pretty sure that is the article text I wish I could see it some have
text I wish I could see it some have
text I wish I could see it some have begun to realize but I can’t see the
begun to realize but I can’t see the
begun to realize but I can’t see the main article text anyway that’s that’s
main article text anyway that’s that’s
main article text anyway that’s that’s not this tutorial I’m gonna wager it’s
not this tutorial I’m gonna wager it’s
not this tutorial I’m gonna wager it’s all there though anyway so so now we
all there though anyway so so now we
all there though anyway so so now we have this table obviously this is a
have this table obviously this is a
have this table obviously this is a gigantic table it’s got so much freaking
gigantic table it’s got so much freaking
gigantic table it’s got so much freaking information in it
information in it
information in it and all that but nonetheless finally a
and all that but nonetheless finally a
and all that but nonetheless finally a proof of concept now what I’m gonna show
proof of concept now what I’m gonna show
proof of concept now what I’m gonna show basically again just kind of like the
basically again just kind of like the
basically again just kind of like the last tutorial the bulk of the learning
last tutorial the bulk of the learning
last tutorial the bulk of the learning is now over I’m gonna clean up this
is now over I’m gonna clean up this
is now over I’m gonna clean up this table though so anybody who wants to
table though so anybody who wants to
table though so anybody who wants to stick around and see a better way to
stick around and see a better way to
stick around and see a better way to quickly and easily make a nicer tabor
quickly and easily make a nicer tabor
quickly and easily make a nicer tabor table feel free to stick around
table feel free to stick around
table feel free to stick around otherwise like I said we’re done you can
otherwise like I said we’re done you can
otherwise like I said we’re done you can leave so so to make this table a little
leave so so to make this table a little
leave so so to make this table a little better and also to make it make our web
better and also to make it make our web
better and also to make it make our web app much more functional we can
app much more functional we can
app much more functional we can incorporate something called data tables
incorporate something called data tables
incorporate something called data tables let me just pull that up real quick data
let me just pull that up real quick data
let me just pull that up real quick data tables you don’t actually have to come
tables you don’t actually have to come
tables you don’t actually have to come here you’d have to visit this but this
here you’d have to visit this but this
here you’d have to visit this but this is what we’re gonna be using and
is what we’re gonna be using and
is what we’re gonna be using and basically woke it all it is is just like
basically woke it all it is is just like
basically woke it all it is is just like a nice JavaScript plugin for tables that
a nice JavaScript plugin for tables that
a nice JavaScript plugin for tables that basically end up looking like this so
basically end up looking like this so
basically end up looking like this so yeah there’s a little bit of hover you
yeah there’s a little bit of hover you
yeah there’s a little bit of hover you can also do searches so like accountant
can also do searches so like accountant
can also do searches so like accountant or something like that it’s just like
or something like that it’s just like
or something like that it’s just like instant search because all the data is
instant search because all the data is
instant search because all the data is there obviously it’s no different than
there obviously it’s no different than
there obviously it’s no different than doing like control theft right now in
doing like control theft right now in
doing like control theft right now in our table sorry I just banged the mic
our table sorry I just banged the mic
our table sorry I just banged the mic anyway yeah so and then you can sort and
anyway yeah so and then you can sort and
anyway yeah so and then you can sort and all that kind of service it’s pretty
all that kind of service it’s pretty
all that kind of service it’s pretty cool and it’s super cheap to just throw
cool and it’s super cheap to just throw
cool and it’s super cheap to just throw it on top of your tables so that’s what
it on top of your tables so that’s what
it on top of your tables so that’s what I’m gonna do here if you want all the
I’m gonna do here if you want all the
I’m gonna do here if you want all the code is in this tutorial as well so you
code is in this tutorial as well so you
code is in this tutorial as well so you don’t really need to you don’t need to
don’t really need to you don’t need to
don’t really need to you don’t need to like type along with me here so I’m just
like type along with me here so I’m just
like type along with me here so I’m just gonna run through it really really quick
gonna run through it really really quick
gonna run through it really really quick so so the first thing that we all we
so so the first thing that we all we
so so the first thing that we all we really need to do first of all we need
really need to do first of all we need
really need to do first of all we need to have we need to bring in the scripts
to have we need to bring in the scripts
to have we need to bring in the scripts that are gonna make this this data
that are gonna make this this data
that are gonna make this this data tables thing possible basically what we
tables thing possible basically what we
tables thing possible basically what we need is jQuery itself then we need the
need is jQuery itself then we need the
need is jQuery itself then we need the data tables CSS and then we need the
data tables CSS and then we need the
data tables CSS and then we need the data tables JavaScript all these things
data tables JavaScript all these things
data tables JavaScript all these things you can get either you can host them
you can get either you can host them
you can get either you can host them locally yourself or you can just use
locally yourself or you can just use
locally yourself or you can just use them from like a
them from like a
them from like a CDN somewhere so I’m just going to use
CDN somewhere so I’m just going to use
CDN somewhere so I’m just going to use the CDN version again if you go to the
the CDN version again if you go to the
the CDN version again if you go to the text-based version of this tutorial you
text-based version of this tutorial you
text-based version of this tutorial you can copy and paste the same stuff I’m
can copy and paste the same stuff I’m
can copy and paste the same stuff I’m about to copy and paste here bang
about to copy and paste here bang
about to copy and paste here bang okay so again yeah we’re pulling in
okay so again yeah we’re pulling in
okay so again yeah we’re pulling in jQuery then we’re pulling in the data
jQuery then we’re pulling in the data
jQuery then we’re pulling in the data table CSS and then we’re pulling in the
table CSS and then we’re pulling in the
table CSS and then we’re pulling in the data tables JavaScript that’s it and
data tables JavaScript that’s it and
data tables JavaScript that’s it and then at the end of our you know at the
then at the end of our you know at the
then at the end of our you know at the bottom of our little code here I’m gonna
bottom of our little code here I’m gonna
bottom of our little code here I’m gonna throw in a really simple script
throw in a really simple script
throw in a really simple script basically all it’s going to do here is
basically all it’s going to do here is
basically all it’s going to do here is any anything with the ID of fancy table
any anything with the ID of fancy table
any anything with the ID of fancy table is we’re gonna apply data table to it in
is we’re gonna apply data table to it in
is we’re gonna apply data table to it in this case we’re hopefully you’re gonna
this case we’re hopefully you’re gonna
this case we’re hopefully you’re gonna do this to a table all right so we need
do this to a table all right so we need
do this to a table all right so we need to now give our table the ID of fancy
to now give our table the ID of fancy
to now give our table the ID of fancy table so table here and then basically
table so table here and then basically
table so table here and then basically we’re just going to say ID equals fancy
we’re just going to say ID equals fancy
we’re just going to say ID equals fancy table and then there are a few other
table and then there are a few other
table and then there are a few other things that we need to specify or we can
things that we need to specify or we can
things that we need to specify or we can specify the one thing I’m gonna go ahead
specify the one thing I’m gonna go ahead
specify the one thing I’m gonna go ahead and do is just say class for this table
and do is just say class for this table
and do is just say class for this table there’s a bunch of different ones but
there’s a bunch of different ones but
there’s a bunch of different ones but again class corresponds to the CSS just
again class corresponds to the CSS just
again class corresponds to the CSS just for you HTML newbies anyway class will
for you HTML newbies anyway class will
for you HTML newbies anyway class will be display so there’s different types in
be display so there’s different types in
be display so there’s different types in again you can go to day the tables
again you can go to day the tables
again you can go to day the tables dotnet to learn more about what’s
dotnet to learn more about what’s
dotnet to learn more about what’s available to you just showing you a
available to you just showing you a
available to you just showing you a quick example so class display I’m gonna
quick example so class display I’m gonna
quick example so class display I’m gonna go ahead and save that
go ahead and save that
go ahead and save that now let’s rerun our web app hopefully we
now let’s rerun our web app hopefully we
now let’s rerun our web app hopefully we didn’t make any mistakes mostly just did
didn’t make any mistakes mostly just did
didn’t make any mistakes mostly just did copy and paste so I’m assuming that’s
copy and paste so I’m assuming that’s
copy and paste so I’m assuming that’s not going to be a problem
oh cool
oh cool do I have this open anywhere okay I have
do I have this open anywhere okay I have
do I have this open anywhere okay I have an old version of it anyway I’ll just
an old version of it anyway I’ll just
an old version of it anyway I’ll just bring that over Hey
bring that over Hey
bring that over Hey oh there goes okay took a while it took
oh there goes okay took a while it took
oh there goes okay took a while it took a second to format it interesting anyway
a second to format it interesting anyway
a second to format it interesting anyway so here is our data table and
so here is our data table and
so here is our data table and unfortunately because there are 10
unfortunately because there are 10
unfortunately because there are 10 entries but I can’t quite fit it on my
entries but I can’t quite fit it on my
entries but I can’t quite fit it on my screen I wonder if I just zoomed out
screen I wonder if I just zoomed out
screen I wonder if I just zoomed out yeah cool
yeah cool
yeah cool so anyway as you can see here’s our data
so anyway as you can see here’s our data
so anyway as you can see here’s our data table and it’s just it’s just basically
table and it’s just it’s just basically
table and it’s just it’s just basically you can see here it’s 1,500 entries all
you can see here it’s 1,500 entries all
you can see here it’s 1,500 entries all that you can sort by title if you really
that you can sort by title if you really
that you can sort by title if you really wanted to you can also sort by keywords
wanted to you can also sort by keywords
wanted to you can also sort by keywords but that would probably be a mistake but
but that would probably be a mistake but
but that would probably be a mistake but you can also search so for example I’m
you can also search so for example I’m
you can also search so for example I’m pretty sure you know Trump is president
pretty sure you know Trump is president
pretty sure you know Trump is president so I bet if we type Trump we’re gonna
so I bet if we type Trump we’re gonna
so I bet if we type Trump we’re gonna find a bunch of stuff on Trump and it’s
find a bunch of stuff on Trump and it’s
find a bunch of stuff on Trump and it’s like I said it’s just it’s instant so
like I said it’s just it’s instant so
like I said it’s just it’s instant so yeah 250 entries on Trump then of course
yeah 250 entries on Trump then of course
yeah 250 entries on Trump then of course just as usual you could click them and
just as usual you could click them and
just as usual you could click them and go to the actual article where it’s
go to the actual article where it’s
go to the actual article where it’s probably gonna pay wall me all eyes
probably gonna pay wall me all eyes
probably gonna pay wall me all eyes don’t know is on okay anyway didn’t
don’t know is on okay anyway didn’t
don’t know is on okay anyway didn’t throw me in and either I guess is
throw me in and either I guess is
throw me in and either I guess is probably my ad blocker
probably my ad blocker
probably my ad blocker anyway all right that is enough for now
anyway all right that is enough for now
anyway all right that is enough for now what we need to do now is really talk
what we need to do now is really talk
what we need to do now is really talk about the time of this page so load time
about the time of this page so load time
about the time of this page so load time 1 2 3 4 5 about 5 seconds okay that’s
1 2 3 4 5 about 5 seconds okay that’s
1 2 3 4 5 about 5 seconds okay that’s five thousand milliseconds that’s
five thousand milliseconds that’s
five thousand milliseconds that’s horrible
horrible
horrible so we need to work on this load speed
so we need to work on this load speed
so we need to work on this load speed now I there’s a couple of things we
now I there’s a couple of things we
now I there’s a couple of things we could do one thing we could do is just
could do one thing we could do is just
could do one thing we could do is just cash it right and then I would load
cash it right and then I would load
cash it right and then I would load pretty quick but the real problem that
pretty quick but the real problem that
pretty quick but the real problem that we’re having right now is is occurring
we’re having right now is is occurring
we’re having right now is is occurring you know here right here because
you know here right here because
you know here right here because basically what it’s doing is and really
basically what it’s doing is and really
basically what it’s doing is and really it’s it’s right here the the we’re doing
it’s it’s right here the the we’re doing
it’s it’s right here the the we’re doing this totally linearly we’re first we’re
this totally linearly we’re first we’re
this totally linearly we’re first we’re we’re where we go to this site map and
we’re where we go to this site map and
we’re where we go to this site map and we’re getting all these site maps but
we’re getting all these site maps but
we’re getting all these site maps but then we’re we’re running to one site map
then we’re we’re running to one site map
then we’re we’re running to one site map getting that information waiting for
getting that information waiting for
getting that information waiting for that response
that response
that response go into the next one asking for a
go into the next one asking for a
go into the next one asking for a response waiting for one getting it
response waiting for one getting it
response waiting for one getting it coming back right so that is not very
coming back right so that is not very
coming back right so that is not very fast so so what we need to do is figure
fast so so what we need to do is figure
fast so so what we need to do is figure out how we can get around that waste of
out how we can get around that waste of
out how we can get around that waste of time now no matter what you’re going to
time now no matter what you’re going to
time now no matter what you’re going to be having a deal with at least one X of
be having a deal with at least one X of
be having a deal with at least one X of a Washington Post response time but
a Washington Post response time but
a Washington Post response time but there might be ways that we can do this
there might be ways that we can do this
there might be ways that we can do this a little quicker so that’s what we’re
a little quicker so that’s what we’re
a little quicker so that’s what we’re gonna start looking into in the coming
gonna start looking into in the coming
gonna start looking into in the coming tutorials is how we can get go to go
tutorials is how we can get go to go
tutorials is how we can get go to go fast because that’s the whole point
fast because that’s the whole point
fast because that’s the whole point right so anyways that’s what we’re gonna
right so anyways that’s what we’re gonna
right so anyways that’s what we’re gonna be focusing on in the coming tutorials
be focusing on in the coming tutorials
be focusing on in the coming tutorials if you have questions comments concerns
if you have questions comments concerns
if you have questions comments concerns whatever up to this point feel free to
whatever up to this point feel free to
whatever up to this point feel free to leave them below otherwise I’ll see you
leave them below otherwise I’ll see you
leave them below otherwise I’ll see you in the next tutorial
”
Be First to Comment