blamy / rit-ist Goto Github PK

1.0 2.0 0.0 839 KB

A redesign of ist.rit.edu for 340 - Client Programming

CSS 29.90% JavaScript 58.38% HTML 11.73%

rit-ist's Introduction

rit-ist

This is a redesign of ist.rit.edu for 340 - Client Programming.

The goal of this project is to come up with a sane architecture for consuming www.ist.rit.edu/api/. The only requirement is the Project must use jQuery and 3 plugins.

For my plugins I have chosen to use:

RxJS-JQuery - Adds reactive bindings to jquery. Allow me to wrap jQueries HTTP request and get back an Observable rather than a promise.
jQuery Tables - Used in coop/professional tables
Materializecss - jQuery based CSS framework for Material Design.

Aside from that I have optionally selected:

Require.js - Adds sane module loading. I chose AMD vs es2015 modules since es6 modules are not supported in any browser natively. The goal is to only use es2015 features if they are supported natively in the latest browsers, and produce transpiled code which is easily mapped to the source (only use features which are light syntactic sugar).
Gulp - Build process. Will optimize code to run IE 9+;
Font Awesome - To reuse all the same icons as the current website.

Build dependencies

Building is only required if you want to run this project in an out of date browser

Node
bower sudo npm install -g bower
gulp sudo npm install -g gulp

Building Project

Building is only required if you want to run this project in an out of date browser

git clone https://github.com/BLamy/rit-ist.git
cd rit-ist
npm install
bower install
gulp serve

ES2015

The following ES2015 features will be used:

Arrow functions: http://caniuse.com/#search=arrow%20functions

Template Literals: https://kangax.github.io/compat-table/es6/#test-template_strings

Const Keyword: http://caniuse.com/#search=const

Let Keyword: http://caniuse.com/#search=let

All of these features will work in the latest browsers without any building. For support in browsers older than IE edge you can use gulp to remove the sugar and produce pure es5 code.

Gulp support

A gulp file is provided for building the application.

gulp vulcanize - Will flatten AMD modules from compatibility/* to one dist/app.js file. For use in production.
gulp transpile - Will take code from src/**/*.js and transpile it into compatibility directory for testing in old browsers.
gulp build - Will create a distribution build.

Known Issues

Click handlers should not be inside inside of the observers subscribe block. event streams should be merged to be more RX-like.
Micro optimization - Employment model should be pulled in using individual request only loading the ones that are needed immediately.