From d163b4b7c0585fa244602d71111153d5033b5c3d Mon Sep 17 00:00:00 2001
From: Adam Lehman
Date: Tue, 16 Oct 2012 15:24:48 -0400
Subject: [PATCH] New introduction and getting started content for JavaScript
101
---
order.yml | 1 +
page/javascript-101.md | 14 ++++--
page/javascript-101/getting-started.md | 67 ++++++++++++++++++++++++++
3 files changed, 79 insertions(+), 3 deletions(-)
create mode 100644 page/javascript-101/getting-started.md
diff --git a/order.yml b/order.yml
index 031ed663..de4ae97f 100644
--- a/order.yml
+++ b/order.yml
@@ -3,6 +3,7 @@
- downloading-jquery
- how-jquery-works
- javascript-101:
+ - getting-started
- running-code
- syntax-basics
- types
diff --git a/page/javascript-101.md b/page/javascript-101.md
index 31800ad0..471575d9 100644
--- a/page/javascript-101.md
+++ b/page/javascript-101.md
@@ -1,8 +1,16 @@
---
title : JavaScript 101
-level: beginner
+level: beginner
+attribution: jQuery Fundamentals
---
-jQuery is built on top of JavaScript, a rich and expressive language in its own right. This means when using jQuery, we are still writing valid JavaScript; it just serves as a framework to make many aspects of writing JavaScript easier and more reliable in the various browser environments. With that said, a basic knowledge of JavaScript will go a long way in understanding, structuring, and debugging our code; jQuery will just help make that basic knowledge go much, much further.
+##Introduction
+So you want to unlock the power of jQuery to make the web a better place? Awesome, but there are a few things you should know about JavaScript first.
-This section covers the basic concepts of JavaScript, as well as some frequent pitfalls many developers fall into during their first foray into the language. While it will be of particular value to people with little to no programming experience, even people who have used other programming languages may benefit from learning about some of the peculiarities of JavaScript.
+Introduced at the dawn of the web, [JavaScript](http://en.wikipedia.org/wiki/JavaScript) is a powerful and expressive language that runs inside the browser in conjunction with HTML and CSS. Based on an open standard called [ECMAScript](http://en.wikipedia.org/wiki/ECMAScript), JavaScript has quickly become the "programming language of the web". All the power of jQuery is accessed via JavaScript, so needless to say, it's an important language to learn. Having a basic knowledge of JavaScript will go a long way in understanding, structuring and debugging your code.
+
+This guide covers the foundational concepts of JavaScript, as well as frequent pitfalls developers fall into during their first foray into the language. When possible, we'll relate the JavaScript you learn here to how it's applied in jQuery.
+
+If you have experience with other programming languages, good for you! If not, don't worry. We'll take it slow and teach you everything you need to know to unlock the power of jQuery with JavaScript.
+
+##Table of Contents
\ No newline at end of file
diff --git a/page/javascript-101/getting-started.md b/page/javascript-101/getting-started.md
new file mode 100644
index 00000000..ed990222
--- /dev/null
+++ b/page/javascript-101/getting-started.md
@@ -0,0 +1,67 @@
+---
+title: Getting Started
+level: Beginner
+attribution: Adam Lehman (adrocknaphobia)
+---
+
+##Anatomy of a Web Page
+Before we dive into JavaScript, it helps to understand how it aligns with the other technologies when creating web pages.
+
+###HTML IS FOR CONTENT.
+HTML is a markup language used to define and describe content. Whether it be a blog post, a search engine result or an e-commerce site, the core content of a web page is written in HTML. A semantic markup, HTML is used to describe content in universal terms (headers, paragraphs, images, etc.).
+
+###CSS IS FOR PRESENTATION.
+CSS is a supplemental language that applies style to HTML documents. CSS is all about making your content look better by defining fonts, colors and other visual aesthetics. The power of CSS comes from the fact that your styling is not intermingled with your content. This means you can apply different styles to the same piece of content which is critical when building responsive websites that look good across a range of devices.
+
+###JAVASCRIPT IS FOR INTERACTIVITY.
+In the browser, JavaScript adds interactivity and behavior to HTML content. Without JavaScript, web pages would be static and boring. JavaScript helps us bring a web page to life.
+
+To put all this in perspective, let's look at a simple HTML page that includes CSS and JavaScript.
+
+``` html
+
+
+ Hello World
+
+
+
+
+
+
+
Hello World
+
+
+
+```
+
+In the example above, HTML is used to describe the content. The "Hello World" text is described as a heading with the `
` tag and "Click Me!" is described as a button with the `