https://github.com/runemadsen/introduction-to-javascript
https://github.com/runemadsen/introduction-to-javascript
Last synced: 9 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/runemadsen/introduction-to-javascript
- Owner: runemadsen
- Created: 2013-04-13T14:11:27.000Z (over 12 years ago)
- Default Branch: master
- Last Pushed: 2013-04-26T21:31:06.000Z (over 12 years ago)
- Last Synced: 2025-04-01T21:51:57.552Z (9 months ago)
- Language: JavaScript
- Size: 375 KB
- Stars: 2
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Introduction to Javascript
The purpose of this 3-hour session is to talk about Javascript: What it is, how it's used on the web, and how we can take advantage of Javascript libraries with only a minimal understanding of programming.
## Introduction
* Teacher introduction
* Who am I?
* What do I use JS for?
* Student introduction
* Why are you interested in JS?
* Today
* Laptops down
* I show examples, you try them afterwards
## HTML and CSS?
* How the web works
* HTML, CSS and JS go together
* I'm using bootstrap.css as a styling library in these examples
## What is Javascript?
* Runs in the browser
* How to embed on a website (2 ways)
* Javascript examples
* [9/11 Tapes](http://www.nytimes.com/interactive/2011/09/08/nyregion/911-tapes.html)
* [512 paths to the White House](http://www.nytimes.com/interactive/2012/11/02/us/politics/paths-to-the-white-house.html)
* [Swing State Tracker](http://elections.nytimes.com/2012/swing-state-tracker)
* [Power Outages](http://www.nytimes.com/interactive/2012/10/31/nyregion/where-the-power-is-out-and-returning.html)
* [117 years of drought in the US](http://www.nytimes.com/interactive/2012/07/20/us/drought-footprint.html?gwh=10A7F534F97385C65250892EDFE18137)
## Introduction to Javascript
* Variables
* Functions
* Functions in Functions
* Javascript is nothing without libraries
## jQuery
* What is jQuery?
* Downloading and embedding jQuery
* How does jQuery work
* Using the jQuery.com documentaion
* **Example:** [Toggle menu with jQuery](https://github.com/runemadsen/introduction-to-javascript/blob/master/jquery_toggle.html)
* **Example:** [Something with jQuery animate](https://github.com/runemadsen/introduction-to-javascript/blob/master/jquery_animate.html)
## jQuery Plugins
* What is a jQuery plugin?
* How to find a plugin: [plugins.jquery.com](http://plugins.jquery.com/)
* How to add a plugin
* Example plugins
* [jQuery UI](http://jqueryui.com/)
* [jQuery Mobile](http://jquerymobile.com/)
* [jQuery Tools](http://jquerytools.org/)
* **Plugin Example:** [jQuery scrollto](https://github.com/runemadsen/introduction-to-javascript/blob/master/jquery_scrollto.html)
* **Plugin Example:** [jQuery tools image slideshow](https://github.com/runemadsen/introduction-to-javascript/blob/master/jquery_scrollable.html)
## Chart.js
* What is chart.js?
* How does it work?
* **Example:** [Doughnut chart](https://github.com/runemadsen/introduction-to-javascript/blob/master/chart_doughnut.html)
* **Example:** [Line chart](https://github.com/runemadsen/introduction-to-javascript/blob/master/chart_line.html)
* **Example:** [Radar chart](https://github.com/runemadsen/introduction-to-javascript/blob/master/chart_radar.html)
## Advanced Libraries
* [D3](http://d3js.org/) ([Examples](https://github.com/mbostock/d3/wiki/Gallery))
* [Processing.js](http://processingjs.org/)
* [Paper.js](http://paperjs.org/)
* [Raphael.js](http://raphaeljs.com/)
* [List of good libraries for data visualization](http://selection.datavisualization.ch/)