Student Presentation Schedule

See the Student Presentations coming soon

Jan 26th:
Web Tech – Jessica
Haptic Interfaces – Kuan

Feb 2nd
Smart Homes – Stewart
Wearables – SiMeng

Feb 16th
Machine Learning – Tori
Computer Vision – Vivian

Feb 23rd
Nano Technology – Jane
Drones – Cindy

March 2nd
Robotics – Kevin
Powered exoskeleton – Jan

March 9th
Virtual Reality – PanPan
Augmented Reality – Amanda

March 16th
Ubiquitous Computing – Zoe
Artificial Intelligence – Yandi

March 23rd
EEG – Bergthora
Smart Grid – Xuan

The Web Stack

Understanding that software is commonly layered together to create a computing experience is important. Although there are many combinations and approaches the most popular ‘stack’ or group of open source technologies used to bring almost all websites to the world is the LAMP website.

LAMP is an acronym for the 4 software layers that create the web stack.

These are the components of LAMP:

webstack

L – Linux – an open source operating system
A – Apache – an open source web server
M – MySQL – an open source database server
P – PHP – a programming language

An easy way to have this same functionality on a Mac is by installing MAMP or following the instructions to enable AMP on OSX.

If you’d like to install Apache, MySQL and PHP with command line, then this is the tutorial for you: How To Set Up Apache MySQL and PHP with Homebrew

Reference: Shedding Light on the LAMP Stack

Web Technologies 01

This course relies on a foundational knowledge of Web technology. You’ll hear a great deal of acronyms and jargon thrown around by essentially every website you see is HTML, CSS and Javascript at its elemental level.

html-css-js-diagram

HTML (Hypertext Markup Language) is a markup language that provides the structure, content and pulls in CSS and Javascript. To learn about HTML see this Lynda.com module

CSS (Cascading Style Sheets) is how the HTML file tells the browser how it would prefer to be displayed and provides all the information about the presentation of the content. To learn about CSS see this Lynda.com module

Javascript is the programming language that provides the behaviours for the HTML. To learn about Javascript see this Lynda.com modules

 

Essential Javascript Links

# Essential JavaScript Links

A curated list by Eric Elliott and friends. Suggest links in the comments below.

This is a very exclusive collection of only must-have JavaScript links. I’m only listing my favorite links. Nothing else makes the cut. Feel free to suggest links if you think they’re good enough to make this list.

## Required Reading (Online resources)

