2.3: Warm-up exercises (Advanced Internet Programming)

Right now, I encourage you to focus on setting up your working environment and preparing to be a productive developer:

Set up your computer
Complete the warm-up exercises below
Study any of the Assumed Knowledge you are missing

Right now, you may not have any experience with JavaScript. That is fine! This is a perfect chance to conduct some independent study.

Consider, for yourself, what kinds of resources (e.g., tutorials, books, videos) will suit you best. Sometimes I like to start by building minimal projects and then experimenting; other times I like to read a book cover-to-cover. Some learners have told me that they prefer to watch online courses. Others like to work on a personal project. If you find a helpful resource, please share it on the discussion board with a explanation why you found it useful.

Exercise: Hello, world

Create a file named index.js, containing the following single line of code:

console.log("hello, world");

In the console, run the file using the command: node index.js

You should be able to see the output:

$ node index.js
hello, world
$

Exercise: Text in a frame

Create a new JavaScript file named textinaframe.js.

Open the file in your editor and add the following code:

let lines = ["Hello", "World", "in", "a", "frame"];
console.log('to do');

Run the file in your terminal:

$ node textinaframe.js
to do
$

Now, edit the script so instead of writing to do, it turns the list in lines into a neatly boxed output like this:

$ node textinaframe.js
*********
* Hello *
* World *
* in    *
* a     *
* frame *
*********
$

Tip	You can get the length of a string by accessing the `.length` property. (e.g., `"Hello".length == 5`)

Tip

If you haven’t programmed in JavaScript previously (or recently) you may need other study resources to complete this exercise. The point of this exercise is to encourage you to begin discovering ways to research independently. Use this warm-up exercise as a goal to keep in mind as you find tutorials, books or videos about JavaScript.

Exercise: HTML

Create an HTML file named index.html.

Open the file in your editor and add the following code:

<!DOCTYPE html>
<html>
    <head>
        <title>Hello, World!</title>
    </head>
    <body>
        <h1>AIP</h1>
        <p>Hello, World!</p>
    </body>
</html>

Open the file using a web browser. You should see something like this:

Now, try to edit the file so that it looks something like this:

If you’d like to stretch yourself a bit further, you might experiment by adding some styling using CSS.