BTC640/ProcessingPrereq
Lecture
Before we dive into processing we have to make sure you remember some of the stuff you learned in the following courses:
Course | BSD | CPA |
---|---|---|
XHTML and JavaScript | BTI220 | INT222 |
Server-side web programming | BTI320 | INT322 |
Java | BTP400 | JAC444 |
This week we're going to make sure you remember what you need from those courses and learn some new things too.
HTML
This is a pretty basic topic, and every developer no matter in what field should know it - both because it's so simple, and because you'll certainly use it in your career.
We'll look at the most common HTML tags, inluding a, b, body, div, form, hX, img, input, li, noscript, p, table, and ul.
What makes HTML XHTML is more strict rules about how tags are used, and stricter (but not enforced) rules about formatting.
In XHTML formatting is preferably done using CSS. We'll look at some CSS examples.
JavaScript, DOM
This trivial programming language has become quite important, and can be quite complex. We will not need to learn the most complicated things about JS such as closures, but we'll need a good working knowledge of the language.
Basics: <script> tags, .js files, alerts, variables, conditions, for and for..in loops, data types, pass by value and pass by reference.
Tools: the Firefox error console, firebug.
More serious work can be done with JS when using DOM methods. We can manipulate, create, show, hide, move almost anything on a webpage using JS and the DOM.
Browser compatibility: used to be a very serious issue, with IE not supporting any standards. These days all the recent versions of desktop web browsers support pretty much the same technologies. We have a new problem though, and that's mobile devices. Often mobile browsers, even if capable of interpreting JS, have it turned off to save bandwidth.
Java
The Processing language is actually a wrapper around Java, so most things that work in Java will work in Processing. If you're working on porting an existing Processing project over to Processing.js you have to understand enough Java to know what the original author was trying to do.
Processing.js itself is a kind of translator - it reads Processing (Java) code and coverts it to JavaScript code. This is possible to do to an extent and many Processing apps will run just fine in Processing.js but there are differences that can require porting work. For example there are no data types in JS, so if your Java logic depends on data types (e.g. integer rounding) you will need to modify that code to work in JS.
PHP
Much more can be done in a webpage if content is generated dynamically on the server. We'll review some PHP programming basics.
PHP doesn't have to generate only HTML. It is quite reasonable to generate JavaScript in PHP as well.
JSON
You can think of JSON is a data structure. It can be modified using native JavaScript methods, and many languages have libraries that allow you to create a JSON string from an object, or even create a native object from a JSON string.
The JSON website has a description/illustration of how you can store strings, numbers, arrays, and associative arrays in JSON.
JSON is a great way to transfer data structures from the server to the client and back. I will show you a real word example of how it is used.