CASES website development: lessons for budding programmers

John Miller

Two Objectives

• Show the CASES website– Describe its features and usage

• Describe developer issues– What issues would need to be

addressed by a teacher of computer literacy teaching programming, especially web programming?

– Issues raised through considering specific issues encountered while developing CASES website

Today’s presentation

• Describe previous programming projects

• Short discussion about the nature of computer programming

• Show the CASES website• Discuss programming issues raised by

this site’s development• Brief introduction to A New Kind of

Science

Previous projects

• WordLadders• Text graphs• Dictionary of Education• Queries ‘n Theories• Place out of Time

Programming can be characterized as a blend of

literacy and engineering

• Literacy, because one is using text to communicate with the computer

• Engineering, because programming syntax is much more constraining than human language syntax

Engineering is based on

Programming consists of ‘simple (cognitive)

machines’ expressed as text

• Lists• Variables• Tuples• Dictionaries• Data

structures

• Control constructs:– For– While– If– Else– Until

Literate Programming“Let us change our traditional attitude to the

construction of programs: Instead of imagining that our main task is to instruct a computer what to do, let us concentrate rather on explaining to human beings what we want a computer to do.

The practitioner of literate programming can be regarded as an essayist, whose main concern is with exposition and excellence of style. Such an author, with thesaurus in hand, chooses the names of variables carefully and explains what each variable means. He or she strives for a program that is comprehensible because its concepts have been introduced in an order that is best for human understanding, using a mixture of formal and informal methods that reinforce each other.” (Donald Knuth. "Literate Programming (1984)" in Literate Programming. CSLI, 1992, pg. 99.)

Sampling of programming and scripting languages

• C & C++• Pascal• Java*• Fortran• Lisp• Logo*• Basic*

• Python*• Perl*• Ruby• SQL• PHP• Lasso*• Rebol

• Prolog• Postscript• Tcl/Tk• TeX• Cocoa• C#• Objective

C*

Is HTML a programming language?

• No. It doesn’t have programming constructs such as:– Loops– Variables– Control

• It is a markup language designed to indicate textual structure

• Later came to blend structure with layout.

CASES overview

• Unit plans• Journal• Teacher community• Cases• FAQs• Science teaching resourcesCASES site

CASES overview

• A repository of elementary science units

• Each unit consists of:– A driving question & related sub-

questions– Associated standards and benchmarks– Relevant background material– Possible student alternative ideas– Lesson plans– Supplementary resources

Journal

• Two kinds of entries– Prompted– Unprompted

• Prompted entries can be concatenated before being submitted

• I used the journal to record thoughts about computer programming and web development

Issue: Tools

• OS: Mac OS X• Server: Apache• Database: Filemaker Pro• Middleware: Lasso• Editing: GoLive, BBEdit

Issue: prior experience• “I'm noticing that my experience is often reified

in prior code. That is, I remember THAT I did such and such, but not HOW it was done; so I go back to see how I did it so I can incorporate it in the present project. This refers to stuff like javascript code, or how textarea tags get encoded in Lasso, or layout strategies in GoLive.”

• Indicates the importance of imbuing students with ‘canonical’ ways of coding, at least to begin with; these experiences will likely be repeated in future code.

Issue: storing information• “I found that my design of the databases was cleaner

and easier this time than ever before. I think database-like, at least relational database-like. I wonder how that kind of thinking is different from object-oriented database thinking?”

• Where and how to store information is often crucial in programming. There are many options available, and the more you work with these options, the more able you become to choose the right option.

• Such options generally include text files, databases, hidden form fields, and cookies.

Issue: storing information• I was struck by how much I was considering the

question of WHERE to store information, rather than HOW to store it. Beginners are often bewildered by *how* to do something; once you have internalized that, and begin to see options and alternative ways of accomplishing the same task, the question becomes, *which* is the best, or optimal, way to do it. Larger considerations of user interface and flows of information become more salient, whereas earlier, it is a great achievement merely to have gotten the system to work at all!

• Indicates the importance of staying attentive to which issues are important for learners and how these change over time.

Issue: modularity• “I'm quite aware of the need to keep my code

flexible. That means, I can tell from the discussions with the rest of the CASES group that interface changes are likely to occur, so I have developed a strategy of modularization in GoLive which should accomodate most interface design changes without too much trauma.”

• Initial development efforts are often ‘brittle’; the slightest change is likely to break the program without lots of triage.

• Modularity introduces more robust code.

Issue: bugs!• “So many sources of error in web programming:

the database application: filemaker, the 'middleware' app: lasso, the web server: apache, the browsers: navigator & ie, the code writing applications: golive & bbedit; and the web pages themselves, not to mention the operating systems supporting all these other applications!”

• Many subsytems for developers to be aware of.

