Windows Installation
1. Download the software at: www.apachefriends.org/en/xampp-windows.html#641
Select the Installer option under the “Basic Package.” At the time of this writing, a direct link to
version 1.5 for Windows was: http://prdownloads.sourceforge.net/xampp/xampp-win32-1.5.0-pl1-
installer.exe
You may be taken to a page that gives you a bunch of different places to download from. Just click
one of the download buttons. Once downloaded, the installer works like most Windows installers.
2. Double click the .exe file you downloaded.
A window opens asking you to select the language you’d like to use.
3. Choose a language from the menu and click the OK button
A Setup Wizard window appears, ready to step you through the set up process.
4. Click the Next button, then click the Install button.
The various files needed are loaded onto your computer.
5. Click the finish button, then when a window appears saying “Install XAMPP servers as service”
appears make a selection.
A service starts up ever time you turn on your computer. In other words, do you want the Web server
and database server to startup whenever you turn on your PC? If you plan on doing a lot of
development, day-in and day-out, you might want to choose “Yes.” Otherwise you’ll find that you’re
starting up the XAMPP control panel (see below) and turning on the servers every time you boot up.
However, if you won’t be building database sites frequently, or you don’t have a lot of RAM in your
computer, you might want to choose “No.” This way you can manually turn on the servers (see “The
XAMPP Control Panel” below) when you need to work on a dynamic site.
If you select “Yes” you will be taken through the same question for the Apache Web Server, the
MySQL database server and the FileZilla FTP server. It’s best to click “No” for the FileZilla FTP
server. You won’t need it for this tutorial, and since this is just a testing server, you won’t need to have
the ability to FTP to the computer—after all, all your files are already on your computer.
6. Finally, launch a Web browser and type http://localhost/ in the location bar.
You’ll encounter a page that lists a bunch of languages; click the language you prefer and you’ll be
taken to a kind of control panel for XAMPP on your computer (see Figure PHP Tutorial 1-1.)
PHP Tutorial 1-1. Once installed, you can view your XAMPP page from
http://localhost/xampp/
Once you’ve installed XAMPP, there will be a shortcut called XAMPP Control Panel on your desktop.
Double-click this to control the servers—you can turn the servers off and on, as well as turn them into
services which launch each time you start up your computer.
To uninstall XAMPP, just go to C:\Program Files\ and delete the folder named XAMPP. That’s it!
For more information on XAMPP, included detailed installation and setup instructions visit
www.apachefriends.org/en/xampp-windows.html.
I’m Comfortable Downloading and Installing Complex Software
Windows
• Apache Web Server: Visit the Apache Web site and download and install version 2 of the Apache
Web server: http://httpd.apache.org/download.cgi
• PHP: Go to the PHP site and download the PHP 5.05 Zip Package listed under “Windows Binaries”
at: www.php.net/downloads.php
• MySQL: Visit the MySQL download page at http://dev.mysql.com/downloads/mysql/4.0.html and
click the Windows (x86) link to download the installer.
• PHPMyAdmin: For managing your MySQL database, you’ll use this free, Web-based tool. Download
the latest version at www.phpmyadmin.net/home_page/downloads.php. You can download a ZIP file
containing all of the files. These are just PHP pages and they’ll go inside your Web documents folder.
It’s usually a good idea to create a folder in the Web site root folder with a name like pma (for
phpMyAdmin) and put all of the PHPMyAdmin files in there.
Dude, I Already Have PHP and MySQL Up and Running
OK. You’re all set, but you should make sure you either have PHPMyAdmin installed
(www.phpmyadmin.net/home_page/downloads.php) or you know how to load an SQL file into MySQL
from the command line. You’ll be doing that in the next phase of this setup.
Setting Up the Database and Web Site
To learn Dreamweaver’s dynamic features, you’ll be building a small Web application for the National
Exasperator. In fact, you’ll turn the site’s online store into dynamic Web pages that will retrieve
information from a database and merge it with already-created HTML code.
You’ll need the tutorial files to follow along. You can download them at www.sawmac.com/dw8/php.
Once you’ve downloaded and unzipped the files you’ll have a folder named DW_php, containing a folder
called nationalEx (the root folder for this Web site) and a file called nationalEx.sql (a SQL file that will let
you add the product data to your MySQL database).
Putting the Web Pages in Place
To begin, move the nationalEx folder into the Web server’s root folder. If you followed the directions
above and installed the XAMPP versions of Apache, PHP and MySQL, the root folder should be located at
C:\XAMPP\htdocs on Windows, and Applications/XAMPP/htdocs on Mac. (If your Windows computer’s
main drive is not the C:\ drive, the root folder might be located on another drive—D:\, for instance.) Place
nationalEx inside the htdocs folder.
Loading the Database
The data for the National Exasperator store needs to be installed in your new MySQL server. There’s
actually a few steps you’ll need to complete. First you’ll create a new database (you’ll be loading the data
for the store into this); next, you’ll load the data into this new database; finally, you’ll create a new user for
the database (this will be a special account that you’ll use for accessing and updating the database.)
Create the Database
1. In a Web browser type http://localhost/
If you used the XAMPP program as described above, this will take you to the main XAMPP page on
the new server. You’ll use a program called phpMyAdmin to administer the MySQL server.
2. Click the phpMyAdmin link listed under “Tools” to go to the phpMyAdmin main page.
Note: If you set up the Web server, PHP and MySQL on your own, you’ll need to use
your Web browser to go to the PHPMyAdmin folder on your server. This might be
http://localhost/pma or http://localhost/phpmyadmin/ depending on your set up.
3. In the Create New Database box type nationalEx and press the Create button (see Figure PHP Tutorial
1-3.)
This creates a new database on the MySQL server. Next you’ll load a SQL file which will create the
required tables and add the needed data to the database (see Chapter 20 for more on SQL, databases
and tables.)
The phpMyAdmin main page. Here you can create a new database, select an already created database to work with and handle many administrative tasks for MySQL.
4. Click the SQL tab near the top of the page.
This takes you to a page that lets you type in a SQL query (see page xx of printed book), or load a text
file that has SQL commands in it. You’ll do the latter—load a text file that contains all of the SQL
necessary to create the tables and data for the database.
5. Click the Browse button (see Figure PHP Tutorial 1-4. In the File Upload window that appears,
navigate to and select the file nationalEx.sql in the DW_PHP folder you downloaded earlier.
phpMyAdmin lets you load a SQL file, and execute the SQLcode inside the file. This is a great way to replicate data from another database. In fact phpMyAdmin can help you export all of the tables and data from any database it has access to.
6. Click the Go button.
The SQL in the file is executed: four new tables are created and a bunch of data is added. The last step
in prepping the database is to create a new MySQL user that has access to add to and update the
National Exasperator database.
7. Click the link at the top of the page labeled Server: Localhost.
This returns you to the main phpMyAdmin page
8. Click the Privileges link in the middle column of links.
9. Click the “Add a new user” link.
Create a new user to access a database.
10. Type nationalEx for the username and localhost for the Host. In the password field type nationalEx,
and in the re-type box type nationalEx again. The screen should look like Figure PHP Tutorial 1-6.
This will create a user whose name is nationalEx, whose password is nationalEx, and who can only
access them database locally from the server. This means someone out on the internet can’t try to login
to the MySQL server using the nationalEx account; only local access—for example, PHP pages being
run on the same computer—is allowed.
In general, it is a very bad idea to make a password the same as a username, since it doesn’t take much
imagination for a hacker to figure this out and suddenly be in control of your database. But for this
example application, it’s best to keep things as simple as possible, so we can get to the more interesting
stuff (actually using Dreamweaver, for instance!)
11. Click the Go button at the bottom of the page.
The new user, nationalEx, is created and you’re taken to another Web page. Now you need to give that
user access to the National Exasperator database.
12. Scroll down the page to the “Database-specific privileges” section; select nationalEx from the database
menu
Setting Up Dreamweaver
The first step in working on this dynamic Web application is to define a new site. The process of defining a
dynamic site, as outlined below, is slightly different than for static sites, but not any harder:
1. Choose Site→New Sites.
The Site Definition window opens. Use Dreamweaver’s Site Wizard to help you set up this new site.
2. If it isn’t already selected, click the Basic tab at the top of the window.
The first step is to give this new site a name.
3. Type Exasperator Store in the first box and http://www.nationalExasperator.com/ in the second box.
You’ve just told Dreamweaver the name you want to use while working on this site, and the URL of
the Web site. In a real world scenario, you’d type the address of your Web site.
4. Click Next.
The next screen lets you choose whether you’re building a static or dynamic Web site.
5. Select “Yes, I want to use a server technology” and choose PHP/MySQL from the pop-up menu. Click
Next to proceed.
In the next step, you’ll tell Dreamweaver where your local files are and where you intend to put the
files for the testing server.
6. Select “Edit and test locally”.
Dreamweaver provides three ways to work with dynamic Web page files and a testing server.
“Edit and test locally” is a good choice when you’ve set up a Web and application server on your
computer (as you’ve done in this tutorial). Essentially, this means that you’re working on a Web site
located on a functioning Web server. In this way, you’ll preview the pages running on a real Web
server, so you can immediately test out all the nifty dynamic stuff.
The other two options are used when the testing server is located on another computer. This may be a
computer on your local network, or a full-fledged Web server running on the Internet that you connect
to using FTP.
“Edit locally, then upload to remote testing server” is a good option when you can’t run a testing server
on your computer—for example you don’t have administrative privileges so you can’t install a Web
server, but you do have a Web hosting account that provides PHP and MySQL.
The last option should be used when the testing server is on another computer, but you’re the only
developer working on the files. Since the files are available on your local network, anyone in your
company or office who has access to the computer with the testing server can also edit those files.
Your Web pages can end up in an unrecoverable mess if you and someone else are simultaneously
editing and saving the exact same file.
The next step involves telling Dreamweaver where to find the files for the Web site.
7. Click the folder at the right side of the middle of the window; navigate to and select the nationalEx
folder on the Web server. Click Next.
If you used the XAMPP installation recommended in the set up instructions this will be C:\Program
Files\xampp\htdocs\nationalEx\ (on Windows) or Applications:XAMPP:htdocs:nationalEx (on Mac).
You’ve nearly completed the setup.
8. Type the URL of the test server in the box and click Test.
Dreamweaver may have already filled in this box. If the test server is running on your computer, the
URL begins with http://localhost/ and ends with the folder that contains the Web pages. In this case,
the URL is probably http://localhost/nationalEx/.
If you get an error message when you click Test, you’ve probably entered the wrong URL.
9. Click Next.
You may get a warning box squawking about how the URL doesn’t match the testing server. This just
means that in step 3 above you didn’t specify any folder, but in step 7 you said the site was in a folder
named nationalEx. This means site-root relative links (see Chapter 5) won’t work. In a real world case,
you’d probably have your site’s files in the real root folder of your local Web server so you wouldn’t
run into this error. But since this is a made up example, and you’re using document-relative links (see
chapter 5), you’re safe. So click OK to close the warning box.
10. Click No, and then click Next one more time.
If you were planning to move this site onto a Web server connected to the Internet, you would select
Yes at this stage and provide all of the information needed to move your site files to the Internet as
described in Chapter 16. But since this tutorial is just an exercise, you won’t be putting it up on a live
Web server.
11. Click Done.
Dreamweaver has successfully set up your site. You’re now ready to learn about databases and connect
Dreamweaver to the National Exasperator online store database. (You may encounter the same
warning from step 9; just click OK to dismiss it.)
Connecting Dreamweaver to a Database
1. From the Files Panel (Window→Files) double-click the file index.php.
The main page for the online store opens. You have to have a dynamic PHP page open, in order to
connect Dreamweaver to a MySQL database.
2. Open the Databases panel by choosing Window→Databases.
The Application panel group opens.
3. Click the plus sign (+) button at the top right of the panel. From the pop-up menu, choose MySQL
connection.
4. In the Connection Name box, type connNationalEx.
You can use any name you want as long as it doesn’t start with a number and doesn’t contain any
characters other than letters, numbers, and the underscore character. In this case, conn is a helpful
indicator that this is a database connection and makes identifying it easier if you ever need to look into
the underlying code of the page.
Next, you’ll tell Dreamweaver where the database is located.
5. In the MySQL server box, type localhost.
In this case, both the Web server and MySQL are set up on the same computer, so when the Web
server runs the dynamic Web pages which attempt to access the database it only needs to look at the
“localhost” where the MySQL Database Server is located.
In many cases, the MySQL server provided by your Web hosting company will also be located on the
same server, so localhost will work when you move your pages onto your Web server. This is helpful,
because it means you can develop your sites locally on your computer, move them onto the Internet
and they should be able to connect to the database without a problem.
However, some Web hosts put their databases on separate machines dedicated just for that one task. In
this case, you would need to edit the database connection, and replace localhost, which works for
development and testing on your own computer, with the address of the MySQL server—this might besomething like mysql.webhost.com (don’t use http://, or anything besides the server’s address.) Your
Web hosting company can supply this information. Unfortunately this means that you need to change
the connection file Dreamweaver creates (this is what you’re doing right now) to include the new
address. Before uploading your site, open the connection file. Do this either from the databases panel
as described on page xx of this book or by looking in a folder name Connections located in the local
root folder of your site. In that folder you’ll find a file named after the connection name you supplied
when you created the connection—in this tutorial, that’s step 4 above so in this case the name of the
connection file is connNationalEx.php. Double-click this file, change localhost to the address of your
Web host’s MySQL database server. Then upload this file to your site (see page xx for information on
uploading Web files). You can then open the connection file again and change the database address
back to localhost. This will let you continue to work and test on your local computer—just make sure
you don’t upload this file to the Web server, or you’ll wipe out the connection file that you customized
for your Web server, and your dynamic pages won’t be able to connect to the database.
6. Type nationalEx in the username box, and nationalEx in the password box.
This is the MySQL username and password you created earlier when you set up the database.
7. Click the Select button.
The Select Database window appears. This lets you pick which database you wish to connect to. In this
case it’s the National Exasperator’s online store database.
If you get an error instead, check that you spelled localhost correctly, and that you supplied the right
username and password.
8. Select nationalEx and click OK.
9. The dialog closes and nationalEx appears in the Database box at the bottom of the window. Click the
Test button.
A window saying “Connection was made successfully” should appear.
10. Click OK to close the window that appeared when you tested the connection; click OK once more to
close the MySQL connection box.
Behind the scenes, Dreamweaver creates a small PHP file and stores it in a folder called Connections
in your site’s root folder. Whenever you create a dynamic page that communicates with the database,
Dreamweaver adds a line of code pointing to this connection file. (The file’s name reflects the
connection name you typed in step 4—here it’s connNationalEx.php.)
No comments:
Post a Comment