Difference between revisions of "Beginning Programming"

From eLinux.org
Jump to: navigation, search
(Programming toolkits)
(add link to snap)
(6 intermediate revisions by the same user not shown)
Line 7: Line 7:
 
* scratch - This is a beginning programming toolkit produced by MIT.  This has numerous examples and tutorials, and is highly recommended as an excellent starting place for beginning programmers.
 
* scratch - This is a beginning programming toolkit produced by MIT.  This has numerous examples and tutorials, and is highly recommended as an excellent starting place for beginning programmers.
 
** Free download available from: http://scratch.mit.edu/
 
** Free download available from: http://scratch.mit.edu/
 +
** http://www.youtube.com/watch?v=pkhjX792yVI - a good starter tutorial on scratch
 +
** [http://info.scratch.mit.edu/sites/infoscratch.media.mit.edu/files/file/ScratchGettingStartedv14.pdf Scratch Getting Started Guide]
 +
** SNAP is scratch implemented in javascript - http://snap.berkeley.edu/
 +
 
* Kahn Academy - Excellent online introductory course for computer science and programming, using interactive javascript
 
* Kahn Academy - Excellent online introductory course for computer science and programming, using interactive javascript
 
** [https://www.khanacademy.org/cs Computer Science tutorials and videos] - Start by clicking on the Introductory Video.
 
** [https://www.khanacademy.org/cs Computer Science tutorials and videos] - Start by clicking on the Introductory Video.
 
** Note that the bottom area of the screen is a tabbed dialog with different areas:
 
** Note that the bottom area of the screen is a tabbed dialog with different areas:
 
"Questions  Tips & Feedback  Spin-Offs  Documentation".  "Spin-Offs" has sample programs related to the tutorial, video or program you're looking at, and "Documentation" has description of different functions or statements you can use in your programs.
 
"Questions  Tips & Feedback  Spin-Offs  Documentation".  "Spin-Offs" has sample programs related to the tutorial, video or program you're looking at, and "Documentation" has description of different functions or statements you can use in your programs.
 +
 +
== Online resources ==
 +
* http://www.codeacademy.com/ - this site has good starting tutorials for javascript, html, php, python and ruby.
 +
 +
* http://www.w3schools.com/
  
 
== Programming checklist ==
 
== Programming checklist ==
Line 59: Line 68:
 
based on the key pressed.  The ball should keep moving after the key is released.
 
based on the key pressed.  The ball should keep moving after the key is released.
 
It should bounce off the wall and go the other direction when it hits a wall.
 
It should bounce off the wall and go the other direction when it hits a wall.
 +
 +
== Languages ==
 +
Programming can be done in many different computer languages.
 +
 +
=== Web Programming ===
 +
Programming can be done in a web browser.  This is a computer
 +
program, like Internet Explorer, Firefox or Chrome, that reads web pages
 +
from the Internet and shows them on your screen.  Embedded devices, like
 +
phones, tablets and TVs also have web browsers.
 +
 +
In order to do web programming, you
 +
first need to learn how the browser presents information from a web page
 +
on your computer screen.  It does this by processing the words on the
 +
web page (called "parsing" the page), and then drawing things like text, lines
 +
and images on your computer screen (usually, inside the browser window).
 +
 +
==== HTML ====
 +
The words on a web page are part of a language called HTML (HyperText Markup Language).  You can learn about this language here:
 +
http://www.w3schools.com/html/default.asp
 +
 +
Basically, the words and symbols are put into a file (or returned from a program
 +
running on the web server), and these words tell the web browser what to draw
 +
on the screen.  The process of drawing things on the screen is called "rendering" the page.
 +
 +
=== Scratch ===
 +
Here is a tutorial for a bouncing ball demo in scratch:
 +
http://scratch-time.blogspot.com/2008/12/how-to-make-bouncing-ball.html
 +
 +
=== Javascript ===
 +
Here is a tutorial for a bouncing ball demo in Javascript:
 +
http://sixrevisions.com/html/bouncing-a-ball-around-with-html5-and-javascript/
 +
 +
Before you understand this language, and how it works, you first have
 +
to understand HTML.
 +
 +
==== Javascript resources ====
 +
* http://www.webmonkey.com/2010/02/javascript_tutorial/ - 5-part introductory tutorial
 +
* http://www.w3schools.com/js/ - nice series of exercises on javascript
 +
 +
=== Python (with PyGame) ===
 +
Here is an introduction to pygame, which has an bouncing ball demo as
 +
part of the intro.
 +
 +
http://www.pygame.org/docs/tut/intro/intro.html

Revision as of 13:44, 16 September 2013

This page is intended to help beginners get started with learning programming. Eventually, I'd like to provide a whole series of steps, exercises and tutorials about programming, to help anyone who would like to get involved with software development or game development.

Programming toolkits

  • Kahn Academy - Excellent online introductory course for computer science and programming, using interactive javascript

"Questions Tips & Feedback Spin-Offs Documentation". "Spin-Offs" has sample programs related to the tutorial, video or program you're looking at, and "Documentation" has description of different functions or statements you can use in your programs.

Online resources

Programming checklist

Follow these steps to learn how to program:

The very basics

  • learn what a program statement is (and what a "computer language" is)
  • learn what a variable is
  • learn what a conditional (if statement) is
  • learn what a loop is
  • learn what input is
    • different kinds of input (key press, mouse move, mouse button)
  • learn what output is
    • different kinds of output (text, image, sound)

Simple program 1: Write a program that counts how many times someone presses the space bar.

Simple program 2: Write a program that counts how many times someone presses each arrow key.

program 3: Write a program that starts counting when someone presses the space bar, and stops counting when they hit it a second time (like a stop-watch).

Program 4: Write a program that moves a ball to the right on the screen, when the right arrow is pressed.

Program 5: Write a program that starts a ball moving when key is pressed. The ball should keep moving until it hits a wall.

Note: For any of these programs, you can start with the program you used previously, and expand or modify it to do the next task. You should save it under a new name.

Program 6: Write a program that starts a ball moving in a different direction, depending on which arrow key (up, down, left, right) is pressed.

Program 7: Write a program that starts with a moving ball. When the ball hits a wall, it moves in the opposite direction.

Program 8: Combine programs 6 and 7. Write a program that starts a ball in a direction based on the key pressed. The ball should keep moving after the key is released. It should bounce off the wall and go the other direction when it hits a wall.

Languages

Programming can be done in many different computer languages.

Web Programming

Programming can be done in a web browser. This is a computer program, like Internet Explorer, Firefox or Chrome, that reads web pages from the Internet and shows them on your screen. Embedded devices, like phones, tablets and TVs also have web browsers.

In order to do web programming, you first need to learn how the browser presents information from a web page on your computer screen. It does this by processing the words on the web page (called "parsing" the page), and then drawing things like text, lines and images on your computer screen (usually, inside the browser window).

HTML

The words on a web page are part of a language called HTML (HyperText Markup Language). You can learn about this language here: http://www.w3schools.com/html/default.asp

Basically, the words and symbols are put into a file (or returned from a program running on the web server), and these words tell the web browser what to draw on the screen. The process of drawing things on the screen is called "rendering" the page.

Scratch

Here is a tutorial for a bouncing ball demo in scratch: http://scratch-time.blogspot.com/2008/12/how-to-make-bouncing-ball.html

Javascript

Here is a tutorial for a bouncing ball demo in Javascript: http://sixrevisions.com/html/bouncing-a-ball-around-with-html5-and-javascript/

Before you understand this language, and how it works, you first have to understand HTML.

Javascript resources

Python (with PyGame)

Here is an introduction to pygame, which has an bouncing ball demo as part of the intro.

http://www.pygame.org/docs/tut/intro/intro.html