• Any of these subsytems are possible sources of error.

• Debugging is more sometimes more art than science.

Issue: bugs!• “Sometimes there really is a bug in the software you

use. I was finally vindicated when I submitted a Lasso peculiarity to a BlueWorld employee and he, after testing the code I sent him, verified that yes, indeed, the software did not perform as advertised. He submitted it as a bug report, AND offered a workaround that not only would I not have been able to come up with in any reasonable amount of time on my own, but also, the workaround he sent taught me something new about how Lasso works! This seems to be an example of 'legitimate peripheral participation'.”

• Tracking bugs can be great opportunities for learning.

• (Or they can be opportunities for discovering poor typing!)

Issue: bugs!• “I learned something new today. Lasso allows you to

designate fields you choose to be 'Required' so that the user cannot proceed unless a value is entered. I've always used this on text fields before today. However, today I needed to require a radio button field, but the normal way just didn't work. I looked on the blueworld lassotalk archives and found this: ‘Because web browsers do not send empty parameters when radio-buttons are used like it does for text-elements. Since the browser doesn't send an empty (or null) value there's no way for Lasso (being server-side) to know there was ever something there to require. What you have to do is fool the system by providing a default empty value for Lasso to work with. Do this by following the group of radio buttons with a hidden element of the same name.’ I tried it and it worked! Here I was starting to blame Lasso (again), but it was a lack of understanding on my part. However, I DO think that the lasso documentation could be better with respect to this sort of 'exception to the rule’”.

• Sometimes, bugs are not bugs. Sometimes they are erroneous assumptions.

Issue: HTML in forms• “There is a very real issue that concerns the difference

between word processing applications and web processing applications. In word processors, users are used to selecting text and clicking a button to achieve a certain text effect, like bolding or italicizing or font sizing. People are used to doing this and only seeing the effects. These same effects can also be achieved using a web editor, but such applications are much less ubiquitous (except for "Save for Web..." commands inside word processors.) The issue arises when users have word processor expectations mapped onto a web processor application. In other words, how do we allow bolding, indenting, intalicizing font sizing and coloring inside a <textarea> tag? The only formatting we can currently provide without any user intervention is linespacing. If we allow more formatting, we have to require that HTML tags be manually inserted to achieve *any* effects (including linespacing), and this is contrary to user expectations vis-a-vis traditional word processors. Basically, browsers do not have this functionality built-in.”

• Rich text formatting in web forms is problematic.

Issues: miscellaneous• Relationship between file path (hard drive)

and url (browser)• Relative v. absolute urls (and relative v.

absolute file paths)• Frames and targets• Hyperlinks• Interface widgets

– Knowing what they are– Knowing how to use them– Knowing when to use them– Knowing how they behave in systems

• Client/server architectures v. peer-to-peer architectures (and hybrids)

Issue: psychology• “Sometimes, just leaving a problem alone and coming

back to it later will result in a different approach that yields a workable solution. This just happened when I finally managed to save the journal prompts in the database. This was rendered problematic because the prompts had to be carried over from page to page before finally being submitted. I took advantage of the fact that all the prompts ended with question marks, and did a search and replace on those marks to add line breaks. That, in turn, allowed checkboxes in the database to automatically be checked, facilitating later research.”

• Often there is more than one way to solve a problem, but alternate ways may not be immediately obvious.

Issues: Summary• What issues might a teacher of

computer literacy teaching (web) programming encounter?– Choice of programming tools– Where and how to store information– Code modularity– Handling bugs– Graphical user interface widgets

• How to use them• When to use them

Issues: Summary– Relationship between file paths and URLs– Frames and targets– Hyperlinking– Client/server architecture– Rich text formatting– Psychology

• These are just the ones that I encountered developing the CASES site

• Many other issues and concepts need to be incorporated into a whole curriculum, e.g.:– Recursion– Object-oriented programming

Why learn to

program?• May be an

essential skill, akin to literacy, for future scientists

Educational Issues“The new kind of science in this book represents a unique educational opportunity. For it touches an immense range of important and compelling everyday phenomena and issues in science, yet to understand its key ideas requires no prior scientific or technical education. So this means that it is potentially realistic to use as the basis for an overall introduction to the ideas of science. And indeed having understood its basic elements, it becomes vastly easier to understand many aspects of traditional science, and to see how they fit into the whole framework of knowledge.” p. 855

Educational Issues“I believe that the basic aspects of the new kind of science in this book in many ways provide more suitable material for general education than traditional mathematics. They involve some of the same kinds of precise thinking, but do not rely on abstract concepts that are potentially very difficult to communicate. And insofar as they involve the development of technical expertise, it is in the direction of computing--which is vastly more relevant to modern life than advanced mathematics.” (p. 855)

The End