Requirements for Web Programming
On-campus and Online
- Prerequisites
- Textbooks
- LinkedIn Learning
- 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
No required textbook and all required readings available via Readings on Lectures page.
LinkedIn Learning (previously called LyndaCampus)
- SC&I is subscribing to a service called LinkedIn Learning that is a school-wide version of linkedin.com/learning, an online training library with many video based training movies. LinkedIn Learning is available for free for students registered in SC&I courses and can be used to learn software, programming skills, video techniques, etc.
Titles include: all of MS Office (Word, Excel, PowerPoint, Access, etc.), all of Adobe (DreamWeaver, Photoshop, Illustrator, InDesign, Animate, etc.), Fundamentals of Video, iMovie, Social Media Marketing, Twitter, SPSS, Google Docs, HTML5, CSS, MySQL, PHP, Python, C/C++/C#, WordPress, etc. Students can watch the videos, follow along with exercise files, and even print a certificate of completion upon completion of a course.
- Login to LinkedIn Learning (when you first log into LinkedIn Learning, you are given the opportunity to personalize your profile).
- Remember: you must be logged into LinkedIn Learning to be able to access the linkedin.com/learning videos included in the Lectures page of this course.
- For more information and access instructions, please see https://it.rutgers.edu/linkedin-learning/. For any difficulties accessing the content of linkedin.com/learning please contact SC&I IT Services at help@comminfo.rutgers.edu.
- Prerequisites
- HTML Essential Training
- HTML5: Structure, Syntax, and Semantics
- CSS Essential Training
- JavaScript Essential Training
- Tools: Code Editor and Version Control
- Succeeding in Web Development: Full Stack and Front End
- Workflow Tools for Web Development
- Learning Atom
- Git Essential Training: The Basics
- JavaScript
- JavaScript Essential Training
- Learning ECMAScript 6
- JavaScript for Web Designers
- Learning JavaScript Debugging
- JavaScript and JSON
- Front-End Frameworks
- Bootstrap 4 Essential Training
- Learning React.js (2018)
- Learning React.js (2019)
- React.js Essential Training
- Back-End Frameworks
- Full Stack and Databases
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
- 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
- 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
- React.js: https://facebook.github.io/react/
- Install | Get Started | Tutorial
- Back-End Frameworks: Google Trends
- Node.js:
- Download | Documentation | Tutorials
- Express.js:
- Download | Documentation | Tutorials
- 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)
Titles include: all of MS Office (Word, Excel, PowerPoint, Access, etc.), all of Adobe (DreamWeaver, Photoshop, Illustrator, InDesign, Animate, etc.), Fundamentals of Video, iMovie, Social Media Marketing, Twitter, SPSS, Google Docs, HTML5, CSS, MySQL, PHP, Python, C/C++/C#, WordPress, etc. Students can watch the videos, follow along with exercise files, and even print a certificate of completion upon completion of a course.
- Prerequisites
- HTML Essential Training
- HTML5: Structure, Syntax, and Semantics
- CSS Essential Training
- JavaScript Essential Training
- Tools: Code Editor and Version Control
- Succeeding in Web Development: Full Stack and Front End
- Workflow Tools for Web Development
- Learning Atom
- Git Essential Training: The Basics
- JavaScript
- JavaScript Essential Training
- Learning ECMAScript 6
- JavaScript for Web Designers
- Learning JavaScript Debugging
- JavaScript and JSON
- Front-End Frameworks
- Bootstrap 4 Essential Training
- Learning React.js (2018)
- Learning React.js (2019)
- React.js Essential Training
- Back-End Frameworks
- Full Stack and Databases
95 - 100 | A |
90 - 95 | B+ |
85 - 90 | B |
80 - 85 | C+ |
75 - 80 | C |
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, Node.js and Express.js (15%)