Crash Course: React JS Angular and Vue JS Video Course

Curriculum For This Course

• 1. Getting Started 16 Videos 01:03:49
  • Introduction 01:19
  • The Goal of this Course 02:31
  • Understanding the Role of JavaScript 03:48
  • The World of JavaScript 01:37
  • Using Vanilla JavaScript & Understanding Its Limitations (1/3) 05:17
  • Using Vanilla JavaScript & Understanding Its Limitations (2/3) 02:12
  • Using Vanilla JavaScript & Understanding Its Limitations (3/3) 04:40
  • Analyzing the Vanilla JavaScript Solution 02:28
  • Improving the App with jQuery 07:01
  • More JavaScript Libraries: Adding Lodash 02:56
  • The Role of JavaScript Libraries 01:20
  • Libraries vs Frameworks 02:50
  • Using Vue.js (A JavaScript Framework) 15:02
  • Understand other Parts of the JavaScript World 03:55
  • JavaScript Versions and Languages - ES6 and TypeScript 03:56
  • Course Structure 02:59
• 2. Understanding JavaScript Frameworks in General 4 Videos 00:09:33
  • Module Introduction 00:34
  • JS Frameworks in Fullstack Applications 02:37
  • JS Frameworks in Single-Page-Applications 02:46
  • Prerequisites for the Different JS Frameworks 04:07
• 3. Vue.js - An Introduction 32 Videos 01:38:41
  • Module Introduction 01:33
  • Creating a Basic Vue.js Application 03:23
  • In a Nutshell: How Vue.js Works 02:06
  • Handling Events and Updating the DOM 03:57
  • Rendering Content Conditionally 03:15
  • Outputting Lists 03:27
  • Binding HTML Attributes & Properties to Data 03:38
  • Styling Elements Dynamically 03:24
  • Setting CSS Classes Dynamically 01:45
  • Using Multiple Vue Instances 01:39
  • Limitations of Multiple Vue Instances 01:55
  • Creating and Using Components 04:31
  • Passing Data into Components 01:42
  • Emitting Custom Events in Components 03:15
  • Template Restrictions 01:37
  • Two-Way-Binding to Input Fields 01:55
  • Time to Practice - Vue.js - Problem 02:20
  • Time to Practice - Vue.js - Solution 15:34
  • Creating Vue.js Projects with the Vue CLI 03:16
  • Why do we need Node.js and NPM? 01:32
  • Using the Vue CLI to Create Projects 03:11
  • Understanding the Project Folder 04:50
  • Understanding .vue Files 03:06
  • How the Application Gets Rendered 02:26
  • Creating Global Components with .vue Files 03:42
  • Creating Local Components 02:25
  • Scoping Styles to Components 01:19
  • Creating a Single Page Application (SPA) 01:08
  • Adding Routing to the Application 05:57
  • Linking with router-link 01:31
  • Routing and the Server-Side 02:15
  • Wrap Up 01:10
• 4. Understanding Workflows & Webpack 7 Videos 00:19:15
  • Module Introduction 00:58
  • The Big Picture 02:48
  • The Role of Node.js and NPM 03:38
  • Why do we need a Development Server? 02:30
  • How Webpack Works: Entry & Output 04:00
  • How Webpack Works: Modules, Rules & Plugins 04:24
  • Wrap Up 00:58
• 5. React.js - An Introduction 28 Videos 01:42:04
  • Module Introduction 01:14
  • Using React.js to Create a Basic App 04:22
  • Understanding How React.js Works and JSX 03:45
  • Outputting Dynamic Content 01:20
  • Handling Events and Updating the DOM 04:22
  • Creating a First Component 02:48
  • Passing Data into Components (Props) 01:51
  • Creating Components using ES6 Classes 02:36
  • Using State in React.js Components 05:02
  • What Happens Behind the Scenes 02:18
  • Rendering Conditional Content 03:18
  • Outputting Lists 05:18
  • Setting Styles Dynamically 03:12
  • Setting CSS Classes Dynamically 02:05
  • User Input & Two-Way-Binding 03:24
  • Using Multiple Components 02:45
  • Dumb Components 01:13
  • Passing Data from Child to Parent 04:11
  • Time to Practice - React.js - Problem 02:35
  • Time to Practice - React.js - Solution 24:00
  • Switching to a Local Setup & SPA 01:23
  • Using the "create-react-app" Package 02:34
  • Understanding the Created Project 02:48
  • Using the Local Setup 02:38
  • Adding React Router and Routes for the App 06:36
  • Adding Links 01:47
  • The React Router and a Server 01:20
  • Wrap Up 01:24
• 6. Angular (2 & 4) - An Introduction 30 Videos 01:35:41
  • Module Introduction 01:07
  • What It's Good at and What It's Not Good At 01:53
  • Understanding Angular Versioning 00:49
  • TypeScript 03:01
  • Creating an Angular Project with the CLI 03:47
  • Understanding the Project Structure 03:31
  • Understanding the Role of Components and the App Component 03:01
  • How the App Starts 05:16
  • Understanding the App Module 02:05
  • Outputting Data with String Interpolation 01:31
  • Handling Events 02:41
  • Rendering Content Conditionally 03:26
  • Outputting Lists 04:03
  • Binding Data to (HTML and other) Properties 02:57
  • Adding Dynamic Styles to Elements 04:23
  • Adding CSS Classes Dynamically 02:46
  • When to use the * Syntax 01:00
  • Using Multiple Components 06:09
  • Passing Data Into Components 02:04
  • Emitting Custom Events From Components 05:40
  • Using Two-Way-Binding 03:04
  • Time to Practice - Angular - Problem 01:45
  • Time to Practice - Angular - Solution 15:10
  • Using the CLI to Generate Components 01:59
  • Nesting Multiple Components 01:56
  • Scoping Styles to Components 01:17
  • Adding Routing & Routes 04:52
  • Adding Links 01:56
  • The Angular Router and the Server 01:09
  • Wrap Up 01:31
• 7. Comparing the Frameworks 10 Videos 01:04:23
  • Module Introduction 01:12
  • Possible Comparison Dimensions 03:43
  • Dimension 1: The Learning Curve 07:54
  • Dimension 2: Downscaling & Fullstack Applications 06:53
  • Dimension 3: Upscaling & SPAs 10:41
  • Dimension 4: Performance 09:00
  • Dimension 5: Ease of Deployment (The Way from Dev to Production) 08:13
  • Dimension 6: Popularity & Job Market 12:37
  • The Verdict 02:31
  • ...What About jQuery? 01:41
• 8. Course Roundup 1 Videos 00:01:43
  • Course Roundup 01:44