Section 20.2. Dynamic Web Sites: The Setup | Dreamweaver 8[c] The Missing Manual

20.2. Dynamic Web Sites: The Setup

Now that your head is spinning, and you're considering some noble career alternative like farmer, firefighter, or carpenter , it's time to set up Dreamweaver to work with an application server and database.

You can go about it in several different ways. One involves using what Dreamweaver calls a testing server . Remember how you can create a Web site on your own computer (the local site ) before posting it online for all to see (the remote site )? Here, the concept is similar. When building Web applications, it's again a good idea to keep all the "work in progress" pages on your own computer. After all, you don't want to fill up an active online database with test data, or put half-finished product pages on the Internet. But because dynamic Web sites require an application server and database, it's a good idea to create a testing server for storing and previewing dynamic pages in progress: a real Web server, application server, and database running on your own computer.

Then, when you've finished the site, you can transfer the pages to the remote site using Dreamweaver's built-in FTP feature (see Section 15.2). If you're working in a group setting with other Web developers, the testing server can be set up on a machine that's part of your group's local network. Each developer can then connect to the testing server and retrieve files to work on. (Using Dreamweaver's Check-In/Check-Out feature [see Section 15.3] is a good idea when you're working with a group of people on the same site.)

Note: You can always use your remote site as a testing server, as long as it has one of the application servers and databases that Dreamweaver works with. While this is an easy way to get started, you must contact your Web host to see what application server it uses and whether it can handle databases. In addition, you should have a fast Internet connection to the server. Otherwise, testing your dynamic pages may just test your patience.Finally, whenever you work on dynamic files directly on a live Web server, be aware that mistakes you make along the way may affect a database that's used by other dynamic pages. For example, if, while hurriedly trying to complete your Web site, you accidentally create a page that deletes records from your database, important information may no longer be available on your Web site. So whenever possible, the testing server should be separate from the server where the finished and perfected site resides.

In the next four chapters, you'll be building a dynamic Web site using ASP and an Access database. The concepts you learn will work for all of the other server models as well, though some of the details may be different. Significant differences among various server models will be mentioned where applicable .

20.2.1. Setting Up a Testing Server

You can browse static HTML files on your computer without any special software. But for dynamic data, you need a Web server and database server.

If you're using Windows 2000 or Windows XP Professional, you must install IIS on your PC. To do so, insert your Windows 2000 or Windows XP Setup CD. If the setup program doesn't start automatically, browse to the CD and then double-click setup.exe .

After rebooting, open a Web browser and type http://localhost/ into the Address bar. You see the default page for the Web servera generic IIS welcome page. Voil ! A functioning Web server. But where are those Web pages kept? The root folder for your new Web server is C:\Inetpub\ wwwroot \ on your PC.

If you're on a Mac, you must connect, via a network, to a Windows machine that has been set up as described above. You can use the Mac's built-in file-sharing command (Go Connect to Server) to do so. (Alternatively, you can follow along with the PHP/MySQL tutorial online at www.sawmac.com/dw8/.)

20.2.2. Setting Up Dreamweaver

To learn Dreamweaver's dynamic features, you'll be building a small Web application for the National Exasperator (see Figure 20-3). In fact, you'll turn the site's online store into dynamic Web pages that retrieve information from a database and merge it with already-created HTML code.

Before you begin building the page, download the tutorial files. As always, you can find them at www.sawmac.com/dw8/; click the Tutorials link to go to the tutorials page. Then click the appropriate link under the "Chapters 20, 21, 22,23 24: Dynamic Dreamweaver Tutorials" heading.

