CUNY Tech Prep 2017-2018: Fall Semester Technical Curriculum

Subject to Change
(Ver. 2017.08.24)

Fall Semester Overview

During the Fall semester, CUNY Tech Preps technical curriculum focuses on full stack web application
development. We will explore all aspect of the software development lifecycle from the design and architecture
of applications, through the implementation, testing, and deployment of applications. At each stage, the course
will help you apply the tools, concepts, and processessuch as Git, testing, CI/CD, agile development, etc.
preferred by industry today.

Weekly Class Meetings

Class will meet weekly for 2.5 hours. The program schedule below outlines the topics and projects we
will work on weekly. It is imperative that you attend your section every week, and that you arrive on time. You are
expected to review course slides and assigned readings before the weekly class. You should bring your laptop to
class every week so that you can work on in-class projects and your team project. Each class will be staffed with
an Instructor and a Lab Instructor, and will roughly cover the following:
A topic lecture (~40-60 minutes)
In-class coding projects and/or student presentations (~90-110 minutes)

Projects
In-class Projects: During class meetings, we will work on individual programming projects, which we
may not be able to complete in class. It is your responsibility to finish these outside of class to complete
your learning.
Team Project: Your primary deliverable for this semester is a team project that you will propose,
implement, deploy, and demo, in a team of 3-4, at the end of the semester. You will be expected to
make weekly progress and to meet with and report your progress to your assigned project mentor. In the
schedule below you will also find that you will be expected to give 2 team presentations and you will
have 2 code reviews with your project mentor over the course of the semester. All team members are
expected to make contributions.

Homework
This course is primarily project based, culminating with a demo at the end of the semester. Homework
primarily consists of weekly readings and completing projects started in-class the week before. Other homework
assignments may be assigned on occasion and it is important that it is submitted on time.

Mock Technical Interviews

Mock technical interviews will happen outside of class time. You can request to schedule a mock
interview with any instructor or lab instructor, at their availability. During the semester, we will also invite software
engineers from industry to be guest interviewers for your practice. Their availability is first-come first-served so
you should check Slack frequently for those announcements.


The Tech Stack
Frontend Technologies
o HTML + CSS
o JavaScript + DOM (ES5 + ES6)
o React.js + React Router
o Bootstrap
Backend Technologies
o Node.js + Express.js
o Sequelize.js + Postgresql
o MongoDB
o Jest/Mocha/Chai
Development Environment/Tooling
o Bash Command Line
o Git/Github
o Google Cloud Platform

Full-Stack Topics: The framework we will use in this class is the Node.js+Express.js Framework. The topics
covered will be:
Client-side vs Server-side rendered views/templates
APIs / Microservices
MVC (Model-View-Controller) pattern
Routing
ORM (Object Relational Mapper) / Data Mapper pattern
Relational Databases, Basic SQL, and NoSQL Databases
Testing (Unit, Integration, TDD, BDD) / Continuous Integration
Security
Application Deployment


Summer Pre-Work Curriculum

Orientation
o Program Overview / Participant Expectations
o Development Environment Setup
Mac or Linux VM Setup
Git/Github Setup
NVM/Node.js Setup
o Command Line (Bash) Intro
o Package Management Systems (Apt-Get, Homebrew) Intro
Self-Learning Courses
o Learn HTML & CSS
o Learn Responsive Design
o Learn JavaScript (ES5)
o Learn Git
o Learn SQL
o ES6 Crash Course
Summer Assignments
o HackerRank Quiz: HTML/CSS/JavaScript
o JavaScript Problems Set
Run against Unit Tests (in Jest)
o ES6-Tutorial
o Use Git/Github to Fork projects, code, and create Pull Requests


Fall Program Schedule

(08/29 09/01) Week 1

Lecture:
Fall Semester Overview
Review: JavaScript ES 6, Eloquent JavaScript Problems
Designing a Web Application
o Types of Applications; Frontend vs Backend;
o Requirement Gathering, Mockups (UI/UX), User Stories, Data Modeling
Review: HTML/CSS + DOM
o Intro to Bootstrap Grid and Responsive Design

In-class Projects:
Make a responsive Cookie Store webpage
Create a homepage for yourself

Homework:
Form teams of 3
Prepare your Team Project Proposal

(09/05 09/08) Week 2

Lecture:
Review: ES6-Tutorial
React Intro
o Components, state, and props
o HTML to JSX Components
o create-react-app

In-class Projects:
Single-component React app: colorpicker
Facebook Tic-Tac-Toe Tutorial


(09/12 09/15) Week 3
Lecture:
Parts of a URL (IPs, TLDs, DNS, Ports)
Understanding HTTP Request Response
o Using CURL and Postman
React
o Multiple Components
o Form Fields
Using fetch(...) and Promises

In-class Projects:
Build Zip/City lookup React app
Build Timer and Countdown Clock

Homework:
Submit your team name, members, and proposal

(09/19 09/22) Week 4

Lecture:
Building a backend with Express.js
o Intro to the Express.js framework
o Routing
o Query and Form Parameters
o JSON vs HTML Responses
RESTful routing

In-class Projects:
Build the Zip/City lookup API service
Build the CS function API service
o Implement a service to compute: Fibonacci sequence, Palindrome checker, etc
o Working React frontend will be provided

Homework:
Send your teams project Github link


(09/26 09/29) Week 5
Lecture:
Relational Databases / Data Modeling
o Entity-Relationship modeling
o Data Normalization
o Codd Rules
ORMs / Sequelize.js
o CRUD methods
Structuring your project
o The Model-View-Controller (MVC) Pattern

In-class Project:
Data modeling exercises
Build the models for a microblog app

(10/03 10/06) Week 6

Lecture:
More Express.js
o Middleware: Morgan, Static files, Authentication
Authentication (Login/Logout/Signup)
o Sessions/Cookies
o Passport, bcrypt
o Testing
React Router

In-class Project:
Implement Authentication on frontend and backend

(10/10 10/13) Week 7

Lecture:
Software Engineering Best Practices
Code Reviews
More Git: Workflows and Etiquette
CI/CD

In-class:
Teams work on their projects


(10/17 10/20) Week 8
Lecture:
In-depth Sequelize.js
o Data validation
o Data Seeds
In-depth Testing
o Unit, Integration, End-to-End

In-class:
First Code Review (by project mentor)
Teams implement tests on their projects

(10/24 10/27) Week 9

In-class:
Team Presentations: Project intro and progress report (5 min)
Teams work on their projects

(10/31 11/03) Week 10

Lecture:
Security: OWASP Top 10

In-class
Teams work on their projects

(11/07 11/10) Week 11

Lecture:
Types of Databases: Document (MongoDB), Key-Value (Redis) stores

In-class:
Teams work on their projects

(11/14 11/17) Week 12

Lecture:
Deploying to Google Cloud Platform

In-class:
Second Code Review (by project mentor)
Teams work on their projects


(11/20 11/24) No class: Thanksgiving Break

(11/28 12/01) Week 13

In-class:
Team Presentations: Project progress and WIP demo (5 min)
Teams work on their projects

(12/05 12/08) Week 14

In-class:
Finish up projects and prepare for demos