Free Code Camp Walkthrough 38 | Front End Development Libraries - React
In this tutorial I'll show you how to get through the React - Front End Development Libraries Certification course on Free Code Camp.
Do the exercises yourself on freecodecamp.org and refer to the walkthrough when you get stuck - btw, as the name suggests: freecodecamp is free to use.
Free Code Camp | https://www.freecodecamp.org/learn/fr...
-------------------------------------------------------------------
Timestamps/Tasks:
0:00 Intro
0:27 Create a Simple JSX Element
1:05 Create a Complex JSX Element
2:57 Add Comments in JSX
3:39 Render HTML Elements to the DOM
5:54 Define an HTML Class in JSX
6:46 Learn About Self-Closing JSX Tags
7:26 Create a Stateless Functional Component
8:15 Create a React Component
9:29 Create a Component with Composition
10:43 Use React to Render Nested Components
11:48 Compose React Components
13:24 Render a Class Component to the DOM
15:16 Write a React Component from Scratch
17:51 Pass Props to a Stateless Functional Component
19:48 Pass an Array as Props
22:44 Use Default Props
23:54 Override Default Props
24:53 Use PropTypes to Define the Props You Expect
26:20 Access Props Using this.props
27:59 Review Using Props with Stateless Functional Components
30:15 Create a Stateful Component
31:51 Render State in the User Interface
32:32 Render State in the User Interface Another Way
33:40 Set State with this.setState
34:48 Bind 'this' to a Class Method
36:46 Use State to Toggle an Element
38:46 Write a Simple Counter
41:29 Create a Controlled Input
44:59 Create a Controlled Form
48:11 Pass State as Props to Child Components
49:37 Pass a Callback as Props
52:03 Use the Lifecycle Method componentWillMount
52:37 Use the Lifecycle Method componentDidMount
53:50 Add Event Listeners
55:47 Optimize Re-Renders with shouldComponentUpdate
57:39 Introducing Inline Styles
58:59 Add Inline Styles in React
1:00:58 Use Advanced JavaScript in React Render Method
1:03:13 Render with an If-Else Condition
1:05:58 Use && for a More Concise Conditional
1:07:00 Use a Ternary Expression for Conditional Rendering
1:10:15 Render Conditionally from Props
1:14:13 Change Inline CSS Conditionally Based on Component State
1:15:21 Use Array.map() to Dynamically Render Elements
1:18:05 Give Sibling Elements a Unique Key Attribute
1:19:32 Use Array.filter() to Dynamically Filter an Array
1:22:02 Render React on the Server with renderToString
1:22:53 Outro
-------------------------------------------------------------------
All my Free Code Camp Walkthroughs | • Free Code Camp Walkthroughs
-------------------------------------------------------------------
Music by Silent Partner
-------------------------------------------------------------------
Odyssey | https://odysee.com/$/invite/@michaelb...
Watch video Free Code Camp Walkthrough 38 | Front End Development Libraries - React online without registration, duration hours minute second in high quality. This video was added by user Michael Brig 04 June 2023, don't forget to share it with your friends and acquaintances, it has been viewed on our site 772 once and liked it 11 people.