Programming with JavaScript

Codecademy

Tim Miller - tim.miller@humboldt.edu

Introductions

Tim miller

I use computer programming to solve problems:

• build websites to share information
• create presentations on the Web - easy to use & share
• understand how programs work and how I can use them best
• The skills I've learned translate to other areas of my life and career
  • bike mechanic, organization - trouble shooting

Introductions

Who are you?

What is your experience with:

• computer science?
• computer programming?
• using computers & technology?

What is your area of interest?

• how do you think computer programming can be applied?

Food & drinks

Please be careful

• keep away from the computers

• keep your hands clean

• Let us know about any spills/messes

What is JavaScript?

• Not Java - these are unrelated programming languages
• JavaScript (JS) is used frequently in web sites to create dynamic features
  • dynamic: allows the user to interact with the site
• JS uses intuitive syntax
• JS is easy to run on any computer
  • browser
  • notepad program

How do we use JavaScript?

• JavaScript can be run locally or within a website.
  • local: save a file on your computer and display in a browser without having to publish on the Web
• JS can be used to alter webpages
• JS can be used to process user input
  • forms
• JS can be used to create animations
• JS is often used to create slideshows 

Today

Codecademy tutorial

Collaboration

http://humboldt.edu

Let's begin!

How did it go?

What worked best?

What didn't work?

What did you learn?

What Do you still want to learn?

IDEAS

How can we use the things we learned today?

• Strings
• Variables
• Math
• Booleans
• Arrays
• If / Else logic statements
• Calling functions
  • with & without parameters

IDEAS

How can we use the things we learned today?

var name = "";
var nameLength = name.length;
if (nameLength > 9) {
  $('.name').css({'color':'blue'});
} else if (nameLength > 5) {
  $('.name').css({'color':'red'});
} else {
  $('.name').css({'color':'yellow'});
}

What if: 

var name = "Tim";
var name = "Alexander";
var name = "Evangelina";

IDEAS

How can we use the things we learned today?

http://www.w3schools.com/js/tryit.asp?filename=tryjs_switch

Another type of if/else: the Switch