Learn your way! Get started

React, Part 1 of 7: React Basics

with expert John Smilga


Watch trailer


Course at a glance

Included in these subscriptions:

  • Dev & IT Pro Video
  • Dev & IT Pro Power Pack

Release date 6/6/2019
Level Beginner
Runtime 3h 1m
Closed captioning N/A
Transcript N/A
eBooks / courseware N/A
Hands-on labs N/A
Sample code Included
Exams Included


Enterprise Solutions

Need reporting, custom learning tracks, or SCORM? Learn More



Course description

React is a Javascript library for building user interfaces. This course will cover how to use React and why you would want to use React in your applications. It will also explain how to setup your environment, basic React syntax and making your first component.

Prerequisites

• Basic HTML,CSS and Javascript knowledge • ES6 is a plus

Meet the expert

John Smilga is a Front-End Web Developer in the Los Angeles Area. John has a Bachelor’s Degree in Software Development. He spends most of his time working with Javascript, CSS3, and HTML5, and he is passionate about everything related to web development. He learns from the community and loves to share with the community what he has learned. He strives to explain very complex topics in a simple manner that everyone can understand.

Course outline



Basic React

Intro and Setup (22:15)
  • Introduction (00:08)
  • Intro (05:13)
  • Course Outline (01:28)
  • Course Requirements (01:32)
  • Tools (03:47)
  • Setup (02:01)
  • Snippets (01:46)
  • indent Rainbow (01:55)
  • Preview on Web Server (04:14)
  • Summary (00:08)
Commandline and install (31:25)
  • Introduction (00:08)
  • Command Line and install (06:06)
  • NPM Commands (05:48)
  • Create React App (01:27)
  • Create Readme (08:28)
  • Create React structure (04:20)
  • NPM Build (04:57)
  • Summary (00:08)
First Component (18:38)
  • Introduction (00:08)
  • First Component (10:39)
  • Detailed Look (07:43)
  • Summary (00:08)
JSX Rules (15:40)
  • Introduction (00:08)
  • JSX Rules (10:13)
  • Fix Greeting (05:11)
  • Summary (00:08)
Book Mini Project (10:45)
  • Introduction (00:08)
  • Book Mini Project (04:59)
  • Nest Components (05:29)
  • Summary (00:08)
CSS in React (23:38)
  • Introduction (00:08)
  • CSS in React (05:59)
  • Book Class (05:59)
  • Javascript (11:23)
  • Summary (00:08)
Props in React (33:17)
  • Introduction (00:08)
  • Props in React (06:10)
  • Props Example (08:21)
  • Destructuring (06:16)
  • Destructuring Props (06:48)
  • Children Props (05:25)
  • Summary (00:08)
Person List Project (25:37)
  • Introduction (00:08)
  • Person List Project (00:56)
  • Projrct Start (06:28)
  • Add Thumbnail (05:48)
  • Template Literal (04:05)
  • Styling (08:02)
  • Summary (00:08)