To
e-mail your instructor: JilMac
Welcome "Programming for the Internet" Class!
It’s going to be an exciting semester; we will be learning how to really make things work on a web site. To be able to understand, actually read and do things will cement the concepts you learned in Web Design I.
Assignments will be placed by the students on the CCV web-site for this course: http://online.ccv.vsc.edu/CIS-2140-VT99/
Note: Reading assignments for JavaScript for the World Wide Web are for the Fifth & Fourth editions. These editions are basically the same in fact most chapters are identical. In Edition 5 chapters 2, 3, 4, 5 were split and chapter 17 added. I have noted this in the reading assignments.
Assignment 1:
Part 1:
Read the 1st 3 chapters of JavaScript for the World Wide Web [4th edition read chapters 1 - 2]. The first few chapters are pretty straight forward, but the third chapter really gets into things. Loops & Functions, don’t be scared off, there is a lot to learn, but we’ll have a good time doing it together. We will be doing many of these examples in class – it will be exciting to read and do, and really use these books you paid so much for!!!
Part 2:
Search google.com or your favorite search engine and find 3 tutorials and work with them. This should take at least 2 hours. Document what you found, what you did, and what you liked and didn’t like. You should come up with a list of questions and comments, to discuss in class. If you go to Google.com and type in “JavaScript Tutorial” these are just a few of the links you’ll find.
http://hotwired.lycos.com/webmonkey/programming/javascript/tutorials/tutorial1.html
http://www.pageresource.com/jscript/index2.htm
http://www.w3schools.com/js/default.asp
===========================================================================
Assignment 2:
Part 1:
Read chapters 3-4 of JavaScript for the World Wide Web [4th edition
read chapter 3]. This is a big chunk,
but it's the bulk of what can happen, and how JavaScript can make it happen.
We will be doing the scripts in each chapter, so you should try several of
them.
* You should also start looking over Appendix B "JavaScript Reserved Words",
it's only a few pages, but you'll start seeing these words and wonder how you're
supposed to know they are reserved.
DON'T TYPE That CODE !!
Did you read the Introduction of our text "JavaScript for the World Wide Web" on page xiii; it states the link to the web companion of the text: http:\\www.javascriptworld.com has many examples. Click the Scripts link (to the left of the picture of the book) to see them.
* Clicking the link in the left hand column, shows you what
the code does.
* Clicking the link on the right hand column, show you the code,
which you can
cut and paste into a page of your own.
TWO things to remember when copying code:
1 - The SELFISH REASON is to link to where you got it, because if you use it a lot, you'll want to go back. The web is so big, and there are so many places where you can find code, if you don't document it as soon as you get it, you'll forget and not be able to get back there.
2 - The ETHICAL REASON - you need to cite where you got the code, and who
wrote it.
You can always explain in the comment what you changed and why,
but if your going from someone else's code you need to cite.
Besides, when you become a programmer, you get more credit for knowing where
to find code so you don't have to re-invent the wheel, then you will by writing
it yourself.
Part 2:
Incorporate two JavaScripts from Chapters 2-4 into your web site [4th edition read chapters 2 & 3]. You can assume from this point on, that I will request incorporating at least 2 scripts from each chapter into your site. You can choose which ones, everyone is at a different level, and has different needs in their own web sites, also there are some obnoxious scripts, that they recommend you NOT use on your website, but they are fun to do.
You can send me an e-mail with the links to the page, and an explanation of
what you did, what you used, and why.
* Did it work the way you expected?
* Did you like the results?
* Would you use this on a future page?
===========================================================================
Assignment 3:
Part 1:
Read chapters 5-6 of JavaScript for the World Wide Web [4th edition read chapter 4]. We will also start (if I haven't mentioned it before this) to talk about Objects. You will notice a lot of name_of_something.name_of_something_else.name_of_a_third_thing and wonder how does the computer knows what to do! Objects are something that we will be discussing from this point on. So start to look over Appendix A - page 451 - The BIG Object table. See if you can tie this in to page 86, Script 5-3 in the function rotate() example.
Part 2:
Incorporate two JavaScripts from Chapters 5-6 into your web site.
Chapter 6 covers Frames, which are controversial and not used a great deal, but in certain instances are very valuable.
===========================================================================
Assignment 4:
Part 1:
Read chapter 7 of JavaScript for the World Wide Web [4th edition read chapter 5].
Read chapters 1 & 2 of JavaScript - The Definitive Guide. O'Reilly books are very comprehensive, and not known for their ease of reading - so I have held off introducing you to the reference manual until now. However, you need a good reference book for any language you are learning.
You need a nice user-friendly text book, and you need a hearty reference book. We will be using both.
Part 2:
Incorporate two JavaScripts from Chapter 7 into your web site.
Did you read the Introduction of our text "JavaScript the Definitive Guide" in the Preference on page xv, it states the link to the web companion of the text: http:\\oreilly.com/catalog/jscript4/ you will see listed a link to the examples. Download the .zip compressed version (Unless you are using a Linux machine, then you can get the .tar version). Here is what the ReadMe file had to say:
Examples From
JavaScript: The Definitive Guide, Fourth Edition
This directory contains the source code for all the numbered examples in
the 4th edition of JavaScript: The Definitive Guide. The file name
indicates the chapter and example number, and the extension indicates
the example type. An example with a .html extension contains HTML tags
and can be run and displayed in a web browser. An example with a .js
extension is a file that contains JavaScript code only, without HTML
<
script> tags, and cannot be usefully loaded into a browser. There is
also one example (22-1) that has a ".java" extension because it contains
Java code instead of JavaScript code.
A few of the .js examples are substantial enough that you may find them
useful in your own HTML pages. In these cases, there is a copy of the
numbered example file that is given a more descriptive name. For
example, Drag.js is a copy of 19-2.js. When an example is given a name
like this, it has typically been referred to with that name in the book.
These files were all created using a text editor on a Linux system, so
they use the Unix line terminator \n. If you find that the lines all
run together when you view them on another operating system (such as
Windows), you should use a text editor or file viewer that recognizes
the Unix line termination convention. (The Windows "Notepad"
application typically cannot display the file correctly, for example.)
--> Legal matters: these files were created by David Flanagan, and are
Copyright (c) 2001 by David Flanagan. You may use, study, modify, and
distribute them for any purpose. Please note that these examples are
provided "as-is" and come with no warranty of any kind.
David Flanagan
===========================================================================
Assignment 5:
Part 1:
Read chapter 8 & 9 of JavaScript for the World Wide Web [4th edition read chapter 6 & 7].
Chapter 8 is Forms - this is one of my personal favorite uses of JavaScript. Forms are where you cleanup data on the client side before the data is transferred to the server side. This is a way to have your Web Forms be efficient. No one (especially on dial-up) wants to fill in a form, click enter - wait for the data to be transferred to the server, server won't accept because of a small error, then wait for the data to be transferred back. Cleanup JavaScript on the client side insures your data is clean, and your forms are faster. I have several personal examples.
Chapter 9 expands the use of Forms to include Regular Expressions. In order to verify you have entered a valid e-mail address you use a Regular Expression to describe your criteria. Validating an e-mail address does not the e-mail address exists, it simply but powerfully screens e-mail addresses for a "@" and "." and a certain amount of characters. There is a nice example on Page 195.
Read chapters 3 & 4 of JavaScript - The Definitive Guide. O'Reilly books are very comprehensive, remember these heavy duty reference books are not pleasure reading. They are COMPLETE. I use them as I would a dictionary - don't be afraid of them (that's why this was a required reference book). We will be learning to use them, just like you learned to use a dictionary and thesaurus - it was painful to learn, but hard to live without, and nice to work with on line in Word!!!
The pages I have ear-marked is Chapter 3, page 35 JavaScript Escape Sequences. There are references to using these in our text, but this gives you the complete list. It's sometimes nice to see what else you can use them for.
Part 2:
Incorporate two JavaScripts from Chapter 8 and two JavaScripts from Chapter 9 into your web site.
1.) Make them your own, make some changes so the script is interesting to you
2.) Put comments in the code <!-- of what you changed and why
3.) E-mail me that you have put the code in your subdirectory on the server
4.) Give me a little paragraph of
* Did it work the way you expected?
* Did you like the results?
* Would you use this on a future page?
Remember to use the link to the web companion of the text: http:\\oreilly.com/catalog/jscript4/ you will see listed a link to the examples. Our Text is the FIFTH EDITION.
===========================================================================
Assignment 6:
Part 1:
Read chapter 10 & 11 of JavaScript for the World Wide Web [4th edition read chapters 8 & 9].
Chapter 10 explains what it means to have "DYNAMIC WEB PAGES" and that is all the buzz. So this is interesting to see these examples, and easy to make your pages more dynamic. We all can use some dynamic things in our lives!!! So let's put them on our web pages!
Chapter 11 goes into what are EVENTS and how does Java Script Handle Window EVENTs. How and where does a window open, what size will the window be, etc. This expands on Chapter 7 - Browser Windows. It also uses ALERTS, and gives us some good examples for alerts.
Read chapters 5 & 6 of JavaScript - The Definitive Guide. O'Reilly read this comprehensive manual, not to memorize, but to familiarize yourself with what it contains.
The pages I have ear-marked is Chapter 5:
page 57 - JavaScript Operators
page 73 - Assignment Operators
The pages I have ear-marked is Chapter 6:
page 100 - JavaScript Statements ex. break, case, continue, for if/else ....
Again, these are referenced in our text, but this gives you the complete list. It's sometimes nice to see what else you can use them for.
Part 2:
Incorporate two JavaScripts from Chapter 10 and two JavaScripts from Chapter 11 into your web site.
1.) Make them your own, make some changes so the script is interesting to you
2.) Put comments in the code <!-- of what you changed and why
3.) E-mail me that you have put the code in your subdirectory on the server
4.) Give me a little paragraph of
* Did it work the way you expected?
* Did you like the results?
* Would you use this on a future page?
Remember to use the link to the web companion of the text: http:\\oreilly.com/catalog/jscript4/ you will see listed a link to the examples. Our Text is the FIFTH EDITION.
===========================================================================
Assignment 7:
Part 1:
Read chapter 12 & 13 of JavaScript for the World Wide Web [4th edition read chapters 10 & 11].
Chapter 12 - Cookies are something that users used to turn off. However it's hard to use a web site without them. They are a way of identifying you -or- more correctly your computer to the web site you are visiting. They make the site more usable to you, so people have learned to live with and even love cookies.
Start to look at Appendix B JavaScript reserved words. Start to feel familiar with what words are reserved, so you are not naming variables with a reserved word. It's good to feel comfortable looking in the Appendix and familiarizing yourself with these words. Also look over the ECMAscript 3 words. ECMA will be the next generation of JavaScript - although I'm not sure if it will be called ECMA instead of JavaScript(Netscape) or J-script(MicroSoft), however you should get used to hearing/seeing the term it is what JavaScript is growing into.
Chapter 13 - CCS - Cascading Style Sheets are becoming the standard for developing web pages. With each release of DreamWeaver [MX and MX 2004], more support is built in. CCS brings standards, and the ability to change the look and feel of a web site. But cleaning up websites to take advantage of CCS will be a focus for Web Designers in the next few years.
Read chapters 6, 7 & 8 of JavaScript - The Definitive Guide. O'Reilly read this comprehensive manual, not to memorize, but to familiarize yourself with what it contains.
The pages I have ear-marked is Chapter 6:
page 100 - JavaScript Statements ex. break, case, continue, for if/else ....
Again, these are referenced in our text, but this gives you the complete list. Its sometimes nice to see what else you can use them for.
Part 2:
Incorporate two JavaScripts from Chapter 12 and two JavaScripts from Chapter 13 into your web site.
1.) Make them your own, make some changes so the script is interesting to you
2.) Put comments in the code <!-- of what you changed and why
3.) E-mail me that you have put the code in your subdirectory on the server
4.) Give me a little paragraph of
* Did it work the way you expected?
* Did you like the results?
* Would you use this on a future page?
Remember to use the link to the web companion of the text: http:\\oreilly.com/catalog/jscript4/ you will see listed a link to the examples. Our Text is the FIFTH EDITION.
===========================================================================
Assignment 8:
Part 1:
Read chapter 14 & 15 of JavaScript for the World Wide Web [4th edition read chapters 12 & 13].
Chapter 14 - DHTML = Dynamic HTML expands on chapter 10. DHTML is a combination of HTML, CCS and JavaScript. We will also start reading about DOMs - the Document Object Model which is the name for the describing objects with the dot syntax. We have been using it, and I have explained how the Objects Table works, and now that we're comfortable with the concepts we can start referring to its name DOM and getting a bit more involved.
Chapter 15 - Interface Design describes how pull down menu's work, sliding menus, and form fields. We are starting to get into the heart of making things work.
Read chapters 9 & 10 of JavaScript - The Definitive Guide. O'Reilly read this comprehensive manual, not to memorize, but to familiarize yourself with what it contains.
The pages I have ear-marked is Chapter 10:
page 148 - Literal Characters ex. Form feed, Tab, Carriage return, ...
page 150 - Regular expression Character classes - ASCII characters, ASCII digits, ...
Again, these are referenced in our text, but this gives you the complete list. Its sometimes nice to see what else you can use them for.
Part 2:
Incorporate two JavaScripts from Chapter 14 and two JavaScripts from Chapter 15 into your web site.
1.) Make them your own, make some changes so the script is interesting to you
2.) Put comments in the code <!-- of what you changed and why
3.) E-mail me that you have put the code in your subdirectory on the server
4.) Give me a little paragraph of
* Did it work the way you expected?
* Did you like the results?
* Would you use this on a future page?
Remember to use the link to the web companion of the text: http:\\oreilly.com/catalog/jscript4/ you will see listed a link to the examples. Our Text is the FIFTH EDITION.
===========================================================================
Assignment 9:
Part 1:
Read chapter 16 & 17 of JavaScript for the World Wide Web [4th edition read chapter 14]. Minimizing the amount of code you need to do a specific task may seam silly when your just learning a scripting language, but its important for maintance and to eliminate multipal duplicate lines of code throughout your web pages. Chapter 16 - Applied JavaScript begins to address that. As a developer - I have spent a significant amount of time trying to "Keep the Code Clean". Its a maintance thing - its like housework/yardwork the cleaner it is from the start, the easier it is to keep it clean. This all translates into making it easier to make changes. And change is good. That's where using external .js files comes in. We have talked about them in Assignment 4, we'll be using them from now on.
Style Sheets and the ability to switch them is also covered. One of the coolest sights is Zen Garden http://www.csszengarden.com/ This is a site dedicated to showing how an entire site can be controled by Cascading Style Sheets, and by clicking on different design buttons, the entire site changes just by applying another CSS. Cool.
The DOM - Document Object Model, always seams like a big looming overhead cloud, but its actually just a set of rules on how java script (in our case) should work. http://www.w3.org/TR/DOM-Level-2-Core/ecma-script-binding.html. I selected ECMAscript because that is what JavaScript is supposed to grow up to become.
Read chapters 11 & 12 of JavaScript - The Definitive Guide. O'Reilly read this comprehensive manual, not to memorize, but to familiarize yourself with what it contains. Chapter 12 has tags on the right-hand pages that read "Client-Side JavaScript". We normally refer to JavaScript as just JavaScript. We don't mention if it is Client-Side or Server-Side. It is all assumed to be Client-Side unless otherwise stated. What this means is that the program is run on your individual machine (client) and not on the Web Host (server).
Part 2:
Incorporate two JavaScripts from Chapter 16 and two JavaScripts from Chapter 17 into your web site.
1.) Make them your own, make some changes so the script is interesting to you
2.) Put comments in the code <!-- of what you changed and why
3.) E-mail me that you have put the code in your subdirectory on the server
4.) Give me a little paragraph of
* Did it work the way you expected?
* Did you like the results?
* Would you use this on a future page?
Remember to use the link to the web companion of the text: http:\\oreilly.com/catalog/jscript4/ you will see listed a link to the examples. Our Text is the FIFTH EDITION.
===========================================================================
Assignment 10:
Part 1:
Read chapter 18 & 19 of JavaScript for the World Wide Web [4th edition read chapters 15 & 16].
Although the concept of "Web Safe Colors" is fading as we upgrade our computer systems, it is a good topic to discuss - just like when you purchase TV's each TV displays the colors slightly differently, so do computer monitors. It depends on many factors, but selecting colors that are more reliable than others is usually a good thing to do. Color Schemer is an on-line web page that helps you find the color you want to use. http://www.colorschemer.com/online.html
DreamWeaver is a very good visual tool for creating web sites. Unlike other products/editors which added Web development into their mix. MacroMedia was a product of web development. There are many user groups that you can join to get overviews of their products. GoLive is another Web Professional Tool for web development. Fron Page by Microsoft was used to create web pages, however it adds a lot of overhead and adds to load time.
Read chapters 13 & 14 of JavaScript - The Definitive Guide. O'Reilly read this comprehensive manual, not to memorize, but to familiarize yourself with what it contains.
The pages I have ear-marked is Chapter 13:
page 199 Window Overview - a list of terms used
page 208 Has a great example of internal documentation - you can never get enough examples!!!
page 211 How to close a window example
Again, these are referenced in our text, but this gives you the complete list. Its sometimes nice to see what else you can use them for.
Part 2:
Incorporate two JavaScripts from Chapter 18 and two JavaScripts from Chapter 19 into your web site.
1.) Make them your own, make some changes so the script is interesting to you
2.) Put comments in the code <!-- of what you changed and why
3.) E-mail me that you have put the code in your subdirectory on the server
4.) Give me a little paragraph of
* Did it work the way you expected?
* Did you like the results?
* Would you use this on a future page?
Remember to use the link to the web companion of the text: http:\\oreilly.com/catalog/jscript4/ you will see listed a link to the examples. Our Text is the FIFTH EDITION.
===========================================================================
Assignment 11:
Part 1:
Read chapter 20 of JavaScript for the World Wide Web [4th edition read chapter 17]. Make sure you feel comfortable with the Appendix sections, especially the Big Object Table, JavaScript Reserved Words, CCS, and understand where to go to learn more. MacroMedia has built in debuggers or as they refer to them as "Validation" for JavaScript, and XHML, XML and CSS as well.
Read chapters 15 & 16 of JavaScript - The Definitive Guide. O'Reilly read this comprehensive manual, not to memorize, but to familiarize yourself with what it contains.
The pages I have ear-marked is Chapter 15:
page 252 HTML Form Elements
Again, these are referenced in our text, but this gives you the complete list. Its sometimes nice to see what else you can use them for.
Part 2:
Incorporate two JavaScripts from Chapter 20 into your web site or use them to help you solve a problem you had somewhere in your code in the past assignments.
1.) Make them your own, make some changes so the script is interesting to you
2.) Put comments in the code <!-- of what you changed and why
3.) E-mail me that you have put the code where you used them
4.) Give me a little paragraph of
* Did it work the way you expected?
* Did you like the results?
* Would you use this on a future page?
Remember to use the link to the web companion of the text: http:\\oreilly.com/catalog/jscript4/ you will see listed a link to the examples. Our Text is the FIFTH EDITION.
===========================================================================
Assignment 12:
Part 1:
Now that you have read JavaScript for the World Wide Web completely and done examples from each of the chapters, and you have built great reference "Ear Tags" in your reference book JavaScript - The Definitive Guide. O'Reilly incorporates your knowledge into a web page of your choosing. If you don't have a personal page, then embellish your Default-yourName.htm that lists all your assignments. Have fun and be creative. You've finished the class - and started seeing Web Pages in a new light!!!
Read chapters 17, 18 & 19 of JavaScript - The Definitive Guide. O'Reilly read this comprehensive manual, not to memorize, but to familiarize yourself with what it contains.
The pages I have ear-marked is Chapter 17, 18, 19:
page 281 DOM - Document Object Model
page 315 CSS style attributes and their values
page 322 CSS Element Positioning
page 353-354 Event Handlers
page 367-368 Event Types
page 425 - Core JavaScript Reference
Again, these are referenced in our text, but this gives you the complete list. Its sometimes nice to see what else you can use them for.
Part 2:
Incorporate your changes into your web site.
1.) Make them your own, make some changes so the script is interesting to you
2.) Put comments in the code <!-- of what you changed and why
3.) E-mail me that you have put the code in your subdirectory on the server
4.) Give me a little paragraph of
* Did it work the way you expected?
* Did you like the results?
* Would you use this on a future page?
===================== You Have Completed CCV's Programming for the Internet =========================