CSC 153 Grinnell College Spring, 2005
 
Computer Science Fundamentals
Laboratory Exercise
 

An Introduction to the World-Wide Web and CGI Programming

Goals

This laboratory exercise provides experience with the basic format of documents which you routinely find on the World-Wide Web. The lab also suggests some initial experiments regarding CGI programming, which allows a Web developer to tailor documents to an individual Web user.

HTML Format

The document sample.html shows several basic elements of a typical Web document

  1. Use this link to view this document in your viewer.

  2. Once you have this sample document in your viewer, move to the View option in your browser, and select the Page Source option. This will show you the original document sample.html, as sent by the server to your browser (and before the browser has done its formatting).

  3. Compare the original sample.html document with what the browser displayed when you first accessed this page. Note how the browser interprets the formatting instructions in displaying the material.

Creating and Editing an HTML Document

Follow these steps to copy this sample lab to your account in a way that will be accessible to the World-Wide Web:

  1. Before anything in your MathLAN account can be accessed on the Web, you must make your home directory accessible. To do this, open a terminal window and give the command

    chmod 755 ~
    

    at the prompt. (The symbol ~ stands for your home directory.)

  2. Any materials related to the World Wide Web belong in a subdirectory of your home directory named public_html. If you have no such subdirectory, create one by giving the command

    mkdir ~/public_html
    

    in the terminal window. This directory, too, must be accessible; give the command

    chmod 755 ~/public_html
    

    to make it so.

  3. Copy the sample program to your public_html directory in two steps: First move from your home directory to the public_html directory with the command:

    cd public_html
    
    Then copy the file to your current directory (which is public_html) with the command:
    cp  ~walker/public_html/courses/153.sp05/labs/sample.html  sample.html
    

    The copy of the file will have the name sample.html .

  4. Share your copy of sample.html with the command:

    chmod 755 sample.html
    
  5. Load this file into your Web browser by entering the URL:

    http://www.cs.grinnell.edu/~yourusername/sample.html
    

    Note that when you specify a URL, the Web server automatically looks in your public_html directory, so you do not need to include that directory name in what you type.

  6. Edit this file with Emacs, trying some variations of the wording and trying some of the formatting tags described above. At the very least, change the address at the bottom of the Web page to your username and file name. Also, update the date created and last revised.

    After each modification, use the reload button on your browser to check your revised version of sample.html .

  7. Edit the file further, leaving out the initial < html > tag. Reload and describe what happens. Then reinsert this tag, and try omitting some other closing elements, reload, and describe what happens.

  8. Change the <h3> to <h2> or <h1> or <h4>, and describe what happens in each case. Do you see any progression in style or format from <h1> to <h2> to <h3> to <h4> ?

Experimenting with CGI Scripts

In order to experiment with the above program, you will need to copy both the cgi script and program to you account. By convention, these should be put into a subdirectory cgi-bin within your public_html account, and these files must be shared for others to access. If such a directory has not been set up in your account previously, this task may be done with the following steps.
  1. Within a terminal window, be sure you have established a public_html directory, as described earlier in this lab.

  2. Check that you have moved to that directory by typing pwd into the terminal window -- this command (print working directory) indicates what directory you are working with.

    If you are not in the right directory, type

    
    cd ~/public_html
    
    to move there.

  3. Create a subdirectory cgi-bin and share it, using the commands:
    
    mkdir cgi-bin
    chmod 755 cgi-bin
    

  4. Move to this new directory with the command
    
    cd cgi-bin
    

  5. Now copy the sample cgi script and program to your account, and share these files:
    
    cp ~walker/public_html/cgi-bin/sample-script.cgi .
    cp ~walker/public_html/cgi-bin/sample-script.ss .
    chmod 755 sample-script.cgi
    chmod 755 sample-script.ss
    
    You are now ready to view the results of your copies of these files by using the URL
    
    http://www.cs.grinnell.edu/~yourusername/cgi-bin/sample-script.cgi
    

  6. The above discussion noted that the cgi script (in sample-script.cgi) runs mzscheme scheme in the same way one might interact with a terminal window. To test this out, move to a terminal window, and try these experiments with /usr/bin/mzscheme:

    1. Type the command /usr/bin/mzscheme, and run the sample-script program using
      
      (load "sample-script.ss")
      
      Note the output received.

    2. After exiting Scheme in the terminal, check the mute-banner option of mzscheme by typing
      
      /usr/bin/mzscheme −−mute-banner 
      
      Identify the difference between this interaction and a typical Scheme session.

    3. Next, try the load option in a terminal window:
      
      /usr/bin/mzscheme −−load sample-script.cgi
      

    4. Finally within the terminal window (without Scheme running), type the full script command from the cgi command:
      
      /usr/bin/mzscheme --mute-banner --load /home/walker/public_html/cgi-bin/sample-script.ss
      
      and observe the output. Note that this runs mzscheme using the file sample-script.ss without any additional banner or prompting information.

  7. Use Emacs to edit your cgi program sample-script.ss. Try making various changes, and see what happens when you reload your URL page.

Preview

As noted earlier, cgi scripts and programs may be helpful, in that they allow a Web server to return information specifically tailored to the user.

One such cgi script is http://www.cs.grinnell.edu/~walker/cgi-bin/what-i-know-script.cgi

  1. Try this link to see what happens.


This document is available on the World Wide Web as

http://www.cs.grinnell.edu/~walker/courses/153.sp05/labs/lab-cgi-intro.html

created October 12, 1998
last revised March 7, 2005
Valid HTML 4.01! Valid CSS!
For more information, please contact Henry M. Walker at walker@cs.grinnell.edu.