| Lesson |
Date |
Homework Due Next Class |
Slides |
Examples, Exercises and Solutions |
| 1 |
1/18 |
 | Install Internet
Explorer (5 or 6) and Mozilla
1.02 if you haven't already. IE may be on the CD that comes with
your textbook. If you are installing IE 6.0 please also install the Java
Virtual Machine. You will need it later in the semester. |
| Download and install the free version of NoteTab
Light. You will use the editor at home and in class to do your
work. |
| Read Chapter 6, Cascading Style Sheets |
| Using NoteTab Light, copy the HTML for this
page (do a View Source, then copy the source) into NoteTab Light.
Save the file with a .htm suffix, then make all the corrections so
that it validates correctly using the W3C
Validator. Validate using
the XHTML 1.0 Transitional validator and UTF-8 encoding. Print out your corrected
source code (hopefully with no error messages, but do the best you
can), staple, put your name on the top sheet and turn in at the start
of the next class . |
|
XHTML |
A Possible Jackson Electronics Solution |
| 2 |
1/25 |
| Read Chapters 7 & 8. |
| Complete the exercise in class
(Maxwell Scientific) as homework, if you don't finish it during class
time. Don't forget to validate the CSS file and at least Elect.htm. |
|
CSS-1, CSS-2,
CSS-3 |
Examples: 1 2
3 4
5 6
7 8
9 10
11 12
13 14
Class Exercise
Maxwell Scientific
Solution (CSS is here) |
| 3 |
2/1 |
| Read Chapters 9, 10 & 11. |
| Do problem 7.26 on page 227 of your textbook. Hand in both the HMTL
with script that you wrote and the resulting web page with the
results. Output your results using document.write. |
|
Javascript-1,
Javascript-2 |
Examples: 1
2 3
4 5
6 7
8
Problem 7.26 solution
|
| 4 |
2/8 |
| Read Chapters 12, 13 & 14. |
| Do problem 10.22 on page 360 of your textbook.
Validate your XHTML and print out the results of your validation. |
| Complete this exercise that we will try to at least start in class
as homework. Write a Javascript program inside an HTML web page to
display a Times Table. You will probably need to use two sorts of
loops: an outer loop going through the rows 1-10, and an inner loop
going through the columns 1-10. Use the ability of Javascript to
derive the multiplication of the column and row. Use document.write to
create an HTML table and to create the table rows and table cells.
Validate your XHTML and print out the results of your validation. The
result should look something like this: |
|
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
| 1 |
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
| 2 |
2 |
4 |
6 |
8 |
10 |
12 |
14 |
16 |
18 |
20 |
| 3 |
3 |
6 |
9 |
12 |
15 |
18 |
21 |
24 |
27 |
30 |
| 4 |
4 |
8 |
12 |
16 |
20 |
24 |
28 |
32 |
36 |
40 |
| 5 |
5 |
10 |
15 |
20 |
25 |
30 |
35 |
40 |
45 |
50 |
| 6 |
6 |
12 |
18 |
24 |
30 |
36 |
42 |
48 |
54 |
60 |
| 7 |
7 |
14 |
21 |
28 |
35 |
42 |
49 |
56 |
63 |
70 |
| 8 |
8 |
16 |
24 |
32 |
40 |
48 |
56 |
64 |
72 |
80 |
| 9 |
9 |
18 |
27 |
36 |
45 |
54 |
63 |
72 |
81 |
90 |
| 10 |
10 |
20 |
30 |
40 |
50 |
60 |
70 |
80 |
90 |
100 |
|
Javascript-3
(Note: 3 slides corrected on 2/8/03)
|
Examples: 1
2 3
4 5
6
(Note: Example 3 is now correct!)
10.22 Solution 1
10.22 Solution 2
Times Table Solution
|
| 5 |
2/15 |
| Read Chapter 15 |
| Complete the second lab as homework: Write
a function that tests an E-Mail form field for the presence of an @
symbol, and gives a warning message if the field does not contain an
@.
Validate your XHTML and print out the results of your validation.
(Hint: you'll probably need a method of the String object, see page
408 of your text.) |
| Create
a form with a single 10 character field labeled Zip Code + 4. Write a
function called by either an onclick button event or an onsubmit form event that will put
up a warning message if all characters but the 6th
character are not numeric, and if the 6th character is not
a dash (-).
Validate your XHTML and print out the results of your validation.
(Hint: again you will probably need a String object.) |
|
Javascript-4 |
1
2 3
4 5
An E-Mail Solution
A Zip Code Solution
|
| 6 |
2/22 |
| Read Chapters 33. |
| Read this article on MIME
and plug in technologies. |
| If you haven't yet, read about Project #1
and start thinking about how you are going to do the project, which is
due after Spring Break. |
| Use your homework from Class #5 to complete this assignment.
Integrate Class #5 homework so you have a two field form containing
the E-Mail field you created that tests for an @ and the zip code
field that requires a 99999-9999 field format. Code a form onsubmit
event that ensures that both the email field and the zip code field
accept the proper input or else the form is not submitted. Validate
your XHTML and print out the results of your validation. |
|
Introduction
to DHTML
|
CSS-P: 1
2 3
4 5
6 7
8
DOM: 1
An onsubmit Solution
|
| 7 |
3/1 |
| Midterm is Next Week! Content will come from slides almost
exclusively and cover only what we manage to finish through Class #7.
Test will be closed book. An example of a Midterm I gave in ITD-110
(MS Word) can be found here
if you are curious about my testing style. |
| The federal government is driving standards for accessible web sites
through Section 508 of the Rehabilitation Act. Please read this
article on implementing accessible standards for federal web sites.
In time federal standards will likely trickle down to state and
corporations as a set of best practices, so you will have a head
start! |
| Read 21.2, 32.6.2 (in PDF on your CD, or use this
link but you'll need Acrobat Reader, which is also on your CD),
Appendix G |
|
IE DOM
Multimedia
Java Applet Integration |
IE Examples: 1 2
3 4
5
Multimedia Example
Java Applet Integration
Example |
| 8 |
3/8 |
| SPRING BREAK NEXT WEEK! NO CLASS 3/15! |
| Project #1 is due at the start of
class on 3/22. Projects that are turned in late get a 5 point
penalty for every day late. |
| Read Chapters 21 and 27. Note on Chapter 27: it's important to have
an understanding of Perl, but I don't plan to teach the language and
you will not be programming in Perl. |
|
Web
Accessibility
HTTP & SSL
Unicode |
Unicode.xml |
| 9 |
3/22 |
| Read Chapter 24 on VBScript. VBScript is a variant of the Visual
Basic programming language and it can be used to run scripts in
Internet Explorer (on the Client Side) in lieu of Javascript. It is
also used to write ASP, so a basic understanding of the syntax of the
language is important. |
| Read Chapter 25 on Active Server Pages. |
| Prepare your NVCC student server web site for doing ASP. Download
the KitesRUs Access database
in binary mode (about 1 MB). Cut and paste the code shown on the
screen from this test script
(IE: do view source) and save it in your editor as studentwebtest.asp. Then upload the Access Database
(in binary mode) to a folder of your choice on the NVCC Student web
server. Modify Line 10 of the studentwebtest.asp script so that this
line points to the location of your database: |
conn.Open
"D:\Inetpub\wwwroot\home\mhamill\ITD-210\Files\database\kitesrus.mdb"
It should be something like below where you replace userid with your
login ID (after the nvstudent\ part):
D:\Inetpub\wwwroot\home\userid\kitesrus.mdb
Save the file, upload the script in ASCII mode and try to run it.
Assuming you place it and the database in your root level folder the URL
would be:
http://www.student.nvcc.edu/home/userid/studentwebtest.asp
If it works you should see the customer table in the KitesRUs Access
database displayed. There is only one record. Each field should be on
its own line.
|
Server
Side Architecture
Server Side Scripting
Languages |
None |
| 10 |
3/29 |
| Get familiar with this online
reference on ASP and Visual Basic. You will find it useful for
doing Project #2. |
| Read this online tutorial about ASP
and databases. |
| Convert this Javascript
example into an ASP application that indicates how many days old
you are, but returns a page indicating "A person who was born on
MM/DD/YYYY is XXXX days old", filling in the numbers with dynamic
content as appropriate. You will need to add a submit button to get
the form to submit, and you don't need the Julian date field. You
might want to study this
example from class that demonstrates setting dates with ASP, but you
may also need to refer to the online reference in the first bullet
above for additional help. Note: Don't assume there is a one to
one correspondence between Javascript and ASP. You may need to find a
different approach to subtracting dates, for example. Look at date
functions provides with ASP. Print out your ASP file and the .htm file
you used, and a screen print of one successful example showing it
working correctly. Note you will have to use the Request object to
read the form variables. You will have to do this work on the NVCC
student server since you need a web server that supports ASP. |
|
Introduction
to ASP |
ask_year.htm,
which calls Calendar.asp
(IE: do view source)
subprocedure (source)
(IE: do view source)
function (source)
(IE: do view source)
form (source)
(IE: do view source)
request (source)
(IE: do view source)
cookie example (source: 1
2) (IE: do view source)
server variables (source)
(IE: do view source)
Class
#10 Lab Solution (Times Table) (source)
(IE: do view source)
|
| 11 |
4/5 |
| Read Chapter 20 on XML. |
| Only after reading Chapter 20, read this
link on the XML.COM site about XPath and XSLT. |
| Complete the Lab and hand in as homework. In the lab, download the
Books database (link in the right column) and upload it in
binary mode to your NVCC Student web site. Write an ASP script that
will display all the rows in the books table of the Books database.
The columns in the table are named: ISBN (text), title (text), price
(currency) and quantity (Number). Data must be displayed inside an
HTML table with the top row containing <th> tags with the names
of each column. Use the VB Script FormatNumber function to format the
price column so that it shows cents in the price. Right align data for
the price and quantity table cells. Print out your .asp file and print
out your browser screen showing the content of the database. |
| For homework you will actually be starting Project
#2! Try to build on your knowledge from the books lab to create an
ASP file that will perform similar logic for the KitesRUs database, on
the Products table. In this case you will not want to print the
picture column because this is actually an image of a kite and
displaying it is beyond the scope of this course. The product ID field
is a system generated number and does not need to be printed out
either, although you can if you wish. As with the lab, print out your
source code and your browser screen and turn it in. I will give you
feedback that will help you with your project. (Note: if you do this
part successfully you have probably already earned a C in the final
project!) |
|
ASP
and Databases |
Book Example (source: 1
2 3)
(IE: do view source)
Books Database (for lab, will
need to download then upload to your web site in binary mode)
Book lab
solution (source)
(IE: do view source)
Days Old Solution (source)
(IE do view source)
|
| 12 |
4/12 |
| Start or continue work on Project #2. It's important to
really work on it since the project is due in two weeks! Try to
get as far as you can and bring a list of problem issues to the next
class. Feel free to send me email about issues you are having during
development so I can point you in the right direction. Don't
procrastinate! |
| No reading this week. |
| If you want to turn in an extra credit paper, the information
on the syllabus is all the guidance I am
providing. The big caveat is that it must be for a prominent web
site and it must have eCommerce capabilities, i.e. stores
and retrieves information dynamically. |
|
Intermediate
ASP
XML
Technologies and the Web
|
Client
Side XSL Example (requires IE 6+)
Server Side XSL Example in ASP
(source) (IE: do view source) |
| 13 |
4/19 |
| Finish Project #2! It is due at the start of the next class! |
|
Site
Searches, Metrics and Security |
None |
| 14 |
4/26 |
| FINAL EXAM IS NEXT WEEK! |
| Bring a self addressed stamped business size envelope to the final
exam if you would like a copy of your final exam. |
|
Web Site System Design |
None |
| 15 |
5/3 |
| FINAL EXAM! PLEASE BE ON TIME!! |
|