Skip to content

Latest commit

 

History

History
170 lines (109 loc) · 2.49 KB

PrerequisiteConceptsForLabs.md

File metadata and controls

170 lines (109 loc) · 2.49 KB

Prerequisite Concepts for Labs

Fundamentals (Days 1-3)

Part 1

Concepts

  • Package Manager (npm/Yarn)
  • Compiler Setup
  • ES6/ES2015
  • TypeScript (if applicable)

Part 2

Concepts

  • React Overview
  • Elements
  • JSX
  • Virtual DOM

Part 3

Concepts

  • Project Setup (Create React App)

Labs

  • Lab 1: Creating a New Project
  • Lab 2: Running Your Project
  • Lab 3: Styles Using CSS

Part 4

Concepts

  • Components

Labs

  • Lab 4: Your First Component
  • Lab 5: Creating Data Structures

Part 5

Concepts

  • Props
  • PropTypes (if applicable)
  • React with TypeScript (if applicable)
  • Lists

Labs

  • Lab 6: Passing Data into a Component
  • Lab 7: Displaying List Data
  • Lab 8: More Reusable Components

Part 6

Concepts

  • Events
  • State
  • Conditional Rendering
  • Component Architecture

Labs

  • Lab 9: Responding to an Event
  • Lab 10: Create a Form
  • Lab 11: Communicating from Child to Parent Component
  • Lab 12: Hiding and Showing Components
  • Lab 13: More Component Communication
  • Lab 14: Multiple Levels of Component Communication

Part 7

Concepts

  • Forms

Labs

  • Lab 15: Form Values to State
  • Lab 16: Form Validation

Part 8

Concepts

  • Backend API Setup
  • Promises & Async/Await
  • HTTP
  • Lifecycle

Labs

  • Lab 17: Setup Backend REST API
  • Lab 18: HTTP GET
  • Lab 19: HTTP PUT

Part 9

Concepts

  • Routing (using React Router)

Labs

  • Lab 20: Router Basics
  • Lab 21: Route Parameters

Part 10

Concepts

  • Build & Deploy

Labs

  • Lab 22: Build & Deploy

Advanced (Days 4 & 5)

Part 11

Concepts

  • Redux (Store, State, Reducers, Actions, Action Creators)
  • Using Redux with React (React Redux Library)
  • Asynchronous Actions (Redux Thunk)
  • Putting It All Together (React & Redux & Thunk)
  • Redux with TypeScript (if applicable)
  • React & Redux with TypeScript (if applicable)

Labs

  • Lab 23: Redux Install
  • Lab 24: Redux Actions & Reducer
  • Lab 25: Redux with React

Part 12

Concepts

  • Testing

Labs

  • Unit Testing Lab 1: Shallow Rendering with Enzyme
  • Unit Testing Lab 2: Snapshot Tests
  • Unit Testing Lab 3: Testing Props
  • Unit Testing Lab 4: Nested Components
  • Unit Testing Lab 5: Container Components
  • Unit Testing Lab 6: Testing Forms
  • Unit Testing Lab 7: Action Tests
  • Unit Testing Lab 8: Reducer Tests
  • Unit Testing Lab 9: API Tests

Optional Topics

  • Best Practices (Code Organization & Conventions)
  • Appendix A: How to Skip Labs
  • Styling
  • Hooks
  • UI Components