Overview
The purposes of this assignment are to familiarize you with the use of the laboratory facilities for the course and to establish standard procedures for developing web projects for the course.
Procedure
-
Log into your account and verify that it is working correctly.
Log into any one of the computers in A-205 or A-227 using your account name for this course, which consists of your last name followed by the digits “081” all as a single lower-case string. Use the password given to you in class, and remember that you will be required to change it to something secure the first time you log in.
The names of the computers are:
A-205 A-227 birch apple cherry fir chestnut juniper elm mimosa ginkgo peach hemlock pine hickory plum spruce sycamore walnut Room 205 is an “open lab,” which means you can use the computers there any time you want. The secretaries in the CS Department Office (A-202) will open the lab for you if it is closed. Room 227 is a closed lab, so you will not be able to sit at the computers in that room to use them. However, all of the computers are accessible from the Internet. If you have access to a computer running Windows XP with a broadband connection, you can use Remote Desktop to log in. From the button, go to , to , to , and you will find it. When it asks you what computer you want to connect to, pick one of the names above and add the domain name “.cs.qc.edu” to the computer name. For example, you would log into ginkgo by entering ginkgo.cs.qc.edu.
If you are using a Macintosh, OSX comes with a Remote Desktop program you can use in the same way as the Windows version. Under preferences, be sure to set a screen size and resolution to match your computer’s screen. The default value is very low resolution, making it difficult to use.
There an open source version of Remote Desktop at www.rdesktop.org that might be useful if you are running Linux. But I have had no experience with it.
When you use Remote Desktop, select one of the computers in A-227 so that students who are on campus will be able to use the computers in A-205. The exception to this rule is from 5:00 to 6:15 pm on Tuesdays and Thursdays, when there is a class using room A-227.
Use Windows Explorer to verify that your “My Documents” directory contains a directory named “My Web Pages.” That directory should already contain a file named template.xhtml, which you will be using as a starting point for the web pages you write for this course.
Make a copy of template.xhtml named index.xhtml in the same directory.
Log off the computer you used and log into a second one.
On the second computer, verify that your index.xhtml file shows up in your My Web Pages directory, indicating that your “profile” (settings) were successfully copied to the domain server (maple) when you logged off the first computer and that they were then copied to the second computer when you logged into it. If you have any problems with this step, contact Dr. Vickery for help before proceeding with the remainder of the assignment.
-
Edit index.xhtml and test it.
Use any text editor to change the title and h1 elements of your index.xhtml file from the word “Template” to your own name. It would be best to use a programming editor such as Vim, or even the full web IDE, Dreamweaver. However, it is possible to make the change using a simple text editor likeNotepad. If you decide to do this step using Notepad you have to put quotation marks around the file name when you save it or Notepad will add “.txt” to the end of the file name (index.xhtml.txt), and the web server won’t be able to display it properly because of the wrong extension.
There are links to some introductory material on using Vim and Dreamweaver below.
There are four ways you can try to view your new index.xhtml web page in a browser, but only three of them will work!
- (This is the technique that does not work!) Click on the file using Windows Explorer. Windows recognizes that .xhtml files are web pages and tells the default browser to show the page. But our template file includes some server-side scripting code written in PHP, and its presence will confuse the browser, which will display a cryptic error message.
- Start Firefox, and type the URL “localhost/~astudent081” into the location bar, substituting your own account name for astudent081.
- This technique is the same as the previous one, but substitute the name of the computer you are using for the word “localhost” in the URL.
- This technique is the same as the previous one, but enter the Fully Qualified Domain Name (FQDN) for the name of the computer you are using. The proper FQDN for the computers in the lab is the name of the computer name followed by “.cs.qc.cuny.edu” (ginkgo.cs.qc.cuny.edu, for example), but you can safely leave out the “.cuny” part if you want to.
Note that only the last technique will work for accessing your web page from another computer, and even that technique will only work while you are logged into the computer whose FQDN you use.
Now copy (don’t move) your web page from your “My Web Pages” directory to C:\htdocs and verify that you can view it by specifying just the computer name in the address bar.
-
Another way to work on the assignments.
If you have Dreamweaver or another web development tool available off campus, you can install Apache on your own computer and develop and test your code using that environment. (You can download Apache from httpd.apache.org.) Then you can use Remote Desktop to log into your lab account and copy the assignment files to your My Web Pages directory, test them there, and then submit the assignment (see below) in the usual way.
When you start making the Remote Desktop connection using either Macintosh OSX or Windows, there there is an “Options” button that takes you to a tabbed panel. The third tab is called “Local Resources”, and there is an option there to connect your local disk drives to your remote desktop login. With that option checked, you will be able to drag and drop files between your local computer and the one in the lab using Windows Explorer on the remote computer.
-
Start using a programmer’s editor.
There are two tools you need to become familaiar with. One is a programmer’s editor, and the other is an Integrated Development Environment (IDE). The IDE for this course will be introduced in the next assignment.
There are many programmer’s editors available, and you are free to use any one you like in this course. The one that is set up and ready to go in the lab is called Vim, and there is a small Using Vim web page for you to use to learn the basics. Compared to a text editor like Notepad, a programmer’s editor gives you much more help in writing correct and easy to read code. Features of a programmer’s editor include: syntax highlighting, brace matching, automatic indentation, and tab character management. These topics will be mentioned in class.
Submit the Assignment
When you have completed the assignment and tested it in all the ways listed above, send me an email message that says CS-081 Assignment 1 in the subject line and that contains your real name and account name in the message body. I will get a copy of your work from the server (maple) to look at.