* Learn JavaScript Essentials (for all skill levels) – One clear path to JavaScript mastery
* JavaScript Training Sucks 99 out of 100 JS developers lack the skills they need to fill hundreds of thousands of jobs. We can change that.
* The Two Pillars of JavaScript Part 1: Prototypal OO
* The Two Pillars of JavaScript Part 2: Functional Programming
* JavaScript Objects An excellent explanation of inheritance in JavaScript by Kyle Simpson
* Isomorphic JavaScript
* JavaScript Application Architecture on the Road to 2015 – Addy Osmani
* Reactive MVC and the Virtual DOM Great read, even if you’re not a React user.
* Introduction to Reactive Programming
* The General Theory of Reactivity What is all this talk about reactive? Functional? Promises? This is the beginning of a reactive programming bible.
* ES6 Generators A series of blog posts by Kyle Simpson
* Typed JavaScript – Excellent post about the state of typed JavaScript by Axel Rauschmayer
* Taming the Asynchronous Beast with CSP in JavaScript – James Long
* ES6 Modules: The Final Syntax by @rauschma #AMDisDead
## Required Viewing
* [Asynchronous Programming at Netflix](https://www.youtube.com/watch?v=gawmdhCNy-A) – [Jafar Husain](https://twitter.com/jhusain)
* [David Nolen: Immutability: Putting The Dream Machine To Work](https://www.youtube.com/watch?v=SiFwRtCnxv4) – [David Nolen](https://twitter.com/swannodette)
* [Delivering the Goods](https://www.youtube.com/watch?v=R8W_6xWphtw) Paul Irish on one of the most important but overlooked topics in the development world today – page load times.

## Spec

* [ES5 Spec](http://es5.github.io/) An annotated, hyperlinked version of the ES5 spec
* [ES6 draft](https://people.mozilla.org/~jorendorff/es6-draft.html)
## Books

* [JavaScript for Kids](http://www.amazon.com/gp/product/B00QL616QE?ie=UTF8&camp=213733&creative=393177&creativeASIN=B00QL616QE&linkCode=shr&tag=ericleads-20&linkId=6AOODC27L6URY3K2)
* [Eloquent JavaScript](http://eloquentjavascript.net/)
* [JavaScript: The Good Parts](http://www.amazon.com/gp/product/0596517742?ie=UTF8&camp=213733&creative=393185&creativeASIN=0596517742&linkCode=shr&tag=ericleads-20&linkId=IJKESYSOTWGC27DR)
* [Effective JavaScript](http://www.amazon.com/gp/product/0321812182?ie=UTF8&camp=213733&creative=393185&creativeASIN=0321812182&linkCode=shr&tag=ericleads-20&linkId=JIC63I267I6UDQQZ)
* [Programming JavaScript Applications](http://pjabook.com)
* [JavaScript: The Definitive Guide](http://www.amazon.com/gp/product/0596805527?ie=UTF8&camp=213733&creative=393185&creativeASIN=0596805527&linkCode=shr&tag=ericleads-20&linkId=AENIF5KLRQI3N335)
* [You Don’t Know JS](https://github.com/getify/You-Dont-Know-JS)
* [Understanding ECMAScript 6](https://leanpub.com/understandinges6/read/) by Nicholas C. Zakas
* [Node.js in Action](http://www.manning.com/cantelon/)
* [The Dream Machine: J.C.R. Licklider and the Revolution That Made Computing Personal](http://www.amazon.com/gp/product/0670899763?ie=UTF8&camp=213733&creative=393177&creativeASIN=0670899763&linkCode=shr&tag=ericleads-20&linkId=NDUXYQOCMPC47SQI)
## Dev tools & collaboration

* [nvm](https://github.com/creationix/nvm) First install this…
* [Node](http://nodejs.org/) Then install Node (with nvm). You’ll need this even if you’re a front-end dev.
* [npm](https://www.npmjs.com/) Install lots of other things with npm. **The package manager for JavaScript.** Comes with Node.
* [Sublime Text 3](http://www.sublimetext.com/3)
* [Node Inspector](https://github.com/node-inspector/node-inspector) Debug Node code with the Chrome debug tools
* [TraceGL](https://github.com/traceglMPL/tracegl) Powerful runtime analysis of live JavaScript code
* [Tern](http://ternjs.net/) Static analysis in JavaScript
* [JSDoc](http://usejsdoc.org/) – Pair with [Tern](http://ternjs.net/) for static analysis
* [Nitrous.IO](https://www.nitrous.io/join/uJcRo6yQDvs?utm_source=nitrous.io&utm_medium=copypaste&utm_campaign=referral) (Supports live collaboration / pair programming)
* [Slack](http://slack.com) Chat for teams, with GitHub and Google hangouts integration
* For hangouts, just type /hangout in any channel
* [PrettyDiff](http://prettydiff.com/)
* [ES6 Fiddle](http://www.es6fiddle.net/)
## Building

* [Browserify](http://browserify.org/) Bundle modules for the browser.
* [How to use NPM as a Build Tool](http://blog.keithcirkel.co.uk/how-to-use-npm-as-a-build-tool/)
### Lint / Quality checkers

* [JSHint](http://jshint.com/)
* [ESLint](http://eslint.org/)
* [Istanbul](https://github.com/gotwarlost/istanbul) Code coverage reporting
* [tape](https://github.com/substack/tape) and [faucet](https://github.com/substack/faucet) for dead simple unit testing.
### Transpilers

* [6to5](https://github.com/6to5/6to5) (ES6)
* [CoffeeScript](http://coffeescript.org/)
* [Emscripten](http://kripken.github.io/emscripten-site/) (frequently used for C/C++ JavaScript ports)
* [Traceur](https://github.com/google/traceur-compiler) (ES.next)
* [ES6 tools](https://github.com/addyosmani/es6-tools) Addy Osmani’s ES6 Tools list
## JavaScript environments

* [Node.js](http://nodejs.org/) Server side JavaScript and more
* [io.js](https://iojs.org/) – The Node fork
## Libraries

* [es5-shim](https://github.com/es-shims/es5-shim) Stable, production ready.
* [es6-shim](https://github.com/es-shims/es6-shim/) Somewhat stable, but a few things I thought were solid got shifted to ES7.
* [es7-shim](https://www.npmjs.com/package/es7-shim) Experimantal. Use with caution.
* [native-promise-only](https://github.com/getify/native-promise-only) An ECMAScript standard promise polyfill by Kyle Simpson
* [isomorphic-fetch](https://github.com/matthew-andrews/isomorphic-fetch) A [WHATWG fetch](https://fetch.spec.whatwg.org/) standard polyfill
* [jQuery](http://jquery.com/) Yes, [I still use jQuery](https://docs.google.com/document/d/1LPaPA30bLUB_publLIMF0RlhdnPx_ePXm7oW02iiT6o/edit#) and so do 61% of the top 100,000 websites – for good reason.
* [Blaze](http://meteor.github.io/blaze/) DOM-diffing isomorphic reactive templates from Meteor
* [RxJS](https://github.com/Reactive-Extensions/RxJS) Reactive extensions for JavaScript. [What’s reactive?](https://medium.com/javascript-scene/the-two-pillars-of-javascript-pt-2-functional-programming-a63aa53a41a4)
* [Moment](http://momentjs.com/docs/) A lightweight JavaScript date library for parsing, validating, manipulating, and formatting dates.
* [Globalize](https://github.com/jquery/globalize) i18n / translate your app for many languages and locations (locales)
* [Express](http://expressjs.com/) The most popular framework for Node
* [Stampit](https://github.com/ericelliott/stampit) Stampit – create objects from reusable, composable behaviors. Prototypal inheritance with stamps.
* [Credential](https://github.com/ericelliott/credential) If you write Node apps with password logins, you need Credential
* [cuid](https://github.com/ericelliott/cuid) GUIDs are broken – use cuid, instead
* [velocity](http://julian.com/research/velocity/) & [Velocity Motion Designer (VMD)](http://julian.com/research/velocity/#vmd) UI animation library
* [json-schema](https://github.com/kriszyp/json-schema) – Great for model validations
## Web Components

* [FIRST](http://addyosmani.com/first/)
* [Polyfills](http://webcomponents.org/polyfills/)
* [HTML Imports](http://webcomponents.org/articles/introduction-to-html-imports/)
* [Custom Elements](http://webcomponents.org/articles/introduction-to-custom-elements/)
* [Templates](http://webcomponents.org/articles/introduction-to-template-element/)
* [Shadow DOM](http://webcomponents.org/articles/introduction-to-shadow-dom/)
* [x-gif](http://geelen.github.io/x-gif/#/http://i.imgur.com/iKXH4E2.gif) This web component wins the internet.
## QA / Deployment / Monitoring / CI

* [PM2](https://github.com/Unitech/pm2) Process monitoring / self repair
* [New Relic](http://newrelic.com/) Deep insights into the performance and health of your production apps
* [Sauce Labs](https://saucelabs.com/) Cross platform web application testing with great collaboration and integration support
* [Travis CI](https://travis-ci.org/) CI, of course
* [Docker](https://www.docker.com/) Run your CI process using the same OS configs as your production systems.
* [Shippable](https://www.shippable.com/) Docker-based hosted build / CI
## Community

* [ES Discuss](https://esdiscuss.org/) The mailing list where all the ECMAScript standard discussion action is.
* [JavaScript on Google+](https://plus.google.com/communities/100875929141897651837)
* [HTML5 on Google+](https://plus.google.com/communities/103299867207875326585)
* [Node.js on Google+](https://plus.google.com/communities/115365528781941125390)
* IRC ##JavaScript irc://irc.freenode.net/javascript
* IRC #node.js irc://irc.freenode.net/node.js
* IRC #io.js irc://irc.freenode.net/io.js – the Node fork
## News
* [JavaScript Weekly](http://javascriptweekly.com/)
* [Node Weekly](http://nodeweekly.com/)
* [HTML5 Weekly](http://html5weekly.com/)
* [EchoJS](http://www.echojs.com/)
* [DailyJS](http://dailyjs.com/)
* [JavaScript Jabber](http://devchat.tv/js-jabber/)
## Pasting / sharing code

* [Codepen](http://codepen.io/pen/)
* [RequireBin](http://requirebin.com/)
## Contests

* [DemoJS](http://demojs.org/) The JavaScript demoscene party
* [JS1k](http://js1k.com/) JavaScript domes in 1k of memory
* [JS13k Games](http://js13kgames.com/) JavaScript games in 13k of memory
* [FightCode game](http://fightcodegame.com/) program virtual battle bots and climb the leaderboard
* [Node Knockout](http://nodeknockout.com/) The legendary Node competition
## Hackable Hardware

* [Nodebots](http://nodebots.io/)
* [Cylon](http://cylonjs.com/)
* [Nodecopter](http://www.nodecopter.com/)
* [Tessel](https://tessel.io/)
* [Espruino](http://www.espruino.com/)
## Hosting

* [DigitalOcean](https://www.digitalocean.com/?refcode=fdcfedac5208)
## Twitter (alphabetical order)

* [Addy Osmani](https://twitter.com/addyosmani) – App architecture expert, Chrome dev tools champion
* [Angus Croll](https://twitter.com/angustweets) – Author, “If Hemingway Wrote JavaScript”
* [Axel Rauschmayer](https://twitter.com/rauschma) – ES Next evangelist, author
* [Brendan Eich](https://twitter.com/BrendanEich) – Created JavaScript
* [David Nolen](https://twitter.com/swannodette) – Great functional programming content
* [David Herman](https://twitter.com/littlecalculist) – Author, “Effective JavaScript”
* [EchoJS](https://twitter.com/echojs) – News and links
* [Eric Elliott](https://twitter.com/_ericelliott) – That’s me. O’Reilly author. JavaScript architect. JS Instructor.
* [Jafar Husain](https://twitter.com/jhusain) – Great talks on RxJS, ES next, etc…
* [James Halliday](https://twitter.com/substack) aka Substack – author of ~one million~ Node modules you probably use.
* [James Long](https://twitter.com/jlongster) – CSP, functional programming advocate, Mozilla developer
* [JavaScript Cheerleader](https://twitter.com/JS_Cheerleader) – Mover & shaker, JavaScript evangelist, documentary film maker
* [JavaScript Daily](https://twitter.com/JavaScriptDaily) – News and links
* [Jordan Harband](https://twitter.com/ljharb) – Keeping us ahead of the JS curve
* [Kyle Simpson](https://twitter.com/getify) – Author, YDKJS – O’Reilly, JS Instructor, open web evangelist
* [Marijn Haverbeke](https://twitter.com/marijnjh) – Author, “Eloquent JavaScript”
* [Nicholas C. Zakas](https://twitter.com/slicknet) – Author, speaker
* [Nick Morgan](https://twitter.com/skilldrick) – Author, “JavaScript for Kids”
* [Paul Irish](https://twitter.com/paul_irish) – Developer evangelist, Chrome dev tools champion
* [Reginald Braithwaite](https://twitter.com/raganwald) – Author, “JavaScript Allongé”, speaker, GitHub
* [YDKJS](https://twitter.com/ydkjs) – You Don’t Know JS, O’Reilly book series by Kyle Simpson