javascript-to-do-list.step

message <<-MARKDOWN
### Goal

By the end of this session, you should understand how JavaScript is used
in a modern web application. You're going to be building a personal to do list application.
You've decided that you'd like to:

* Add an item to your list
* Mark an item as complete
* Load your list from multiple computers.

You've sketched up an initial screenshot of what you want it to look like:

![Browser window with list application running](img/finished_app.png)

### Meta-Goal

When you have completed today's goal of getting the basic
application online you should understand:

* How JavaScript, CSS, and HTML interact with the browser.
* How to use JavaScript to interact with a server.
* How to incrementally add features to your application.
* How to get your application online.

### Schedule

* 2-ish hours of JavaScript and the basics of clients and servers.
* 3-ish hours of adding features to you application, broken up into 1 hour chunks.

This is just a rough guideline, not a mandate. Some steps you'll go
over and some you'll go under. It'll all work out by the end of the
day. Probably.

### Requirements

When programming, you'll generally want these tools on hand:

  * An internet connection. We're going to be communicating with other websites using JavaScript.
  * Your browser to see the code running (I recommend Chrome, but any will do!)
  * A text editor to change the code (Railsbridge recommends <a href="https://atom.io/">Atom</a>, but you can <a href="/installfest/editors">try a different editor</a>)
  * A Javascript console so you can experiment and print out debugging
  messages. This is built into your browser.

Before you can start the tutorial, you'll need to <a href="IntermediateTodoList.zip">download the tutorial</a>
to your computer to edit the source code.

Once you've downloaded it, open index.html with your browser. You should see a mock up of your list. If you do not, get an instructor to help you out.
MARKDOWN

insert 'lesson_format'

insert 'teachers_note'

next_step "the_basics_of_a_website"