Introduction
  • Course Introduction
  • Technologies of the Course
  • Application Tour and Overview
  • Important Reference: Course Repository and a Side Note on Course Challenges
  • Important Reference: Software Requirements and Installations | Article
Feature 1. Create Dragons: Node.js
  • Preview | Feature 1. Create Dragons: Node.js
  • The Role of Node.js in Dragonstack
  • Set Up the Backend
  • Optional: Object-Oriented Programming
  • The Dragon Class
  • Improve the Dragon Class | Part 1
  • Improve the Dragon Class | Part 2
  • Nodemon for Development
  • Optional: Node.js Under the Hood - the V8 Engine
  • Optional: Node.js Under the Hood - the Event Loop
  • The Source of Truth for Dragon Traits
  • Traits in the Dragon Class
  • Generation Configuration
  • Generation Class | Part 1
  • Generation Class | Part 2
  • Optional Challenge: Generation Engine
  • Generation Engine
  • Dragonstack Architecture Check 1
Feature 1. Create Dragons: Express.js
  • Preview | Feature 1. Create Dragons: Express.js
  • On Express.js
  • Set up the Server and Get Dragon
  • Codebase Organization | Part 1
  • Codebase Organization | Part 2
  • Get Generation
  • Dragonstack Architecture Check 2
Feature 1. Create Dragons: PostgreSQL and the Database
  • Preview | Feature 1. Create Dragons: PostgreSQL and the Database
  • PostgreSQL and Relational Databases Overview
  • Setup and Install PostgreSQL
  • Create the Dragonstack DB and the Node User
  • Generation SQL
  • Dragon SQL
  • Configure Script
  • Configure the Database Pool
  • Node-Postgres Pool Verification
  • Generation Table and Storing Generations
  • Get Generation with IDs
  • Optional: JavaScript Promises Overview
  • Optional Challenge: Dragons with Generation IDs and Store Dragons
  • Dragons with Generation IDs
  • Store Dragons
  • Error Handling in Express.js
  • The Approach to Storing Dragon Traits
  • Trait Table
  • Trait Table and Get Trait ID
  • Dragon Trait Table
  • Optional Challenge: Store Dragon Trait Associations
  • Store Dragon Traits
  • Verify Dragon Trait Storage
  • Optional Challenge: Get Dragon with Traits Function
  • Get Dragon With Traits | Part 1
  • Get Dragon With Traits | Part 2
  • Dragonstack Architecture Check 3
Feature 1. Create Dragons: React.js and Redux
  • Preview | Feature 1. Create Dragons: React.js and Redux
  • Optional: JS in Browsers, the DOM, and React and Virtual DOM Overview
  • Set Up the React Frontend | Part 1
  • Set Up the React Frontend | Part 2
  • [Optional] Upgrade to Babel Version 7
  • Generation Component
  • Single Script to Start the Backend and Frontend
  • React State and Generation Fetch | Part 1
  • Backend Interlude: Cross-Origin Resource Sharing
  • Optional: Same Origin Policy
  • React State and Generation Fetch | Part 2
  • Fetch New Generations on a Timer
  • Optional Challenge: New Dragon
  • New Dragon in React
  • Dragon Avatar Component and React Props
  • New Dragon Button and React Bootstrap
  • Optional Challenge: Quick Styling
  • Quick Styling
  • Optional: Dragon Avatar Image | Note
  • Optional: Dragon Avatar Image | Part 1
  • Optional: Dragon Avatar Image | Part 2
  • Redux Overview
  • Redux in Dragonstack and the Generation Reducer
  • Generation Action
  • Generation Action Creator
  • Redux Organization and Tools
  • Connect Generation Component and MapStateToProps
  • Generation Component and MapDispatchToProps
  • Redux Thunk
  • Updated Fetch Generation Action
  • Updated Fetch Generation Reducer
  • Fetch States
  • Optional Challenge: Redux New Dragon
  • New Dragon Redux Flow
  • Connect the Dragon Componnet
  • Dragonstack Architecture Check 4
Feature 2. Authentication and Accounts
  • Preview | Feature 2. Authentication and Accounts