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.
This video doesn't have any notes.
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign upRelated Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
[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 PHP's foreach command.
0:18
We still have more to cover about arrays
before we can build the page entirely, but
0:23
let's open catalog.php and
get a basic array in place.
0:27
At the very top of catalog.php,
let's 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
and close 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 upYou need to sign up for Treehouse in order to set up Workspace
Sign up