Main 465 Page (Fall 2001)

350/570: 465: Writing HTML for the Web:

Unix Skills 1: pine, pico, public_html, index.html, chmod 755

These exercises require
  • an account on pegasus, a Web server using Unix
  • pine, a mail reader (in pegasus)
  • pico, an editor (in pine and Unix).
    You may substitute emacs for pico if you know it. For help with Unix, pine or pico, use the Rutgers lab handouts sheets.

    • CLASS EXERCISES:

    1. LOGGING IN: Log in to pegasus -- the method will depend on how you connect.
      Note: You may log in
    2. directly from a computer wired into a Rutgers network or
    3. remotely from home, work or elsewhere -- see the RUCS handouts .
      4. Login: [username]
      Password: [password].
    4. READING YOUR E-MAIL: At the pegasus prompt, launch your email reader. The fastest command
      pine -i
      will take you directly to your in-box.
    5. Find and read the message called "HTML Template 0" (beginner's slope) or "HTML Template 1" (intermediate slope) -- you can switch later: To read it, highlight it and press [Enter]. You must use keystrokes: Pine has no mouse support.
    6. Export the email message as an independent file by typing
      e
      and then specify that the new file should be called index.html -- UNLESS you already have a file by that name, in which case use a different name, such as "index1.html" or "home.html." (Unix does not create backups when you overwrite old files.)
    7. Quit pine: To quit pine, type
      q
      which will return you to the pegasus prompt.
    8. EDITING "INDEX.HTML" IN PICO: To launch pico and edit index.html, type
      pico index.html .
    9. Cleaning up "index.html": Delete all the e-mail headers and other material above <html> and below </html>. If you are new to Pico, use the cursor and Backspace/delete keys.
    10. Personalizing "index.html": As appropriate, while you are editing the file you may wish to add your own name and personal information. You may make other changes or additions later -- at any time.
    11. Save and exit: When finished, save your work and exit pico, type
      CTRL-X, then y. Hit [Enter]) if index.html appears, or type in the file name.
      Note: If you made a terrible editing mistake -- from which you cannot recover -- go back to your e-mail and export the message again. In this case, when you are asked "overwrite or append," type o to overwrite (replace) the spoiled old file with a fresh one. You should plan safety fallbacks in all future computer work. Save frequently -- and never do elaborate unsaved work online or before printing. Do you know why?
    12. USING UNIX TO VERIFY THE FILE: At the pegasus prompt, verify that the "index.html" exists by typing the list files command:
      ls
      (The first character is the letter "el.") In typing unix commands, use lower case (make sure caps lock is off) and do not add or omit spaces.
    13. File details: To get more information about "index.html," type the list - long command:
      ls -l
      (To the original characters "es" and "el" we added a space, a dash, and then immediately another "el.")
    14. Where am I? To find out where you are, type the print working directory command:
      pwd
      The answer should include some Rutgers system information and the name of your directory -- your username.
    15. CREATING THE PUBLIC_HTML DIRECTORY, PUTTING INDEX.HTML THERE. AND ACTIVATING IT: The "public_html" directory is required to use Pegasus as a web server. First, let's make the directory called public_html. Type:
      mkdir public_html
      Use the underscore, not the dash, without extra spaces or capital letters
    16. Putting the index.html file into the public_html directory: We could either move or copy the file to the new directory. To be safe, let's copy the "index html" file from the initial root directory to the newly created "public_html" directory. Type
      cp index.html public_html
      where "cp" is Unix for copy -- and there is one space and nothing else between each of the three command line elements Never add spaces, capital letters, or other fancy ornaments to Unix filenames.
    17. Changing the active directory: Now we must change the focus to the public_html directory by typing:
      cd public_html
      where "cd" is Unix for change directory.
    18. Verify directory: Since your prompt will not change to inform you of this new focus, to verify where you are, type
      pwd
      The pegasus prompt should echo [system information]/[username]/public_html
    19. Activation or changing permissions: Unix security lets the owner (that's you) decide who can read, copy, or write to an file. We usually want anyone to read or copy Web files but only you (the owner) to edit or write to it. To change the permissions mode to the appropriate value, type
      chmod 755 index.html
      -- by the way, "chmod" is pronounced "chmod" or "shmod" -- and if you forget this step, even you, the owner may get a permissions error message when you try to read the file.
    20. BROWSING YOUR WEB PAGE: You are now ready to use your browser to look at your first Web page. If there is a browser icon in the bottom tray, click to launch the browser, If there is no browser icon there, activate the Desktop and use the browser icon there. If you cannot see the Desktop, press Windows key-M, where the Windows-key is in the bottom row of your keyboard and next to the ALT key. After launching your web browser (Internet Explorer or Netscape Navigator), open the template in which to type your filename, usually FILE - OPEN or CTRL-O. Type in your file address as
      http://pegasus.rutgers.edu/~[username]
      where username is your pegasus login name (the "http://" portion is optional).
    21. Note: Unix uses the frontslash character (/) to indicate directory borders, unlike microcomputer systems, which use the backslash character(\).
    22. Notice too that this Web address is slightly different from the Unix form of the filename. In the case of Web servers such as Pegasus, the Web browser accepts ~[username]/filename because it assumes the public_html working directory. But the Pegasus command line and Unix programs such as Pico or Emacs require the full form of the address, ~[username]/public_html/index.html.
    23. If you understand this, what's with that squiggly tilde character (~)?
      24. The browser will realize that you at are pointing to your home directory and will look for index.html, the default filename it expects. If you wish to be more complete and speed up the work of your browser, use the full address
      http://pegasus.rutgers.edu/~[username]/index.html

      Once the file is loaded you can treat it as any other, saving or printing the file, changing font size or window size, or viewing the source code.

    24. MAKING CHANGES IN YOUR WEB PAGE: After examining this web page, you may make any additions or improvements you wish. If you have both your web browser and your Pegasus account or file editor still loaded, you can use ALT-TAB in Windows to switch between applications. Switch back to your Pegasus account (if necessary, connect again to Pegasus and change to the public_html directory). At the Pegasus prompt, use pwd to confirm that you are in the right directory, and reload the file for editing
      pico index.html
      If you are looking at the old version of the file you are in the wrong directory.
    25. Make editing changes (or corrections) and save the file as before.
    26. Switch back to your browser and reload the changed file. The reload command is
      F5 in Internet Explorer -- CTRL-R in Netscape 4+.
      Pause a moment before saving and reloading or you may get the old version of the file again. (If you're really unlucky you may get the apparent gibberish of a half-saved file.) Sometimes browsers lazily reload old versions from the memory cache instead of reading the new version from disk. By the way, using a text editor and web browser in a parallel (called "multitasking") is fundamental in writing and developing Web pages. Several Windows/Mac programs support this dual activity
      Note: Obviously, not all Web pages start life as emailed templates. There are several other ways of creating a file, which we'll list but won't explore here:
      Write it from scratch in a text editor.
      Use HTML editing software for help.
      Use an existing web page as a structural model.
      There are also several other ways of publishing your files on Pegasus, which we'll just list.
      Write it in Pico (or Emacs) on Pegasus -- no uploading.
      Write it in a PC text editor and use the Windows clipboard to transfer blocks of text to a companion file opened in Pico.
      Use Hyperterminal TRANSFER to upload the file from your PC or your account.
      Use FTP (file transfer protocol) to upload files to your account. This is the only method that will handle binary (non-text) files such as graphics, programs, music, zip files, etc.
    27. YOUR TROPHY! Since you've gone this far you might as well print it out to show anyone you care to impress -- assuming your friends and family and everyone else you know are not too jaded.

    Send email comments to ehrlich@andromeda.rutgers.edu [465f01_unix1.htm, last edited 9 September 2001]