111 Lab Week 1
Information Architecture

Labs Start On the Hour

Please arrive at 026 Kla early enough to be seated and do the following:

If you arrive late, your lab instructor will not be able to take time away from the other students to fill you in on what you missed.

Getting Ready

For a review of HTML basics covered in 110, read Create a Home Page on uoregon.edu in 21 Minutes or Less. Then attend one or more of the special Help Sessions scheduled during weeks 1 and 2.

IT Applications for 111: The DuckWare CD (available at 151 Mck) contains Firefox, TextPad, and SSH for installing on your home computer. For related information, see the 111 Resource page.

SKILL ASSESSMENT NOTATION: In 111, we'll assess skill-acquisition using three levels: E (Exposure), F (Familiarity), M (Mastery).

Micro Labs on Campus: In addition to 026 Kla, You can work in 013 Kla and 101 Mck or in any CC microlab on campus.

Saving your lab work: The My Documents folder on the PCs in 026 Kla is cleared periodically by the systems staff. If you want to save a copy of your lab work, use SSH/FTP to upload your files to your uoregon.edu account. Alternately, bring a USB drive with you to your lab.

All the software we use in the lab (SSH, TextPad, FireFox, etc.) is on the DuckWare CD, and can be installed on your personal computer. The DuckWare CD is available from MicroHelp, 151 McKenzie.

For notebook computer enthusiasts, you are welcome to use your notebook in lab, which has WiFi access.

GOALS FOR WEEK 1: At the end of lab, your skill level should be at E-level with the following topics:

Information Architecture for CIS 111.
TextPad's Preview in Browser command.
SSH and Basic Unix Commands for Web Development.
How to create a simple web page using TextPad and ftp it to uoregon.edu using an SSH/FTP session (a review of IT skills covered in CIS 110 at the UO).

LAB OUTLINE

  1. Lab lists: You will not be using DuckWeb to drop/add labs; we will handle it informally instead. (Note to GTF: The lab lists are available by request from Cheri-- do this before going to your week 1 lab.)

    For labs that are full, three names may be added beyond the max, on the condition that the added students may have to watch over someone's shoulder when everyone registered attends the lab. Note that originally registered students up to the max are guaranteed a seat. If you are one of the extra students added over the max and you have a notebook computer, bring it to the lab which is a wireless hotspot (and there are also Ethernet connections in the walls of B26 Kla if your notebook is not wireless enabled.)

    If your name is added to a new list, be sure it is deleted from the original list.

  2. SSH for Remote Login; Basic Unix Commands.

    It pays to increase your Unix power. Follow along as your GTF guides you through Unix Boot Camp:
    Start SSH and use Quick Connect: 
Host Name: shell.uoregon.edu	
User Name: enter your uoregon.edu username
Click Connect; click Yes is prompted about a digital certificate; enter your uoregon.edu password

Your SSH window now displays the Command Prompt for the login shell on uoregon.edu

	shell means "command interpreter"
	bash (Bourne Again Shell)
	login prompt, shell  prompt ($)

Your lab instructor will explain these basic Unix commands:

print working directory: pwd
    *** (memorize the Unix pathname for your home directory)***
*** (memorize the Unix pathname for your home directory)***
*** (memorize the Unix pathname for your home directory)***

list directory contents:
   ls
   ls -a
   ls -l
  
create new directory:  mkdir
change directory: cd
tab key: file name completion

Use  mkdir to create a directory named "public_html" 
(Do this only if this directory does not already exist in your home directory.)

If you make a spelling error, your can use the following commands to delete
or rename a directory:

rmdir ("remove directory")
mv ("rename")

To delete a file that is not a directory:  rm

Move to the 111 directory and make directories named p1 and p2.

Quiz Questions: 

Translate to Unix:
   "move to your 111 directory"
   "make a 'p1' directory in your 111 directory"
   "make  directories named p2, p3, p4, p5 in your 111 directory"
  3. Most of the above tasks can be completed "point and click" by using SSH's file transfer window: open one up (if not open already) and do the following using the GUI (not the command line). Use No Blanks, Punctuation or Special Characters in File Names (dashes and underscores are OK): 
    Move to the 111 directory and make directories named p3, p4, p5, examples, css, js, and images.
    
Make a directory; rename it; and then delete it.
    Check a folder's permissions ("access mode").
    If you are a Unix enthusiast, you can learn how to customize the shell's prompt. Read Generic UNIX Interactive Prompts.

  4. Read 111 Information Architecture: Concepts & Terms.

    Create a site root folder (/111/) on your computer or USB drive.


  5. Install a simple web page on uoregon.edu.

    Start TextPad.

    Click-right on this link: xhtml-starter.html. Choose Save Link As.. and download it to /111/examples/xhtml-starter.html.

    Open xhtml-starter.html in TextPad, modify it by adding your name in the h2 header and changing the title element.

    Use TextPad's Preview in Browser command (the "globe" icon on the toolbar) to see your modifications.

    Open a SSH/ftp window and use drag-and-drop to upload xhtml-starter.html from your computer (the local host) to ~/public_html/111/examples/xhtml-starter.html on uoregon.edu (the remote host).

    (Note that "~" is an abbreviation for the path to your home directory on the server. For example, /home7/jaquesBonhomme/.)

    Verify that the transfer was successful by opening the page in your browser. Replace "DuckID" in the following URL with your actual DuckID:

         http://www.uoregon.edu/~DuckID/111/examples/xhtml-starter.html

  6. 'Hello, World' JavaScripts.

    Save xhtml-starter.html as /111/p1/hello-v1.html. Insert a script element in the body section. (Note that the type='text/javascript' attribute is no longer required by current browsers.) When the script executes it should use the HTML DOM's alert() function to greet the user. Preview the script.

    Save hello-v1.html as hello-v2.html. Modify the script by replacing the call to alert() with a call to the HTML DOM's document.write() function.

    Save hello-v2.html as hello-v3.html. Modify the document as shown in this Display an Alert Box example. The button should read Say Hello. When clicked the alert should display, Hello, World.

    Save hello-v3.html as hello-v4.html. Study the JavaScript from p. 24-28 of ch. 1 of your text, that prompts for the user's name. Modify hello-v4.html as follows: The button should read, Greet By Name. When clicked, the user should be greeted by name.

    Note: You will not have time to complete these exercises during your lab. Complete them on your own outside of lab, to be submitted as part of Project 1.

  7. Upload all Hello World JavaScripts to /111/p1/ on the remote host. As you complete each script, use SSH/sftp to upload it to your /111/p1/ folder on the remote host, uoregon.edu.

HTML Review

For a review of how to create a web page and upload it to uoregon.edu, read How to Create a Web Page on UOregon.edu in 21 Minutes or Less.