Part 3

Set up the Dreamweaver site, learn the PHP basics and connect to the database with mysqli.

#digital technology #gce #parkwood vale #wjec

← Previous part Next part →

We point Dreamweaver at the UwAmp testing server, cover the PHP we will need for the rest of the build, and make a reusable database connection file. In this part: 1:07 Starting UwAmp from the memory stick 1:34 Creating the Dreamweaver site with UwAmp as the testing server 4:48 PHP tags, echo and joining strings 7:32 Indexed and key/value arrays, print_r and var_dump 12:14 for loops 15:44 foreach loops, with if and continue 19:29 A test database and users table in HeidiSQL 21:49 Connecting with mysqli and stopping with an error if it fails 24:08 Fixing connection errors 26:48 Moving the connection into config/connection.php and loading it with require Software: Adobe Dreamweaver, UwAmp, HeidiSQL, PHP, MySQL.

Transcript

In the first of this week's two videos, what I'm going to do is reshoot video number
three. I've had a couple of people message me and tell me that the quality wasn't
quite there, they couldn't understand or see what was going on, so I'm going to go
back and hopefully do an improved version of it.
Video three then focuses on setting up Dreamweaver, making sure that you are
connected correctly to your test development site,
and shows you some basic PHP commands.
There may be some slight changes between what I delivered in video 3 originally and
what I delivered this time around in video 3.
I have the original setup in place, but I may just word things ever so slightly
different. So with that in mind, both video 3 and the original video 3 will still be
available to you. You can watch whichever version you like.
You can watch the two versions, compare them and see what I've done differently.
Hopefully this recasted though should be a bit clearer for you.
Let me know if there are any issues.
Let's jump into it.
Okay, so here I am backing my student account then.
And what I'm going to do is start off by opening up and running UwAmp.
I can do that by going to the directory, go into my USB, find UwAmp and launch the
EXE.
Now there's UwAmp running, it's currently running here and let's just open up the
local host so we can see that everything's in place.
What I'm going to do from there then is I'm going to jump straight into Dreamweaver
and we're going to look at how we could set up Adobe Dreamweaver.
now when we are in adobe dreamweaver and it's in its base form like this we need to
go over to the word site and manage sites that'll allow me to create a new site
ensuring that all the files are kept together i can go to the word new site here and
i'm just going to give it a name so parkwood vale it wants to know
where i'm going to store it in my document so i'm going to use folder icon here just
to locate it in my documents here I'm going to create a new folder called Parkwood
Vale and I'm going to select that folder as
well as setting up my local location for it I'm going to go into my server section
and add in a test server so I'm going to say Parkwood
Vale test and using the connection type of
a local or network folder that's because it is running from that USB so
when I click on local or network folder then it wants to know where the folder is so
I can go into my USB go to the UwAmp folder and it's actually the WWW folder
I want to use so I've got inside folder I'm gonna click select folder.
The web URL is simply localhost and I can click
on save. Now that's giving me my server in place and it's given me the ability to
either have is a remote server or a testing server.
I'm going to set it as my testing server and click save.
And when I click on done then on the side here we'll have our folder structure and
if I was to go on to my testing server side I can see the files that are already in
place on that UwAmp folder. And as you can see, I already have a MyApp folder
and I have an index.php page in place on that UwAmp folder, which is
what gives me my local host view.
So that index.php is what gives me this file here.
When it comes to creating our sites then every website that exists has an
index.php that is how web browsers know where to start on
where to look for content i'm simply gonna as i'm setting my testing server up here
click on my index.php file here and i'm going to download it by using the get file
option and that will bring that into my local view so i have it here and i can open
it up and we can see everything that comes pre-installed on that UwAmp folder
but we don't really want any of this content in place.
What I'm going to do is highlight it all.
I'm going to go in and I'm just simply going to delete everything out from that file
there and when I click on the save then I need to put that up so that's in place and
if I went back to localhost you'll see it is a blank page.
That is because this page here, which should contain all of my code and all of my
text, is currently empty. Now I'm going to zoom in here so hopefully on the
recording you can see this a lot clearer as to what it is I'm going to do next.
I'm going to set up some basic elements within PHP.
First thing I want to show you is how to create a PHP tag, which is just the normal
HTML tag with PHP in place. I do need to put a question mark before the word
PHP and as you can see there it went from being a blue tag to a red tag to show that
it recognizes it as PHP and to end my PHP tag is like every other tag I simply put
in question mark and then close that off.
Anything in here then will be executed server-side before the user gets to see it.
If I wanted to display something I have a variety of different methods.
I could use a simple echo, which means to output something.
And if I echo the usual hello world and terminate it
using a semicolon, save it and put that file.
When I go into my local host and refresh it, you'll see it says hello world.
Inside the speech marks, I can put any HTML tags I like.
So I could have that set as a h1
and end that h1 there save it put it and refresh
it and it'll apply the h1 tag to it
so echoing essentially means anything inside speech marks i want you to output
it
verbatim as it is don't worry about compiling it let the web browser do that so as
you can see there i got speech mark starting and a speech mark ending to put that in
place i can concatenate
So if I put in h1 here and close those speech marks off, you'd see that
actually it starts off, if I save that and I put that, it's going to give me an
error.
And it says that there's an error expecting a semicolon or a comma and is telling me
that is on line two.
Line two has that in place and then even though the semicolon's there, what's
breaking it is the fact that it has this code here that isn't in any form of PHP.
to execute it.
Now like I said just now I can concatenate these so I can do is put a full stop
there and put in more speech marks and put that there
and what that would actually do if I simply put a BR tag here and then a page one
tag here is
effectively create it so that those two are joined as one long command.
Seems a bit of a waste at the moment doesn't really do anything but it will be very
adding in variables so we can throw them in the middle of something as we're doing
it. Now that's the echo command to print something out to our screen.
But if I wanted to print out an array and I wanted to put in place an array of
information, I couldn't use echo.
Echo is only for single strings.
So to create an array in PHP, I use the dollar sign to create a variable.
I give it a property. So I'm going to say name and I'm actually, I'm going to call
this array just to
and I'm gonna say that my array is equal to and I can give it
some properties
now inside here I'm gonna simply say James Jones for my name and I'm gonna say
let's mix it up and say 34 for my age if I save that
put that and refresh my page nothing changes because I've
created my array but I haven't tried to output it in any way.
So if I brought this back, let's check this back as a simple single line, hello
world echoed, and then I tried to echo below and I wanted to echo out my array,
it's going to give me an error.
Now if I refresh that, it tells me hello world and it cannot convert the array to a
string.
What I could do is target a single property within my array.
at position 0 it would print out James Jones and that would put that in place.
I could also print out position 1 and that would print out
my age.
I could say hello world and instead of saying hello world I want to say hello James
Jones. I could use that breakout element I was talking about two seconds ago, add
$array in place at position zero, and then
if I was to put that, rather than saying hello world, it'll now say hello James
Jones. So that's where that concatenation comes into place that I was talking about
just now. It allows you to put information from variables directly into your echo
statements.
But if I wanted to print out the whole content of my array, I'd have to use one of
two methods. The method I prefer is called printR.
And if I put in the dollar sign there and I put in array and I save and put that,
what it's going to do is simply print out the contents of my array.
So as you can see there, my array contains my details and I'm printing my array.
I said there are two methods to do this.
Another would be simply called var_dump.
and if I put in my array there it would do a very similar function
but when it dumps it it gives you all of these additional properties with it.
It can be useful if you want to know the length of something but realistically if
you're trying to output something and check your array var dump gives you much more
information than you actually need.
Handy to go through with your students to talk them through what an integer would be
and and how they're all recorded differently, and the fact that PHP can handle
arrays of different
variable types, but not really going to help much for our project.
Now at the moment, I've been referencing my array using the numbered
position of its array property, so zero and one.
I can provide my array, so I can say, with a key value pair.
So I could say, and I tend to do these ones in single quote, just so that it's
separated and it's easy to tell the difference between the key and its value.
I've got name there, and I can do age here,
and do the same sort of thing.
Now if I put that and I refresh this, now we've
got array contains name and there's my name and age and there's my age.
It makes it a lot easier when I want to echo and understand what I'm saying.
So I could say hello as space concatenate
into it my dollar assigned array and rather than say in a position zero I
can now say a position name and that will allow me to print
saying hello James Jones without
having to worry about knowing and counting the positions within my array our key
value peers then make it a little bit easier to understand what's going on in our
arrays.
Now as well as array mapping one of the important things that we'll cover across the
range of this course are loops within PHP.
So I start off with a basic for loop and I'm going to say for
$c for counter equals 0 while
$c is less than 10 and I'm going to say
$c plus plus
and inside here now inside a bit of curly braces with dual technical term which
i can't remember right now it is the key which is next to the letter p on your
keyboard i can get it to do something 10 times as i wanted to do so i could
echo out and then just say hello and i wanted to go
to a new line so I can say break.
I didn't need that stop there and let's just terminate that.
When I put that up to my database to my server sorry if I refresh this
it prints out hello 10 times.
As useful as that is printing the same word over and over isn't very handy but I
can concatenate onto it just like I did earlier dollar signs a C and I can say hello
number
and then I've got my dollar sign C and let's just
simply concatenate a line break at the end of it so a BR save
that put that and refresh it and hello number zero one to ten
obviously because as my loop starts at zero and is less than 10
it will loop 10 times but counting numbers one zero through to nine
i could do plus one there and that would actually have no
impact i may need to wrap that in brackets a second let's see that bracket
there save it put it and refresh it it will still
loop 10 times but now my numbering is correct our loops will become handy our
loops will become important when we start going through adding in tables putting
contents of books and bits and pieces like that our loops will be used to populate
those but as it stands our simple for loop is in place there
now what i could do is i could contain
lots of values in an array so i for example array
here is equal to and then i can have in place my different
values like i had earlier name for the key and then i could say
james jones or in fact actually let's drop this down to first name
is james i could do comma and
key of last name is equal to jones
comma and key of age is equal to 34
and terminate that.
So I've got my array in place here.
I've got the arrows here, which is why Dreamweaver was giving me an error warning.
I've got that in place. I can use a special type of array, sorry not array,
a special type of loop that has been set up to iterate through the values in my key
value pair. That is called a for each loop.
And with a for each I have to give it what I want to loop through, array, and then I
can do as a dollar sign key value.
Now we will be using a lot of these for each loops as we go through to loop through
the contents of our arrays that we create for our books, our users, all the
different elements within our database system.
And as I loop through here now then, what it's going to do is create a loop that
goes through this, this, and this.
So I'll have three outputs and I can echo from there and simply put in say a p
tag and let's echo again and end that p tag
actually I don't need the equals so we'll tidy that up ever so slightly in a second
let's get rid of that one tidy that up perfect there we go and inside here then what
I'm going to do is I'm going to echo out what my key is.
Key is a equals and I'm going to say dot dollar sign key
because it's referencing this key right here.
I'm going to say space value equals and then
do the same process dot value and
I want to go down to the next line after I've done that so I'm
and terminate that off. There we go.
So in this section here, and it is a little bit big.
Let's see if I can move that over.
Perfectly fits in there. If I save that then, and typical, I go back, put that
up to my server and refresh it.
It now says key equals first name, value equals James.
Key equals last name, value equals Jones.
Key equals age, value equals 34.
looping through every key value pair in this array and telling me its
contents.
So that will become useful when we bring in back values as our books, and we can
loop through all the different elements, and we can target them.
I could even say, if, and put an if statement in place, dollar sign key
equals, I've got two equals to compare.
I'm gonna say in there I want it as age so
I don't want to print out my age I'm just gonna say continue and what that
will do is that will gatekeeper it so if the value is equal to age it
will not print that out and that should have been indented today so now when
I put that what I'll actually get is a printout that just tells me my
two details because as soon as it's hit this condition here for age it's continuing
within my for each loop and no longer doing these elements i could change that
obviously say first name just to show that it doesn't just take off that
last value and if i put that and refresh it
it gets rid of the first one and i keep the other two so gatekeeper did i've
if to remove an element rather than looking for an element and printing an element
so that it doesn't keep going through.
All of that is basic elements of PHP which will possibly come up across the rest
of this course. The most important part of this, the part that we really need to
ensure we can do, is setting up the connection to our server.
And the way we're gonna do that is we're going to set up a variable called server
and we're going to tell it where our server is which is simply our local post
from there then i'm going to set up a variable called user
which is the user who we're accessing our server as at our mysql server
which in this case is root all in lowercase and i'm going to set up the password for
it as well which is also root and what I mean by that is if I was in
HeidiSQL so let's just jump into HeidiSQL a second and I try to connect
to my Parkwood Vale I am using localhost root password root I want to click on open
connection we open up the connection we can see this here now there is no table in
place here because I have put files in place as you are aware this is a re-recording
so I have inside here my temp file with my UwAmp there with my actual correct
database so the moment my database doesn't have anything there this is just going to
show you how we can connect to it so it's not essential that exists
I will not being said though go back into
HeidiSQL and just simply create in this here a
table create a new database sorry and call it Parkwood Vale
and click OK so I've got that
database there and within my Parkwood Vale database there are no tables I'm going to
create a new table for a second and it's got users and let me
maximize that a second add a value and it's gonna add in email as my first
value just so that there's something within here to work with so varchar
set it at 50 that's perfectly fine they don't need any other properties it's just so
that I can connect to this successfully no I don't want to save that query so
I've got my server in place I've got my user in place I've got my password in place
I'm now gonna go through and set up a connection variable which is gonna to be
a new type or new connection to a MySQLi and
MySQLi as a command takes different properties.
The first property is the server that you want to connect to.
The second property is the user you are connecting as and then the final property
is the password or the fourth third property sorry is the password to connect as
that user you could of course not
store these as variables but have these set up so if I was to duplicate that a
second and just have that in there as localhost
and then I could have in the root and in
here root as well and that would work in just the same way
it's just good practice to keep these extracted as separate entities so that when
you are coming through if you need to update any of these details they're simple to
find.
Now I'm going to put that in place there a second I'm just going to use a hashtag
that will comment this out just to show you that this works just as well and I've
got my connection there. I'm going to say if as an if statement to check dollar sign
connection and I want to check if my connection has any connect
errors before I go forward. So I'm saying if my connection has any
connect errors, then I want my whole process, let's check my screen brackets in
place, to die. Seems extreme, but that's what it is.
And say connection failed and I want to tell them why the
connection has failed. I'm going to say dollar sign connection.
Let's just get simply what my connection error is.
So what this is checking is to see if a connection error exists.
And if one does, stop processing anything further.
Tell the user there's a connection error and tell them what that connection error
is. So they can tell the admin or if it was yourself, you could get that fixed.
Now, if I go into here and put that file very quickly, when I refresh it, It's
come back and said it cannot find MySQL for some reason.
Let's have a look. What have I done wrong then?
Equals new MySQL.
Let's just jump that one there a second and see if it was an issue.
It shouldn't be an issue from there.
I can't see why it shouldn't find MySQL.
But let's just give it a retry.
and line six i can't find mysqli
i can tell you why i've said several times mysqli but
i've actually spelled it my slqi so let's just comment that back in place
take that comment away and fix it here as it was the one I wanted to show you to
start with SQL I and let's drop that in as well so that's fixed there
and put that back up now when I refresh that my errors disappeared
there is no error related because it can connect no problem if I was to put in route
1 and save that it actually make no issue because I'm using this one down here let's
jump back to the route 1 save that and put that up when I refresh this then
it will tell me access denied for user local host using it the password
provided it's telling me here that the connection failed for that user using
password so because I have that die command in place and I'm printing connection
failed you can see that message here connection failed I've got let's put a space in
place and then I'm going to put a hyphen in place and just simply put that just to
tidy it up a little bit. You can see now connection failed, hyphen, access denied
from my user.
If I was to remove that, save that, and refresh that,
it goes some way if you put it up.
It goes back to not having an error because it has fixed that connection issue.
all of that is needed to put that in place like i said we could inline it all so
it's all one big command i don't like doing it that method i like having it set up
so it's using our commands up here and save that and we have that in place if i
put that i get the same lack of an error in place there.
Now in that section there then we have been able to connect to our database and
store that connection but we'd need to do that on a very regular basis.
Any page within our site that requires PHP would need to have this setup here
and rather than having it at the top of every single page where there's a
possibility when we change any of these details that a page might be left out and
cause errors what we're gonna do is store this in a file that we can access like a
header file at the top of our page first thing I want to do is create a folder for
it so there's a new folder and it is gonna be my config folder so we capital
C and put in config now I've already written all of this code up so I'm not gonna be
replacing that code but what I'm gonna do is simply go to file and save as and
inside my config folder I'm gonna call this instead of config connection
dot php and i'm going to click on to save
yes i want to update any links that's perfectly fine there were no links to update
anyway but you can see that has created that and if i was to refresh my page
which i can find refresh local files you'll now see i have config and my
connection here my connection file contains the connection file code that i put in
place but so does my index page.
I don't want to keep this on top of every single page so I'm going to just simply
remove it.
Now with those in place then if I was to reconnect here and refresh this nothing
would really change because I haven't done anything different but if I went in and
changed the password and re-put up my connection file if you remember two seconds
ago we had that error i won't get that anymore that's because these
this element here isn't being used yet
what i want to do is tell my server that i require this to progress any further
so i'm going to put in quite simply require and open up a bracket now
i'm going to tell The path to what I will require is my config folder.
And then I'm going to say forward slash connection dot PHP.
And actually, if I started with four stop forward slash, that means the root of my
project and then this folder.
If I terminate that, save that, it's now created a link between those two pages.
I can put this up here and if I was to refresh this now
I get that error and the error is telling me that the error is on my
UwAmp config connection file even though I'm on my local host I'm on my
index file so in my connection file here then what I can do is put
that back in place save that re-put my connection file and then if I
refresh this I get no errors. I can go back into my index here after
I've required it I can put in some details so me equals and then simply
my key value pairing so name and I'm gonna say James Jones
and I'm gonna say age and I'm gonna say
34 and just like I did before I can print R
my me array,
dollar sign me. And what it will do is it will require this and process
this connection file first, then come back to my index file and continue with these
elements here. And just to show that it is processing this in full first, I'm going
to say here else echo.
and I'm going to echo as a H1
connected.
So if I save that and I put that file up and I save my index,
I put my index file up and I refresh my page here, I get connected
where it's processing my required connection file first and then the print R from my
array.
I don't need a giant connected every time I connect to my database so I'm going to
remove that out
and put that up.
Refresh it, that disappears and I've still got my printing in place there for my me
array.
Hopefully this will be a lot clearer for you.
Hopefully the quality of this will be vastly improved and like I said both videos,
the original and this recast will both be available on Moodle tag them as
original and recast so you can see the difference between the two.
I have had the original on the side here where I've jumped back and forth just
to make sure I've covered all the elements that I said I would and hopefully then
there's nothing missing.
If there are any further issues or any further issues with any of the videos
whatsoever please don't hesitate to drop me a message, drop me an email and
I'll redo this process for any video to make sure it's clear for you.
Thank you again for watching, have a good day.