Technical requirements

See the Installfest project for more instructions.

Software:

Accounts:

If you do not have these, RAISE YOUR HAND!


What will we learn?

In this class, you will learn about:

Follow along online! Put a browser pointed at this site on one side of your screen, and Terminal on the other.


What if I know some of this already?

The best way to learn is to teach. Latin proverb


What is code?

Generally, code is something that stands for something else.

Specifically, source code is a series of instructions that tell a computer what to do.

With computers, "code" is not about secrets -- it's about symbols.


What is coding?


What is coding NOT?

"The only perfect program is an empty file." - Alex


A Program Is Like A Recipe

Grandma's Cookie Recipe

When you are coding, you are not baking cookies; you are writing a recipe for how to make cookies.

Writing a recipe involves trying out the recipe (baking a test batch), then tweaking the recipe and trying again and again until you get it right.

(recipe from popcornpottery.com)


Languages


Errors Are Awesome

If your code is a two-year-old child, then an error is a temper tantrum.

(It can take effort to figure out the underlying reason why they're upset and fix it.)

See also: What went wrong? from MDN


Lab: Opening the Terminal


Optimal Layout - MacOS

Arrange your application windows like so

terminal next to browser


Optimal Layout - Windows

Arrange your application windows like so

terminal next to browser


Lab: Interactive Calculator

  1. open a terminal
  2. look at the prompt -- it should end with a $ or > symbol
  3. type node -- that's you commanding the computer to launch node
  4. press the Return key (also called Enter)
  5. see the > prompt
  6. type 1 + 1
  7. press the Return key again
  8. see the 2

Node is a JavaScript Engine

Diagram: Node Train: Command Line

An "engine" is a type of program that either executes or empowers other programs.

NodeJS (aka node) is an engine that runs JavaScript programs -- either from files, or interactively from the command line.


A Tale of Two Prompts

WARNING: Before you start typing, look at the prompt!

While running node, if you want to return to the shell


When in doubt, try it out!

From now on, whenever you see text in the code font, try typing it into the terminal and see what happens! For example:

'pod' + 'cast'

If that doesn't print 'podcast', look at the prompt; you may be inside your shell instead of inside node.


Directories

Show hidden in Finder

Show hidden in Windows


Where am I?


Home Directory

WARNING: On some windows systems, Command Prompt will open to C:\Windows\System32. You can get back to your home directory by typing cd %HOME%


Listing Directory Contents


Making a directory

mkdir code

Changing directories


Basic Command Review (Unix)

These apply to Mac / Unix / Linux / bash / cmder


Basic Command Review (DOS)

These apply to Windows / DOS / PowerShell


LAB: make a subdirectory and then enter it

  1. Open Terminal or Command Prompt
  2. Confirm that you are in your home directory
  3. Make a new subdirectory using mkdir code
  4. Change into that directory using cd code
  5. Make sure you're really there using pwd
    • On Windows use cd
  6. List its contents using ls (and note that it's empty)
    • On Windows use dir

Files


Text Editor


Source File

$ node hello.js
Hello, World!

LAB: Hello, World

  1. Make sure you are in your code subdirectory using pwd or cd
  2. Open this directory in your text editor
    • for VSCode, use code . ("code dot")
  3. Create a file named hello.js using the File > New menu
  4. Inside this file, put the following source code:

    console.log("Hello, World!");
    
  5. Save the file

  6. Switch back to the terminal (using Alt-Tab or Cmd-Tab or clicking)
    (If you are using VS Code, you can click Terminal → New Terminal for the built-in terminal panel)

  7. Run this file using node hello.js

What happens? Is this what you expected?


Command-Line Shortcuts

These work in bash:

bash shortcuts

Also:

(image source: Clément Chastagnol)

Bash Shortcuts Cheatsheet


Next 

Outline

[menu]

/