Tech Talent Pipeline Residency: Hunter College January 2020 Bootcamp

Class Days and Class Times:

Monday - Friday, 10:00AM - 4:00PM

Dates: January 2nd, 2020 (Monday) - January 24th, 2020 (Friday)

We will also have two Saturday classes on January 11th, 2020 and January 18th, 2020**

Room Number: Hunter North 531

Lead Instructor: Allan James S. Lapid

Instructor: Billy Tan, Tony Fung

Emails: ajLapid718@gmail.com, btan7645@gmail.com, tfung5@gmail.com

Slack Workspace: https://hunterttpspring2020.slack.com

---

Daily Schedule (Subject To Change!)

10:00AM - 12:00PM:: Lecture, Review, Demo, Start Workshop For The Day

12:00PM - 1:00PM: Lunch

1:00PM - 4:00PM: Continuation of Lecture, Complete The Workshops/Homework For The Day

---

Curriculum Index (Tentative, Subject To Change)

• Pre-Bootcamp Material

• Class Session 1: Pilot Assessment and Collaborative Workflow I | (01/02/2020)

• Class Session 2: Collaborative Workflow I and Introduction to JS | (01/03/2020)

• Class Session 3: DOM Manipulation | (01/06/2020)

• Class Session 4: Introduction to React | (01/07/2020)

• Class Session 5: Introduction to External API Requests and ReactJS | (01/08/2020)

• Class Session 6: Introduction to External API Requests and ReactJS Continued | (01/09/2020)

• Class Session 7: React Router and Client-Side Routing in a SPA | (01/10/2020)

• Class Session 8: State Management with Redux and React-Redux | (01/11/2020)

• Class Session 9: Introduction to NodeJS | (01/13/2020)

• Class Session 10: CRUD App I | (01/14/2020)

• Class Session 11: CRUD App II | (01/15/2020)

• Class Session 12: CRUD App III | (01/16/2020)

• Class Session 13: Project Building I | (01/17/2020)

• Class Session 14: Project Building II | (01/18/2020)

• Class Session 15: Project Building III | (01/20/2020)

• Class Session 16: Project Building IV | (01/21/2020)

• Class Session 17: Project Building V | (01/22/2020)

• Class Session 18: Project Building VI | (01/23/2020)

• Class Session 19: Exit Assessment and Demo Day | (01/24/2020)

---

Curriculum

Pre-Bootcamp Material

• CSS Diner Exercise
• Flexbox Froggy Exercise
• Flexbox Zombies Exercise

Class Session 1: Onboarding, Git/Github/Collaborative Software Development (Pair Programming) (01/02/2020)

• Git Codecademy Tutorial

• Writing good commit messages

• Advanced Git Workflow

• Introduction Slides

• Git and Github Slides

• Collaboration Workshop Assignment

Class Session 2: Javascript Basics Overview (01/03/2019)

Suggested Pre-Reading (you could also consider the first two chapers as well, but the links below are the more complex topics that we will be covering)

• Eloquent Javascript Chapter 3: Functions

• Eloquent Javascript Chapter 4: Objects and Arrays

• Eloquent Javascript Chapter 5: Higher Order Function

• JavaScript! slide deck

• More JavaScript! slide deck

• Assignment #2

Class Session 3: DOM Manipulation (01/06/2020)

Suggested Pre-Reading

• Eloquent Javascript Chapter 13: Javascript and the Browser

• Eloquent Javascript Chapter 14: The Document Object Model

• Eloquent Javascript Chapter 15: Handling Events

• A Series of DOM Slides

Material For The Day

• DOM lecture slides

• An Introduction to the DOM (Document Object Model) in JavaScript

• Traversing the DOM with JavaScript

• An Introduction to DOM Events with JavaScript

• Assignment #3: DOM Challenges I

• Assignment #4: DOM Challenges II

• Assignment #5: DOM Challenges III

Class Session 4: Introduction to React (01/07/2020)

Suggested Pre-Reading

• React: Hello World

• React: Introducing JSX

