Skip to content


Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?

Latest commit


Git stats


Failed to load latest commit information.
Latest commit message
Commit time

Code-newbies Intro to Javascript

This is a fast introduction to javascript.

Javascript Crash Course

Let's run over a bunch of javascript stuff so you research the material later on your own.


  • Lines starting with // will be ignored by the javascript runtime.
  • Same for blocks surrounded with /* and */.

Primitive Datatypes

  • undefined
  • null
  • boolean
  • string
  • number


Objects in javascript can be thought of as a set of properties. Each property has a key and a value. The key of a property can be used to get or set values.

  key: 'value',
  color: 'blue',


In HTML, JavaScript statements are "instructions" to be "executed" by the web browser.

  • var - Declares a variable, optionally initializing it to a value.
  • if - Executes a statement if a statement is true.
  • for - Creates a loop that consists of three optional expressions, enclosed in parentheses and separated by semicolons, followed by a statement executed in the loop.

See a list of all javascript statements and declarations


Just go over the operators that are used when building the chatApp.

  • = - Assignment operator. Will set a variable to a value. The left value the target of the assignment.
  • === - Comparison operator. Checks type and value are equal.
  • !== - Comparison operator. Checks type and value are not equal.
  • + - Arithmetic operator. Returns the sum of the left and right values.

Operator example:

// Assignment
var myVariable = 1;

// Comparison
1 !== 2

// Arithmetic
1 + 1

Operators can be used together:

// Assignment and arithmetic
var two = 1 + 1;

// Assignment and comparison
var isFalse = 1 === two;

For a full list, see this list of javascript operators.


Functions, the last javascript datatype, are not primitives. They take arguments and can return values.

The function declaration declares (defines) a function with specified parameters.

function add(argument1, argument2) {
  return argument1 + argument2;

To use a function, you need to invoke it.

var two = add(1, 1);

Notice that when used with the assignment operator, =, that value that is returned by the function will be assigned to the variable on the left.

Workshop: Chat Application

To put these concepts to use we are going to build a simple chat room application. This will demonstrate two different javascript runtimes, the client browser and the server NodeJS runtime. You can also use the end result as a starting point for other explorative javascript projects. This repository is used to show solutions for each step of the lesson. To check your code against the working solution, you can click the title of the step below or select the tag for the corresponding step.

Step 1: Hello Worlding

Create an index.html, index.js and style.css files then add a minimal amount of code to make sure they are all working.

Step 2: HTML / CSS

Copy some styles and html into the app or write your own.

Step 3: Client Javascript

Write some code that appends the text input value to a the messages list then resets the message input.

Step 4: Server Javascript

Setup a simple node server that serves our index.html, index.js and style.css files.

Step 5: Socket.IO

Add to the project and dispatch messages to our server (instead of just appending them to our display).

Step 6: Communicate

Use from the server to listen for chat messages then dispatch those messages to all connected clients. In the client, listen for chat events and display the message value in the messages list.


This is a fast introduction to javascript.







No packages published