Introduction to ProgrammingWell, Kind Of.

THATCamp New England 2010Julie Meloni // @jcmeloni // jcmeloni@gmail.com

What’s missing in the slides...

•A lot of extemporaneous talking about how everyone is already a programmer.

•In fact, you all probably know a lot of this, but just didn’t know the terms.

•What’s more, the applications of the future come from the needs of the present: your needs.

▫When you can articulate them to someone who can do the codework, we all win.

Why Program?•Express complex logic and perform

computations.

▫We make the computer do what we want it to do.

▫These behaviors come from our imaginations.

▫The processes come from our needs and desires.

•Do things that take a long time or are difficult for humans to do (counting, comparing, repeating)

What is a “Programming Language”?

•An artificial language with a limited purpose

•A means of expressing computations (math) and algorithms (logic)

Thanks, @wayne_graham. I “repurposed” some of your content on this slide and the next.

What Does a Programming Language Look Like?•...a lot like human language. They have:

▫Syntax (form)▫Semantics (meaning)

signs/words (variables, symbols, numbers, strings)

expressions flow control (decisions, conditions, loops,

narrative) complex entities (methods, structures, &

objects)

A Few Types of Programming Uses

•Job control or shell scripting; text processing

•Graphical User Interface (GUI) programming

•Application-specific programming

•Web applications▫Front-end▫Back-end

Some Programming Languages You May Have Heard About•C++

•Java

•JavaScript (completely unrelated to the former)

•Perl

•Python

•Ruby

•PHP

A Few Basic Programming Components (pretty much regardless of language)

• Variables & Arrays

• Operators

• Flow Control

• Functions

Putting together these pieces adds up to programming (or scripting, or in general “writing some stuff to tell the computer

what to do”)

Variables & Arrays

• A variable is a bucket that holds one piece of information.

• Examples (language doesn’t matter here; the concept does):

▫ $string_variable = “THATCamp”;

▫ $numeric_variable= 4;

▫ $myname = “Julie”;

Variables & Arrays

• An array is a type of variable (or bucket) that holds many pieces of information.

• Example (language doesn’t matter here; the concept does):

▫ $THATCamps = array(“Prime”, “New England”, “Pacific Northwest”)

$THATCamps[0] holds “Prime”

$THATCamps[1] holds “New England”

▫ $THATCamps = array(“1” => “Prime”; “NE”=> “New England”, “PNW” => “Pacific Northwest”)

$THATCamps[“NE”] holds “New England”

Operators

• Arithmetic ▫ +, -, *, / (add, subtract, multiply, divide)

• Assignment▫ = (“Assign the value of 4 to the variable called a”)

$a = 4;▫ += (“Add the value of 5 to the variable that already

holds 4”) $a += 5; // $a now holds 9

▫ .= (“Attach the value ‘World’ to the end of ‘Hello’ to make a new value for the string variable”)

$string = “Hello”; $string .= “World”; // would print “HelloWorld” (no

space because we didn’t add that!)

Operators

• Comparison▫ == (“when I compare the value in variable a to the value in

variable be, that comparison is true”) $a == $b

▫ != (“when I compare the value in variable a to the value in variable be, that comparison is not true”)

$a != $b▫ === (“when I compare the type of and value in variable a to the

type of and value in variable be, that comparison is true”) $a === $b

▫ >, >= (“the value of variable a is greater than (or greater than or equal to) the value of variable b”)

$a > $b▫ <, <= (“the value of variable a is less than (or less than or equal

to) the value of variable b”) $a < b

Operators

• Logical▫ && (and)

▫ || (or)

▫ ! (not)

Flow Control (conceptual structures virtually independent of language, although might look a little different)

• ifif (something is true) {

do something here}

• if ... else ... else ifif (something is true) {

do something here} else if (something is true) {

do something here} else {

do something here}

Flow Control (conceptual structures virtually independent of language, although might look a little different)

• whilewhile (something is true) {

do something here}

• forfor (something is true) {

do something here}

Flow Control (conceptual structures virtually independent of language, although might look a little different)

• switchswitch (some_variable) {

case “some_value”:do something herebreak;

case “some_other_value”:do something herebreak;

default:do something here

}

Procedures and Functions

• Scripts can contain linear, procedural code.

• Scripts can also contain references to reusable bits of code, called functions.

▫ Built-in language functions

▫ Functions you write yourself.

• [Note at this point in the presentation I talked a bit about how every element you see in an application can be boiled down to its logical structures and the code you want to execute within those structures.]

Some Application Examples• Static web site with some snippets of interactivity

▫ The example I used was a simple form on a web site.

• A library catalog with a content discovery mechanism

▫ I showed VIRGO (http://search.lib.virginia.edu).

• Custom Web-based application like NINES

▫ That would be http://nines.org

• WordPress/dynamic platform such as Omeka

▫ I showed two Omeka sites: Lincoln at 200 (http://lincolnat200.org) and MITH’s Vintage Computers (http://mith.umd.edu/vintage-computers/)

▫ Clicked through to show exhibit & item conceptually same in both sites (because of framework).

▫ Data goes in, data is pulled out; it exists in one place but accessed many ways

Let’s Design an Application• What do you want it to do?

• What type of programming is required?

• Does language matter?

• What elements of programming are required (GUI? Actions? Frameworks? etc)

• What can you leverage?

• What comes next?

▫Being logical, being incremental, being procedural, being functional, being a programmer...and then talking to specialists.

And then...• Asked the group for examples of

ideas/tools/things they wanted to do. Some examples:▫Discover similarities between two data sets▫Social annotation of images/primary sources▫Visualizing relationships between data

• Turns out you need three things for all of the projects/ideas people had:▫Primary material▫Metadata▫ Interface/use thoughts

And THEN...• We walked through several examples and kept coming

back to:▫ Logical construction of actions; explain it to someone in

“pseudocode” “If I click on this link, I want X to happen, and if I select this

form element and that form element together, I want Y to happen”, etc.

▫ Most processes can be broken into smaller processes, all loopy or controlled structures in some way.

▫ If you can think of what you want to see or do, you can tell the computer how to do it so you can see it.

▫ You don’t need to be a Comp. Sci. person to do any of the above – just an imaginative and relatively logical person.