• React: Rendering Elements

• React: Components and Props

• React: State and Lifecycle

• React: Handling Events

• React: Conditional Rendering

• React: List and Keys

• React: Forms

• React: Lifting State Up

• React: Composition vs Inheritance

• Thinking in React

• React: An Overview via Videos Reading for the weekend:

• ReactJS: Quick Guide (An Optional Read) (Skip the section on Flux Architecture --- we'll be discussing that in Week 3)

• ReactJS Introduction Slides

• Group Project #1 - Fullstack CRUD Application

Class Session 5: Introduction to External API Requests and ReactJS Continued (01/07/2020)

• React Lifecyle Methods Suggested Reading

• Promises Suggested Reading

• Fetch API Suggested Reading

• Lecture slides

  • AJAX, fetch, and Axios

  • Promises

  • React Lifecycle

  • React Events / Forms

• Handling Multiple Inputs With One HandleChange Function

• An Approach for a Cancel Button

• Sabe React Tutorial

• Async/Await

• Conditional Rendering: I

• Conditional Rendering: II (Be aware of all options, but disregard Option 2 for the time being)

• Conditional Rendering: III

• Expected Behavior of Form/Folder Exercises

Class Session 6: Zip/City API Assignment && GIPHY API Assignment I | (01/08/2020)

• Zip/City API Assignment (Assignment "#6")

• GIPHY API Assignment (Assignment "#7")

• Chrome Extension for JSON Viewing

• Lists and Keys

• Async/Await in a HOF

Class Session 7: Zip/City API Assignment && GIPHY API Assignment II | (01/09/2020)

Class Session 8: React Router and Client-Side Routing In a Single-Page-Application | (01/10/2020)

• React Router Resource 1
• React Router Resource 2
• React Router Resource #3
• React Router Resource #4
• React Router Slide Deck
• Bank of React Assignment

Class Session 9: Redux | (01/11/2020)

• Redux Tutorial by Dan Abramov

• Follow Up Redux Tutorial by Dan Abramov

• Redux / React-Redux Slides

• Redux / React-Redux Slides #2

• Redux Middleware Slides

• Redux Thunk Middleware Slides

• What Thunks Are, What They Solve, and Other Options

• Free "Learn Redux" Course by Wes Bos

• Redux-Thunk Explanation

• React-Redux Gist

• Redeux

  • A repository with different branches containing code that briefly goes over Redux-Thunks, Redux-Saga, Redux-Loop, Redux-Promise, and Redux-Observable
  • Also a valuable resource to review barrel files, code splitting and organization, combineReducers(), and Redux middleware such as redux-logger

• Counter and Students Codealong

• "Counter" Example

Class Session 10: Introduction to NodeJS | (01/13/2020)

• Intro to Node slides

• NPM Slides

• JavaScript Conference 2014: The Event Loop <= The entire video is recommended to understand Node's async implementation, but the core explanation begins around 11 minutes into the video

• NodeJS: Module Exports <= Main Takeaway: A deeper understanding of Node's module system

• JavaScript Conference 2019: 10 Things I Regret About NodeJS by the creator of NodeJS

• Express Codecademy Tutorial

Class Session 11: Introduction to ExpressJS | (01/14/2020)

• Intro to Express slides

• REST API

Class Session 12: PostgreSQL/Sequelize I (01/15/2020)

• Introduction to PostgresQL
• node-postgres client (pg)
• Postgres Install
• SQLBolt Tutorial
• SQLZoo Tutorial
• Sequelize Querying and Associations: Part I
• Sequelize Querying and Associations: Part II
• Sequelize Slides
• Tom Kelly Sequelize Docs

• Introduction To Databases
• Introduction To SQL
• Node-Postgres
• Introduction To Schemas
• Introduction To ORMs
• Rounding Out Express and Sequelize
• GitHub Repository Of A Backend For A Sports App
  • Involves Node, Express, PostgreSQL, and Sequelize
• Under-The-Hood SQL Statements for Sequelize Queries and Methods
• Difference Between res.send() and res.json()