Adopting Node.js and CoffeeScript in a Software Design Course

Adopting Node.js and CoffeeScript in a Software Design Course

Introduction Midwest Instruction and Computing Symposium Course Outline Server April 25, 2014 Technologies Node.js CoffeeScript MongoDB Maxwell Marti

Client Technologies [email protected] jQuery Backbone.js Bootstrap

Testing and Integration Course Workflow Strider Mocha

Conclusion The Software Design and Development Course

Adopting Node.js and CoffeeScript in a Software Design Course Single project Introduction Course Outline Small groups Server Technologies Node.js Agile methodology CoffeeScript MongoDB

Client External customer: LightSide Labs Technologies jQuery Backbone.js Current technology Bootstrap

Testing and Integration Course Workflow Strider Mocha

Conclusion Node.js

Adopting Node.js and CoffeeScript in a Software Design Course Framework for network applications

Introduction Uses the V8 JavaScript Engine Course Outline

Server Technologies Built in web server Node.js CoffeeScript MongoDB Asynchronous I/O and JavaScript evaluation Client Technologies Single-threaded event loop jQuery Backbone.js Bootstrap Large number of additional modules Testing and Integration Course Workflow Strider Mocha

Conclusion Node Modules

Adopting Node.js and CoffeeScript in a Software Design Course

Introduction Course Outline Express Server Technologies Node.js Hogan CoffeeScript MongoDB Blanket Client Technologies jQuery Backbone.js Bootstrap

Testing and Integration Course Workflow Strider Mocha

Conclusion CoffeeScript

Adopting Node.js and CoffeeScript in a Software Design Course

Introduction A language that transpiles to JavaScript Course Outline Server Clean syntax Technologies Node.js CoffeeScript About 1/3 fewer lines of code MongoDB

Client Technologies Scope safety and object encapsulation jQuery Backbone.js Bootstrap

Testing and Integration Course Workflow Strider Mocha

Conclusion CoffeeScript to JavaScript Example

Adopting Node.js and var myObj, num, CoffeeScript in a Software numSquared, square; Design Course num = 9; num = 9 Introduction Course Outline square = (x) -> x * x square = function(x) { Server numSquared = square num return x * x; Technologies Node.js }; CoffeeScript myObj = MongoDB name: "Mr. Object", numSquared = square(num); Client Technologies likes: "squaring numbers", jQuery Backbone.js mySqare: square myObj = { Bootstrap name: "Mr. Object", Testing and Integration likes: "squaring numbers", Course Workflow mySqare: square Strider Mocha }; Conclusion MongoDB

Adopting Node.js and CoffeeScript in a Software Design Course

Introduction Document oriented database Course Outline Server Records in JavaScript Object Notation (JSON) Technologies Node.js CoffeeScript Queries in JavaScript MongoDB

Client Technologies Mongoose module provides extra utility jQuery Backbone.js Bootstrap

Testing and Integration Course Workflow Strider Mocha

Conclusion jQuery

Adopting Node.js and CoffeeScript in a Software Design Course

Introduction DOM interaction library Course Outline Server Ubiquitous Technologies Node.js CoffeeScript Powerful selectors and functions MongoDB

Client Technologies Integrates with other front-end tools jQuery Backbone.js Bootstrap

Testing and Integration Course Workflow Strider Mocha

Conclusion jQuery Example

Adopting Node.js and CoffeeScript in a Software Design Course // set html for element $("p:first").html( "This is the first paragraph"); Introduction Course Outline

Server // set value for all inputs of myClass Technologies $("input.myClass").val("default text"); Node.js CoffeeScript MongoDB // bind a function to the click event of an element Client Technologies $("#myButton").on("click", function(){ jQuery alert("Button was clicked"); Backbone.js Bootstrap }); Testing and Integration Course Workflow Strider Mocha

Conclusion Backbone.js

Adopting Node.js and CoffeeScript in a Software Design Course MV* Framework for client-side applications

Introduction HTML rendering on the browser Course Outline

Server Technologies Models, Views, Routers Node.js CoffeeScript MongoDB Hierarchical views with event emission Client Technologies jQuery REST API conformity with Models and Collections Backbone.js Bootstrap Minimal opinionation Testing and Integration Course Workflow Strider Mocha

Conclusion Bootstrap

Adopting Node.js and CoffeeScript in a Software Design Course Formerly Twitter Bootstrap Introduction Course Outline Responsive grid layouts Server Technologies Node.js CSS classes and JavaScript utilities for the client CoffeeScript MongoDB

Client Easy to customize Technologies jQuery Backbone.js Simplifies web interface design Bootstrap

Testing and Integration Course Workflow Strider Mocha

Conclusion Development Workflow

Adopting Node.js and CoffeeScript in a Software Design Course

Introduction WebStorm IDE (based on IntelliJ IDEA) Course Outline Server Unit testing with Mocha Technologies Node.js CoffeeScript Version control with GitHub MongoDB

Client Technologies Continuous integration with Strider jQuery Backbone.js Bootstrap

Testing and Integration Course Workflow Strider Mocha

Conclusion Strider

Adopting Node.js and CoffeeScript in a Software Design Course Continuous integration and deployment server

Introduction Pulls code from GitHub Course Outline

Server Technologies Compiles Coffeescript and runs tests Node.js CoffeeScript MongoDB Computes code coverage metrics Client Technologies Deploys projects to web server for evaluation jQuery Backbone.js Bootstrap Supports plugins and custom shell scripts Testing and Integration Course Workflow Strider Mocha

Conclusion Unit Testing With Mocha

Adopting Node.js and CoffeeScript in a Software Design Course

Introduction Defines structure and syntax of test code Course Outline Server Choice of assertion libraries Technologies Node.js CoffeeScript Different testing styles supported MongoDB

Client Technologies Versions for Node.js and client-side code jQuery Backbone.js Bootstrap

Testing and Integration Course Workflow Strider Mocha

Conclusion Conclusion and Observations

Adopting Node.js and CoffeeScript in a Software Design Course Unified language both helps and hurts students Introduction Course Outline Particular difficulty with Backbone.js Server Technologies Node.js Module driven development CoffeeScript MongoDB

Client High velocity and low familiarity affects testing practices Technologies jQuery Backbone.js Customer interaction Bootstrap

Testing and Integration Course Workflow Strider Mocha

Conclusion