Requirements for Web Programming

On-campus and Online

Prerequisites
Textbooks
LyndaCampus
Software
Grading
Discussions & Quizzes
Exercises
Term Project

Prerequisites

Students are expected to have basic knowledge and/or familiarity with:

Create and upload HTML Web pages that are standards compliant and contain relative and absolute links, tables, images and embedded video or data widgets.
Design external Cascading Style Sheets that control the layout and visual appearance of a set of Web pages.
Understand Basic Programming Concepts (variables, arrays, loops and simple functions)
Understand the Basics of JavaScript to create simple or customize existing code examples.

Textbooks

Optional: MEAN Web Development (2nd Edition) by Amos Q. Haviv - Order

LyndaCampus

This course makes extensive use of relevant Lynda.com videos, which SC&I students can access for free.
Login to LyndaCampus (when you first log into lynda, you are given the opportunity to personalize your profile).
Remember: you must log into LyndaCampus - https://lynda.comminfo.rutgers.edu/Login - to be able to access the lynda.com videos and the login link is also included toward the top of the Lectures page of this course..
For more information and access instructions, please see http://lynda.comminfo.rutgers.edu. For any difficulties accessing the content of lynda.com please contact SC&I IT Services at help@comminfo.rutgers.edu.

Prerequisites

Tools: Code Editor and Version Control

JavaScript

Front-End Frameworks

Back-End Frameworks

MEAN Stack and Databases

MEAN Stack and MongoDB Development Techniques

Software

File Transfer Protocol (FTP) - you only need to download one:
Filezilla (Windows / Mac): http://filezilla-project.org/
WinSCP (Windows): http://winscp.net/eng/download.php
Fugu (Mac): http://rsug.itd.umich.edu/software/fugu/download.html
CyberDuck (Mac): http://cyberduck.ch/

Code Editor for HTML, CSS, JavaScript coding
Atom (Windows / Mac): https://atom.io/
Documentation
Videos: Learn Atom: The Basics
Downloading and installing Atom (6:02)
Sublime Text (Windows / Mac): https://www.sublimetext.com/
NotePad++ (Windows): http://sourceforge.net/projects/notepad-plus/ (if the Download on SoundForge is empty then use this download link)
TextWrangler (Mac): http://www.barebones.com/products/textwrangler/

CSS
Reset CSS
HTML5 Reset CSS
Normalize CSS
Pre-Processors: CSS preprocessors on the other hand, are not restricted by the syntax rules of CSS. They extend the language with features such as variables, nesting, mixins and more, which can help make writing CSS less redundant, easier to maintain and scalable.
Less: http://lesscss.org/ (runs on Node.js)
Stylus: http://stylus-lang.com/ (runs on Node.js)
Sass / SCSS: http://sass-lang.com/ (runs on Ruby)
Minifier:
Prepros: https://prepros.io/
Browser Tools and Plugins
Chrome
More Tools > Developer Tools
Inspect HTML elements and CSS
JavaScript Console
Pluglins
whatfont
Awesome Screenshot
Workflow Tools
Comand Line Interfaces
Tutorials: Intro | Primer for Beginners
Task Runners: Google Trends
Gulp.js: http://gulpjs.com/ | Get Started
Grunt.js: http://gruntjs.com/ | Getting Started
Best Node.js Build Systems and Task Runners
Code Version Control and Code Repository Hosting Service
Git: https://git-scm.com/
GitHub: https://github.com/ | Join | Student Developer Pack
Videos: Up and Running with Git and GitHub
Installing Git on a Mac (3:44)
Installing Git on Windows (5:37)
Configuring Git (7:29)
Using Git help (2:17)
Setting up a GitHub account (5:39)
Adding a remote repository (4:00)
Compilers
Babel: https://babeljs.io/ | Set Up
Bundlers
WebPack: https://webpack.github.io/ |
Browserify: http://browserify.org/ | Install (requires Node)
Tool for compiling node-flavored commonjs modules for the browser.
Front-End Frameworks: Google Trends
Bootstrap.js: http://getbootstrap.com/
Download | Getting Started| Examples | Bootstrap's plug-in library requires jQuery
Tutorials: W3Schools
Videos: Bootstrap 3 Essential Training
Introduction and installation options (5:53)
Creating a basic template using CDNs (7:32)
Downloading and installing manually (5:51)
React.js: https://facebook.github.io/react/
Install | Get Started | Tutorial
Tutorials:
Videos: Learn React.js: The Basics
Angular.js:
Download | Documentation |
Tutorials: W3Schools
Videos:
Back-End Frameworks: Google Trends
Node.js:
Download | Documentation | Tutorials
Express.js:
Download | Documentation | Tutorials
Videos: Building a Website with Node.js and Express.js
Databases
MongoDB
Download | Documentation | Tutorials

Grading

You will be able to resubmit the individual exercises to improve your score based on the provided feedback. Because of this, the shown grading scale is used.

95 - 100	A
90 - 95	B+
85 - 90	B
80 - 85	C+
75 - 80	C

Discussions & Quizzes (15% of Course Grade)

There will be class discussions conducted online and several quizzes:

Discussions (7.5% of Course Grade)
Discussions will be conducted online, using Sakai, because the online format leads to everybody contributing and better comprehension of the content.
Quizzes (7.5% of Course Grade)

There will be six quizzes that are related to content to be learned to create the exercises and project.

The quizzes will be "open book" and due on Sunday and one week before the due date of the related exercise or project.

The five quizzes with highest scores will contribute to the quiz grade and each quiz will have a bonus question.

Quizzes will be accessible via the Sakai course site.

Individual Exercises (65% of Course Grade)

There will be five individual exercises that can be resubmitted based on the received feedback:

Exercise 1: HTML, CSS and JavaScript Basics – Style Web Page using CSS and Add Interactivity using JavaScript (7.5%)
Exercise 2: JavaScript Essentials – Control Appearance and Interactivity of Web Page using JavaScript (12.5%)
Exercise 3: Responsive Design using JavaScript Front-End Framework – Create Responsive Web Page using Bootstrap.js(15%)
Exercise 4: Design of Modular, Reusable User Interface Components using JavaScript Front-End Framework – Create Web Page Components using React.js (15%)
Exercise 5: Design Single Page Application using Back-End Framework to Exchange Data – Create Single Page Application using JSON, Angular.js, Node.js and Express.js (15%)

Term Project: MEAN Stack Development – Create Web Application using Angular.js, Node.js and Expess.js to Connect to MongoDB Database (20% of Course Grade)