CISC Fall 2018

First, read basicUnix.html about logging into the University Unix systems.

A Different Type of Lab

We've been writing a lot of programs and creating files. Every webpage you look at with a browser is a file you have downloaded to the computer you are using. This is a very powerful idea.

We will create files using a text "markup" language called html so that we can have them look nice in a web browser. You will be given a template in html; all you have to do is change it slightly.

Creating your own web pages on Strauss

Creating a personal web page

  1. If you already have a personal web page on strauss (one that comes up when you type http://udel.edu/~userid, where userid is your UDelNet ID), then skip to the next goal (creating your CISC106 web page). Otherwise, cd into your ~/public_html directory.

  2. Use emacs (or other editor on Strauss) to create a file in that special directory. The file must be named "index.html". The contents of that file should be something like the following:

    <html>
      <head>
        <title>Sara Sample's Web page</title>
      </head>
    
      <body>
        <h1>Sara Sample's Web page</h1>
    
        I had to do this <b>web page</b> for my <a
       href="http://www.udel.edu/CIS/106h/18F/index.html"> Honors CISC106 class</a>.
       Right now it is pretty minimal, but I hope to make it better later.
    
      </body>
    </html>
        

    Here's what that looks like once it is formatted by a web browser:

    Sara Sample's web page

    I had to do this web page for my Honors CISC106 class. Right now it is pretty minimal, but I hope to make it better later.

  3. After you save the file, you need to type in the following shell command:
    chmod a+rx ~/public_html/index.html

    The chmod command makes files and directories in your public_html directory accessible to all users on strauss, as well as all users on the World Wide Web. You need to repeat this command each time you add new files under public_html that you want users of the Web to be able to access. NOTE: it only fixes the permissions of the files in this directory! If you have a subdirectory, you need to execute the command there.

    More details: You need to repeat this chmod command each time you add new directories or files under public_html that you want users of the Web to be able to access. chmod is short for "change mode", where the "mode" of a file is the part that specifies who can edit/read/execute the file. To see file modes, use the shell command "ls -al". Directories (including public_html) need to have read/execute permission (in the 'ls -al' their mode should appear as 'drwxr-xr-x') while files can appear as read-only: '-rw-r--r--'. You have to look at a unix/linux shell and play with ls and chmod for this to make any sense.

  4. To see that it works, type into a web browser:
    http://udel.edu/~userid

    If it doesn't come up, make sure you set all your file permissions correctly. The most common problem is not changing permissions correctly. If you try that again, and it still doesn't work, check with your TA or with a classmate for help. Be sure to understand how to use the chmod command on both files and directory names.

Creating a CISC106 web page

  1. cd into ~/public_html/cisc106. Now, create an index.html file in this directory containing html code similar to the personal page. (Yes, that is two different files with the same name, but they are in different directories so it's ok.)
  2. Now, add an image to your web page. Find an image on the Web (or from wherever you want; I put two .jpg pictures in the labs directory that you can use until you find something better) and copy it into your public_html/cisc106 directory. Then, put a reference to the image in your CISC106 Web page, using the HTML tag <img src="imagename.png">, where "imagename.png" is the (case-sensitive) name of your file. The browser will then include the pic in your page. If the picture doesn't show, check the file name, directory, and permissions.
  3. After you have created the index.html file and/or copied your image file into your public_html/cisc106 subdirectory, you may need to perform the chmod command on the specific file to get the web page to come up when you use the URL http://udel.edu/~jsample/cisc106.

Remember, this is only one part of the lab.


Parts of this lab were borrowed from Phill Conrad and Terry Harvey with permission.