STC 2016 Programming Language Storytime
-
Upload
sarah-kiniry -
Category
Documents
-
view
70 -
download
8
Transcript of STC 2016 Programming Language Storytime
![Page 1: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/1.jpg)
Sarah Kiniry cPanel, Inc.
StorytimeProgramming Language
![Page 2: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/2.jpg)
About Me
Jason (hubby!)Backend Perl developer,
extremely patient about being my in-home tutor, taught me a
whole lot of The Things.
Sarah Kiniry (me!)Technical Writer, former Stage Manager and Box Office Manager, needs-an-intervention level Trekkie.
technicolorwriter.com@SarahKiniry
@SarahKiniry #STC16
![Page 3: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/3.jpg)
If you can learn to read, you can learn to read code.
![Page 4: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/4.jpg)
Just read the story!
1
2
3
What does the application do?
What text will the user see?
Which files or settings?
@SarahKiniry #STC16
![Page 5: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/5.jpg)
How do I find the story?
![Page 6: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/6.jpg)
Code Clues
1
2
3
What does the application do?
What text will the user see?
Which files or settings?
Code CommentsFunction Names
Variable (Setting) Names
File LocationsPrint Functions
Files
Directories
Variables
Code comments, function names, setting names, and file locations.
Display methods, like print, and other output functions.
File names, file paths, and other variables.
@SarahKiniry #STC16
![Page 7: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/7.jpg)
CommentsText in code that the computer doesn’t try to run. Instead, it’s there for the developer’s reference.
Sometimes, it’s also used to temporarily “turn off” code without deleting it.
![Page 8: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/8.jpg)
Comments
// Single-line comments// require a comment// for each line.
do(thing); // comment
/* Multi-linecomments use beginning and end characters for multiple lines. */
Single-line comments…
• Can be used on the same line as code (a trailing comment).
• Comment character at the beginning of the comment only.
• A line break ends the comment.
Multi-line comments…• Comment character at the beginning and
end of the comment.
• Generally, these exist on separate lines from the code.
@SarahKiniry #STC16
![Page 9: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/9.jpg)
Single Line
// Java, JavaScript, C, C#, PHP
# PHP, Perl, Ruby, Python
@SarahKiniry #STC16
![Page 10: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/10.jpg)
Multi Line
/* Comment */ Java, JavaScript, C, C#, PHP
// Comment \ Comment
C
=pod =cut
Perl
=begin =end
Ruby
""" """ Python
@SarahKiniry #STC16
![Page 11: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/11.jpg)
FunctionsReusable code that performs one or more actions.
Sometimes, the code that you’re looking at is a function, while sometimes it uses existing functions.
* This is a lazy use of the term. These actions can be subroutines, methods, procedures, etc.
![Page 12: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/12.jpg)
Functions
sub do_something { my $value = @_; if $value { return "Yay!"; } …
do_something($value);
Function definition…
• Includes all of the code that will run anytime the function is used.
• Creating a function that’s used elsewhere.
• Sets the function name.
Function use…• Could be a custom-written function, or one
that’s built into the programming language.
• Often, custom functions are defined in other code, not in the same file.
@SarahKiniry #STC16
![Page 13: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/13.jpg)
Using Functions
function($value)
function "$value"
@SarahKiniry #STC16
![Page 14: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/14.jpg)
Creating Functions
// This is the format to define a function.class type functionname(parameters) { code }
*Java uses a “class” structure, so when you see this in code it’s going to be nested in a class.
Java*, C#
@SarahKiniry #STC16
![Page 15: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/15.jpg)
Creating Functions
// This is the format to define a function.class type functionname(parameters) { code }
// This example defines a function.public static void printyay() { System.out.println ("Yay!");}
*Java uses a “class” structure, so when you see this in code it’s going to be nested in a class.
Java*, C#
@SarahKiniry #STC16
![Page 16: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/16.jpg)
Creating Functions
// This is the format to define a function.class type functionname(parameters) { code }
// This example defines a function.public static void printyay() { System.out.println ("Yay!");}
*Java uses a “class” structure, so when you see this in code it’s going to be nested in a class.
Java*, C#
@SarahKiniry #STC16
// This uses the defined function.printyay();
![Page 17: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/17.jpg)
Creating Functions
// This is the format to define a function.class type functionname(parameters) { code }
// This example defines a function.public static void printyay() { System.out.println ("Yay!");}
*Java uses a “class” structure, so when you see this in code it’s going to be nested in a class.
Java*, C#
@SarahKiniry #STC16
// This uses the defined function.printyay();
Yay!
![Page 18: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/18.jpg)
Creating Functions
// This is the format to define a function.type functionname(parameters) { code }
C
@SarahKiniry #STC16
![Page 19: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/19.jpg)
Creating Functions
// This is the format to define a function.type functionname(parameters) { code }
// This example defines a function.int printyay() { printf("Yay!");}
C
@SarahKiniry #STC16
![Page 20: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/20.jpg)
Creating Functions
// This is the format to define a function.type functionname(parameters) { code }
// This example defines a function.int printyay() { printf("Yay!");}
C
@SarahKiniry #STC16
// This uses the defined function.printyay();
![Page 21: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/21.jpg)
Creating Functions
// This is the format to define a function.type functionname(parameters) { code }
// This example defines a function.int printyay() { printf("Yay!");}
C
@SarahKiniry #STC16
// This uses the defined function.printyay();
Yay!
![Page 22: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/22.jpg)
Creating Functions
// This is the format to define a function.function functionname(parameters) { code }
JavaScript, PHP
@SarahKiniry #STC16
![Page 23: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/23.jpg)
Creating Functions
// This is the format to define a function.function functionname(parameters) { code }
// This example defines a function.function multiply(a,b) { return a * b;}
JavaScript, PHP
@SarahKiniry #STC16
![Page 24: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/24.jpg)
Creating Functions
// This is the format to define a function.function functionname(parameters) { code }
// This example defines a function.function multiply(a,b) { return a * b;}
JavaScript, PHP
@SarahKiniry #STC16
// This uses the defined function.multiply(3,2);
![Page 25: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/25.jpg)
Creating Functions
// This is the format to define a function.function functionname(parameters) { code }
// This example defines a function.function multiply(a,b) { return a * b;}
JavaScript, PHP
@SarahKiniry #STC16
// This uses the defined function.multiply(3,2);
6
![Page 26: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/26.jpg)
Creating Functions
# This is the format to define a function.sub functionname { code }
Perl
@SarahKiniry #STC16
![Page 27: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/27.jpg)
Creating Functions
# This is the format to define a function.sub functionname { code }
# This example defines a function.sub dothingstovars { $variables = @_; do_something($variables); return $variables;}
Perl
@SarahKiniry #STC16
![Page 28: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/28.jpg)
Creating Functions
Perl
@SarahKiniry #STC16
# This uses the defined function.dothingstovars(“red”);
# This example defines a function.sub dothingstovars { $variables = @_; do_something($variables); return $variables;}
# This is the format to define a function.sub functionname { code }
![Page 29: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/29.jpg)
Creating Functions
Perl
@SarahKiniry #STC16
# This uses the defined function.dothingstovars(“red”);
# This example defines a function.sub dothingstovars { $variables = @_; do_something($variables); return $variables;}
# This is the format to define a function.sub functionname { code }
blue
![Page 30: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/30.jpg)
Creating Functions
# This is the format to define a function.def functionname(parameters) code end
Ruby
@SarahKiniry #STC16
![Page 31: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/31.jpg)
Creating Functions
# This is the format to define a function.def functionname(parameters) code end# This example defines a function.def Texas(name) var = "Howdy, " + name return var end
Ruby
@SarahKiniry #STC16
![Page 32: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/32.jpg)
Creating Functions
Ruby
@SarahKiniry #STC16
# This uses the defined function.Texas(Bob)
# This is the format to define a function.def functionname(parameters) code end# This example defines a function.def Texas(name) var = "Howdy, " + name return var end
![Page 33: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/33.jpg)
Creating Functions
Ruby
@SarahKiniry #STC16
# This uses the defined function.Texas(Bob)
# This is the format to define a function.def functionname(parameters) code end# This example defines a function.def Texas(name) var = "Howdy, " + name return var end
Howdy, Bob
![Page 34: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/34.jpg)
Creating Functions
# This is the format to define a function.def functionname(parameters): code return[value]
Python
@SarahKiniry #STC16
![Page 35: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/35.jpg)
Creating Functions
# This example defines a function.def print_return(my_words) print my_words return[]
Python
@SarahKiniry #STC16
# This is the format to define a function.def functionname(parameters): code return[value]
![Page 36: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/36.jpg)
Creating Functions
Python
@SarahKiniry #STC16
# This uses the defined function.print_return(“Hey everybody!")
# This example defines a function.def print_return(my_words) print my_words return[]
# This is the format to define a function.def functionname(parameters): code return[value]
![Page 37: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/37.jpg)
Creating Functions
Python
@SarahKiniry #STC16
# This uses the defined function.print_return(“Hey everybody!")
# This example defines a function.def print_return(my_words) print my_words return[]
# This is the format to define a function.def functionname(parameters): code return[value]
Hey everybody!
![Page 38: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/38.jpg)
VariablesThe names of stored values that code uses to perform actions. This can mean strings (text),
numbers, or boolean values (true/false).
There are also methods of storing groups of values, such as arrays or hashes.
![Page 39: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/39.jpg)
Variables
variable_name Java, JavaScript, C, C#, Python
$variable_name PHP, Perl, Ruby
@variable_name Perl, Ruby
%variable_name Perl
(and arrays and hashes)
@SarahKiniry #STC16
![Page 40: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/40.jpg)
Important Value Types
Files example.txt, example.jpg, example.php
DirectoriesLinux: /example/directory or example/directory/
Windows: C:\example\directory or ..\example\directory\
Settings managed, unmanaged; blue, green, red; 0, 1
@SarahKiniry #STC16
![Page 41: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/41.jpg)
Variables
my $file = example.txt;
$color = blue;
$do_something = 1;
@SarahKiniry #STC16
![Page 42: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/42.jpg)
Hello World!
![Page 43: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/43.jpg)
The Hello World Story
1
2
3
What does the application do?
What text will the user see?
Which files or settings?
@SarahKiniry #STC16
![Page 44: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/44.jpg)
The Hello World Story
1
2
3
What does the application do?This application displays a message to the user.
What text will the user see?
Which files or settings?
@SarahKiniry #STC16
![Page 45: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/45.jpg)
The Hello World Story
1
2
3
What does the application do?This application displays a message to the user.
What text will the user see?The user will see the text “Hello World.”
Which files or settings?
@SarahKiniry #STC16
![Page 46: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/46.jpg)
The Hello World Story
1
2
3
What does the application do?This application displays a message to the user.
What text will the user see?The user will see the text “Hello World.”
Which files or settings?No other files or settings are involved.
@SarahKiniry #STC16
![Page 47: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/47.jpg)
Hello, Java!
/* This is a Hello World script. */class HelloWorldApp { public static void main(String[] args) {// Display the string. System.out.println("Hello World!"); }}
@SarahKiniry #STC16
![Page 48: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/48.jpg)
Hello, Java!
/* This is a Hello World script. */class HelloWorldApp { public static void main(String[] args) {// Display the string. System.out.println("Hello World!"); }}
@SarahKiniry #STC16
![Page 49: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/49.jpg)
Hello, Java!
/* This is a Hello World script. */class HelloWorldApp { public static void main(String[] args) {// Display the string. System.out.println("Hello World!"); }}
@SarahKiniry #STC16
![Page 50: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/50.jpg)
Hello, JavaScript!
<script language=“Javascript">
// Write to browser window.document.write("Hello World!");
</script>
@SarahKiniry #STC16
![Page 51: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/51.jpg)
Hello, JavaScript!
<script language=“Javascript">
// Write to browser window.document.write("Hello World!");
</script>
@SarahKiniry #STC16
![Page 52: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/52.jpg)
Hello, JavaScript!
<script language=“Javascript">
// Write to browser window.document.write("Hello World!");
</script>
@SarahKiniry #STC16
![Page 53: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/53.jpg)
Hello, C!
/* Hello World */
void main(){ printf("Hello World!");
}
@SarahKiniry #STC16
![Page 54: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/54.jpg)
Hello, C!
/* Hello World */
void main(){ printf("Hello World!");
}
![Page 55: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/55.jpg)
Hello, C!
/* Hello World */
void main(){ printf("Hello World!");
}
![Page 56: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/56.jpg)
Hello, C#!
/// Let’s say Hello.using System;namespace HelloWorld{ class Hello { static void Main() { Console.WriteLine("Hello World!"); } }}
@SarahKiniry #STC16
![Page 57: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/57.jpg)
Hello, C#!
/// Let’s say Hello.using System;namespace HelloWorld{ class Hello { static void Main() { Console.WriteLine("Hello World!"); } }}
![Page 58: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/58.jpg)
Hello, C#!
/// Let’s say Hello.using System;namespace HelloWorld{ class Hello { static void Main() { Console.WriteLine("Hello World!"); } }}
![Page 59: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/59.jpg)
Hello, PHP!
// Tell them hello in PHP.<?phpecho "Hello World!";?>
@SarahKiniry #STC16
![Page 60: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/60.jpg)
Hello, PHP!
// Tell them hello in PHP.<?phpecho "Hello World!";?>
![Page 61: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/61.jpg)
Hello, PHP!
// Tell them hello in PHP.<?phpecho "Hello World!";?>
![Page 62: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/62.jpg)
Hello, Perl!
#!/usr/bin/perl
# We’ll call this a Perl of wisdom.
print "Hello World!";
@SarahKiniry #STC16
![Page 63: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/63.jpg)
Hello, Perl!
#!/usr/bin/perl
# We’ll call this a Perl of wisdom.
print "Hello World!";
![Page 64: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/64.jpg)
Hello, Perl!
#!/usr/bin/perl
# We’ll call this a Perl of wisdom.
print "Hello World!";
![Page 65: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/65.jpg)
Hello, Ruby!
#!/usr/bin/ruby -w
# First Perl, now Ruby? Shiny.
puts "Hello, world!"
=beginReally though, who knew there were two programming languages named after gemstones, even if one is kind of misspelled?=end
@SarahKiniry #STC16
![Page 66: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/66.jpg)
Hello, Ruby!
#!/usr/bin/ruby -w
# First Perl, now Ruby? Shiny.
puts "Hello, world!"
=beginReally though, who knew there were two programming languages named after gemstones, even if one is kind of misspelled?=end
![Page 67: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/67.jpg)
Hello, Ruby!
#!/usr/bin/ruby -w
# First Perl, now Ruby? Shiny.
puts "Hello, world!"
=beginReally though, who knew there were two programming languages named after gemstones, even if one is kind of misspelled?=end
![Page 68: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/68.jpg)
Hello, Python!
# A lot of programming languages use# hashes for their comment character.
print("Hello, World!")
""" But they tend to diverge when it comes to multiline comments. """
@SarahKiniry #STC16
![Page 69: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/69.jpg)
Hello, Python!
# A lot of programming languages use# hashes for their comment character.
print("Hello, World!")
""" But they tend to diverge when it comes to multiline comments. """
![Page 70: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/70.jpg)
Hello, Python!
# A lot of programming languages use# hashes for their comment character.
print("Hello, World!")
""" But they tend to diverge when it comes to multiline comments. """
![Page 71: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/71.jpg)
The Harder Stuff
![Page 72: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/72.jpg)
More JavaScript
<h1>JavaScript Can Change Images</h1>
<img id="myImage" onclick="changeImage()" src="pic_bulboff.gif" width="100" height="180">
<script>function changeImage() { var image = document.getElementById('myImage'); if (image.src.match("bulbon")) { image.src = "pic_bulboff.gif"; } else { image.src = "pic_bulbon.gif"; }}</script>
JavaScript code example from w3schools.com
@SarahKiniry #STC16
![Page 73: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/73.jpg)
More JavaScript
JavaScript code example from w3schools.com
<h1>JavaScript Can Change Images</h1>
<img id="myImage" onclick="changeImage()" src="pic_bulboff.gif" width="100" height="180">
<script>function changeImage() { var image = document.getElementById('myImage'); if (image.src.match("bulbon")) { image.src = "pic_bulboff.gif"; } else { image.src = "pic_bulbon.gif"; }}</script>
@SarahKiniry #STC16
![Page 74: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/74.jpg)
More JavaScript
JavaScript code example from w3schools.com
<h1>JavaScript Can Change Images</h1>
<img id="myImage" onclick="changeImage()" src="pic_bulboff.gif" width="100" height="180">
<script>function changeImage() { var image = document.getElementById('myImage'); if (image.src.match("bulbon")) { image.src = "pic_bulboff.gif"; } else { image.src = "pic_bulbon.gif"; }}</script>
@SarahKiniry #STC16
![Page 75: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/75.jpg)
More JavaScript
JavaScript code example from w3schools.com
<h1>JavaScript Can Change Images</h1>
<img id="myImage" onclick="changeImage()" src="pic_bulboff.gif" width="100" height="180">
<script>function changeImage() { var image = document.getElementById('myImage'); if (image.src.match("bulbon")) { image.src = "pic_bulboff.gif"; } else { image.src = "pic_bulbon.gif"; }}</script>
@SarahKiniry #STC16
![Page 76: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/76.jpg)
More JavaScript
JavaScript code example from w3schools.com
<h1>JavaScript Can Change Images</h1>
<img id="myImage" onclick="changeImage()" src="pic_bulboff.gif" width="100" height="180">
<script>function changeImage() { var image = document.getElementById('myImage'); if (image.src.match("bulbon")) { image.src = "pic_bulboff.gif"; } else { image.src = "pic_bulbon.gif"; }}</script>
@SarahKiniry #STC16
![Page 77: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/77.jpg)
More JavaScript
JavaScript code example from w3schools.com
<h1>JavaScript Can Change Images</h1>
<img id="myImage" onclick="changeImage()" src="pic_bulboff.gif" width="100" height="180">
<script>function changeImage() { var image = document.getElementById('myImage'); if (image.src.match("bulbon")) { image.src = "pic_bulboff.gif"; } else { image.src = "pic_bulbon.gif"; }}</script>
@SarahKiniry #STC16
![Page 78: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/78.jpg)
More JavaScript
JavaScript code example from w3schools.com
<h1>JavaScript Can Change Images</h1>
<img id="myImage" onclick="changeImage()" src="pic_bulboff.gif" width="100" height="180">
<script>function changeImage() { var image = document.getElementById('myImage'); if (image.src.match("bulbon")) { image.src = "pic_bulboff.gif"; } else { image.src = "pic_bulbon.gif"; }}</script>
@SarahKiniry #STC16
![Page 79: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/79.jpg)
What’s The Story?
1
2
3
What does the application do?
What text will the user see?
Which files or settings?
@SarahKiniry #STC16
![Page 80: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/80.jpg)
What’s The Story?
1
2
3
What does the application do?This application switches between two images.
What text will the user see?
Which files or settings?
@SarahKiniry #STC16
![Page 81: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/81.jpg)
What’s The Story?
1
2
3
What does the application do?This application switches between two images.
What text will the user see?“Javascript Can Change Images”
Which files or settings?
@SarahKiniry #STC16
![Page 82: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/82.jpg)
What’s The Story?
1
2
3
What does the application do?This application switches between two images.
What text will the user see?“Javascript Can Change Images”
Which files or settings?pic_bulbon.gif and pic_bulboff.gif, width=100, height=180
@SarahKiniry #STC16
![Page 85: STC 2016 Programming Language Storytime](https://reader031.fdocuments.us/reader031/viewer/2022021506/589b12351a28abc1148b4a63/html5/thumbnails/85.jpg)
Questions?
@SarahKiniry #STC16