When the files have downloaded and decompressed, you should have a folder named DWDynamic on your computer, containing a folder called nationalEx_root (the root folder for this Web site) and a file called nationalEx.mdb (the Access database containing the National Exasperator ' s online store data). If you're having trouble, the Web site offers detailed instructions for downloading the files you'll be using with this tutorial.

Note: Microsoft Access doesn't actually have to be installed on your computer for this procedure to work. Windows is clever enough to read, understand, edit, and save an Access file without the database program itself.

To begin, move the nationalEx_root folder into the newly installed Web server's root folder. If you followed the directions above, the root folder should be located at C:\Inetpub\wwwroot\ . (If your Windows computer's main drive is not the C:\ drive, the root folder might be located on another driveD:\, for instance.) Place nationalEx_root inside the wwwroot folder. To make sure you've set this up right, open a Web browser and type http://localhost/nationalEx_root/index.asp in the Address bar. If a Web page appears, your Web server is set up correctly.

Figure 20-3. Whenever you need to display lots of similar information, dynamic Web pages may be the answer. Dynamic pages at the National Exasperator online store list many different products. Because all the product information is stored in a database, the dynamic pages can display a list of products (top) and then individual product pages (bottom) by using the power of Dreamweaver's dynamic Web page building tools.

Note: Unless you've changed the original setup of the Web server, you'll notice that if you just enter http://localhost/nationalEx_root into a Web browser, you don't see a Web page. That's because, without specifying index.asp , the Web server doesn't know which page to display. If you'd like to make index.asp a default page (see Section 13.1.1), you can do so by following these steps:

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:

Choose Site New Site .

The Site Definition window opens. Use Dreamweaver's Site Wizard to help you set up this new site.
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 .
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.
Click Next .

The next screen lets you choose whether you're building a static or dynamic Web site.
Select "Yes, I want to use a server technology," and then choose ASP VBScript from the pop-up menu (see Figure 20-4). 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.

Figure 20-4. When building a dynamic site, you must choose one of seven different server models. There are actually only five different application servers, but since Dreamweaver lets you use two different languages for both ASP and ASP.NET, there are two server models for each of those application servers.
Select "Edit and test locally." (See Figure 20-5.)

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 preview the pages running on a real Web server, so you can immediately test out all the nifty dynamic stuff.

Use the other two options 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 computerfor example, if you're building ASP pages but you're on a Mac (see Figure 20-5).

You should use the last option 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.

Note: If you're a Mac person who's following along with this tutorial, and you've set up a Windows machine to act as a testing server, choose "Edit directly on remote testing server using local network." Your Mac must be networked to the Windows server for this to work.

Figure 20-5. Dreamweaver provides different ways to work with dynamic Web page files on a testing server. If you don't have a working Web server on your computer, but do have an account with a Web hosting company that recognizes one of Dreamweaver's server models, you can use that server to test your files. Choose the second option: "Edit locally, then upload to remote testing server." This method is a bit laboriousyou edit the pages on your computer; then, when you test them (a simple F12 [ F12] to see if they'll work), Dreamweaver connects to your Web server, uploads the file, launches your Web browser, and loads the page from your Web site. But it's one way to get started building dynamic Web sites.

The next step involves telling Dreamweaver where to find the files for the Web site.
Click the folder at the right side of the middle of the window; navigate to and select the nationalEx_root folder on the Web server. Click Next .

The nationalEx_root folder is probably at C:\Inetpub\wwwroot\nationalEx_root\ . You've nearly completed the setup.
Type the URL of the test server in the box, and then click Test .

Dreamweaver may have already filled in this box. If the test server's 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_root/ .

If you get an error message when you click Test, you've probably entered the wrong URL. You can make this mistake when the folder following localhost in the URL is not actually on the Web server.
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 previously, you didn't specify any folder, but in step 7 you said the site was in a folder named nationalEx_root . This means site- root-relative links (see Section 4.1.3) won't work. In a real-world case, you'd probably have your site's files in C:\inetpub\wwwroot the real root folder of your local Web serverso you wouldn't run into this error. But since this is a made-up example, and you're using document-relative links (see Section 4.1.2), you're safe. So click OK to close the warning box.
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 15. But since this tutorial is just an exercise, you won't be putting it up on a live Web server.
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.)