Introduction
JavaScript is the world's most popular programming language, and is the primary client-side programming language used on Google, Facebook, YouTube, Wikipedia, Twitter, Amazon and more to power functionality.
Despite that fact, there is a serious lack of basic sites for JavaScript that explain in simple terms what it is and give simple examples. Most people remain in the dark about this technology that most of us in the developed world encounter many times a day without even knowing it.
For you personally, in terms of web design, it is important to have a basic knowledge of what JavaScript is, how to recognize it, and how to find and use snippets--that is, small, pre-written chunks of it--in order to understand how the web works and when/how to use it in your own sites.
Task
70-Minute Hackathon:
In teams of two or alone, design a small website that defines JavaScript for someone who has never heard of it before, using examples of JavaScript to explain what it is and illustrate how it can be used.
Research shows that for a definition to stick, a novice needs four things to hold onto:
1A. A formal definition of the concept (table: noun. a piece of furniture with a flat top and one or more legs)
2A. Characteristics of the concept (provides a level surface on which objects may be placed, all legs are even, may be tall or short, often found in restaurants)
3A. Examples of the concept (an operating table, a table for food, a table can be used for both food and homework, some tables are just for books and coffee)
4A. Nonexamples of the concept (a table is not a floor because it is raised and should not be used as a floor, and is different from a desk which may have tools for working at it, and is different from a chair because you do not sit on it)
Apart from the definition, you need to include examples of Javascript to aid the definition in some way. Because Javascript and Jquery snippets at a beginner level are really more about your searching skills--knowing what Javascript snippets look like and then implementing them-- than me demo-ing anything in particular, I have given you resources and you are going to spend some time today attempting AT LEAST the following.
1B. Displays the date or time or any string of numbers or letters
2B. Has an element of some kind that changes something visual: a background color or an image for example
3B. An onclick event of some kind--that is, something that changes in some way when clicked
4B. Has a pop-up box of some kind that shows up when something happens or changes--a timer, a click, a mouse movement, hover, scroll, etc.
If you are not clear on whether or not the snippet you've found fits these criteria, let me know.
Anything that you add on top of these is a welcome addition.
We will be sharing your work at 7:40. Good luck!
Process
Explore (to define what Javascript is):
Suggested resources:
Watch Lynda.com's "What is Javascript" Tutorial: I suggest watching through "when not to use javascript" to get examples and nonexamples.
Read the introduction on W3Schools about javascript and play with the "try it yourself" examples.
Nice-to-see but not essential for this project:
A top list of clever and current uses of Javascript really shows you the possibilities
Make:
Examples of Javascript Snippets to copy/paste from W3Schools: http://www.w3schools.com/js/js_ex_objects.asp
Jquery is a JavaScript library: that is, just a library of JavaScript that someone else already wrote and put together to do more complicated things. Some of the project assignment will be done with Jquery snippets. Examples of Jquery Snippets to copy/paste for this assignment: http://www.w3schools.com/jquery/jquery_examples.asp
Evaluation
Does the site:
1. Cover all four definition areas?
2. Have a correct assessment of all four definition areas?
3. Include all four javascript requirements?
4. Correctly implement the javascript requirements in a way that helps show or explain what javascript is?