Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Preview
Start a free Courses trial
to watch this video
In this video we will create the initial array to store our catalog and review the basics for looping through an array.
[MUSIC]
0:00
[SOUND] In this project,
0:04
we're going to use an array to store all
the information about our media items.
0:05
We'll have one array for
the whole catalog.
0:09
The array will have multiple elements,
one element for each item.
0:12
Then on the main catalog page,
0:16
we'll be able to loop through all
the items using PHPs foreach command.
0:18
We still have more to cover about arrays
before we can build the page entirely, but
0:23
lets open catalog.php and
get a basic array in place.
0:27
At the very top of catalog.php,
lets add some PHP code to create an array
0:32
We'll name this array, $catalog = array.
0:40
We'll add some values here.
0:50
Enclose our array.
0:59
We now have three elements here.
1:01
Design Patterns,
Forrest Gump, and Beethoven.
1:04
The text for each element is
enclosed in quotation marks.
1:11
There is a comma between
each set of values.
1:14
If we were to put a comma
within our value,
1:17
it would be treated as text,
not as a separator between the elements.
1:19
We can put hard returns between each
element to make it a little easier to tell
1:24
them apart.
1:28
You'll typically see large
arrays written like this,
1:30
PHP doesn't care what you use for
whitespace or indentation.
1:34
It just makes it easier for
other developers to read your code.
1:39
Let's add the proper HTML for
this page including the wrapper div.
1:42
Let's go down here.
1:46
First we're gonna add catalog
1:49
as part of our class because
this is the catalog page.
1:53
We'll add a new div.
1:57
class="wrapper".
1:58
And we'll put our h1
tag Up here in our div.
2:07
Inside the wrapper div,
2:16
right below the h1 tag, let's list
off our items in an unordered list.
2:17
When you're first starting,
2:22
I always recommend writing out the final
HTML needed, and then working backwards to
2:23
figure out what PHP you'll need
to use to generate that HTML.
2:27
So we're gonna need one unordered
list with an opening and close.
2:33
And we're gonna do a list item.
2:39
And we need Item 1, list item Item 2,
2:43
and list item Item 3.
2:50
Okay, we can see now that we need to
2:55
include these list item tags
within our foreach loop.
2:58
We don't need to include
the unordered list
3:03
because there's only one
pair of unordered list tags.
3:06
So let's replace the multiple LI tags with
a foreach loop that displays one item for
3:09
each element in the array.
3:14
So we're gonna open up our php tag and
we're gonna create a foreach.
3:16
Wanna see a foreach($catalog
3:22
as $item).
3:30
And then we're going
3:33
to echo out that item.
3:38
[INAUDIBLE].
Using concatenation we
3:43
do item, closing li tag,
3:48
and closing semicolon.
3:53
Let's make this a little
bit easier to see.
3:58
Okay, and close out our PHP tag, and
4:03
then we'll remove these lines here.
4:08
So we've created a foreach loop for
the catalog items.
4:14
And we've assigned each
item to a variable item.
4:19
And then we've told it to
print the item here below.
4:24
So let's take a look at
this in the browser.
4:28
Okay, if we go to our Books page,
we now see a list.
4:31
Design Patterns, Forrest Gump, and
Beethoven, here in an unordered list.
4:37
You need to sign up for Treehouse in order to download course files.
Sign up