-
1. What is React.
05:42
-
2. Goals.
01:60
-
3. Structure.
00:57
-
4. Course Requirements.
01:60
-
5. Dev Environment Setup.
04:42
-
6. Text Editor Setup.
01:55
-
7. Video Blur Fix.
01:37
-
8. Course Review.
00:33
-
1. Import and Export (ES6 Modules).
26:33
-
10. Passing Methods to Children Components to Work with State.
14:43
-
11. Conditionals in JSX.
10:47
-
2. Class Based Components in React.
00:00
-
3. Functional VS Class Based Components.
03:28
-
4. State.
30:40
-
5. Alternative State Syntax.
06:01
-
6. Book Mini Project.
10:15
-
7. Events.
09:33
-
8. this.setState.
10:31
-
9. Passing Methods and Prop Drilling.
12:31
-
1. Command Line Basics.
06:40
-
2. NPM Basics.
00:00
-
3. What is Create-react-app, Babel, Webpack.
01:58
-
4. Install Create-react-app.m
00:00
-
5. Folder Structure.
09:05
-
6. Remove Boilerplate.
01:36
-
1. First Component.
10:14
-
10. Props.
00:00
-
11. Props – Destructuring.
04:03
-
12. Props – Children.
06:29
-
13. Simple List.
08:59
-
14. Proper List.
07:38
-
15. Key Prop and Spread Operator.
06:03
-
16. Event Basics.
12:20
-
17. Import and Export Statements.
12:13
-
18. Free Hosting.
04:57
-
2. Text Editor Setup.
08:16
-
3. First Component in Detail.
06:49
-
4. JSX Rules.
00:00
-
5. Nested Components and Tools.
05:55
-
6. Mini Book Project.
08:99
-
7. CSS.
11:42
-
8. JSX – CSS.
06:50
-
9. JSX – Javascript.
07:60
-
1. Intro.
02:20
-
10. useState – Multiple State Values.
03:16
-
11. Simple Counter.
05:52
-
12. Functional Update Form.
12:44
-
14. useEffect – Basics.
10:09
-
15. useEffect – Conditional.
03:53
-
16. useEffect – Dependency List.
05:32
-
17. useEffect – Cleanup Function.
12:10
-
18. useEffect – Fetch Data.
12:04
-
19. Multiple Returns – Basics.
05:39
-
20. Multiple Returns – Fetching Example.
14:57
-
21. Short-Circuit Evaluation.
10:42
-
22. Ternary Operator.
08:39
-
23. ShowHide Component.
08:45
-
25. Form Basics.
08:38
-
26. Controlled Inputs.
09:16
-
27. Add Item to the List.
00:00
-
28. Multiple Inputs.
00:00
-
3. Install Starter.
02:07
-
30. useRef.
09:51
-
32. useReducer – useState Setup.
13:32
-
33. useReducer – Refactor.
07:23
-
34. useReducer – Add Item.
15:59
-
35. useReducer – Remove Item.
07:42
-
36. Prop Drilling.
00:00
-
37. Context API useContext.
11:46
-
39. Custom Hooks – useFetch.
00:00
-
39. Custom Hooks – useFetch.
00:00
-
4. Starter Overview.
09:40
-
40. PropTypes – Setup.
00:00
-
41. PropTypes – Images.
00:00
-
42. PropTypes – Default Values.
00:00
-
43. React Router Intro.
05:11
-
44. React Router – Basic Setup.
09:58
-
45. React Router – Error and Switch Component.
03:01
-
46. React Router – Links.
04:31
-
47. React Router – Url Params and Placeholder.
14:29
-
48. React Optimization Warning!!!!.
03:30
-
49. React.memo.
08:29
-
5. useState – Simple Use Case.
09:43
-
50. useCallback.
08:10
-
=51. useMemo.
06:15
-
52. useCallback – Fetch Example.
03:28
-
6. useState – Basics.
12:02
-
7. General Rules of Hooks.
02:51
-
8. useState – Array Example.
13:47
-
9. useState – Object Example
00:00
-
10. Tours – Remove Tour.
06:56
-
11. Reviews – Intro.m
00:23
-
12. Reviews – Info and React-Icons.
06:09
-
13. Reviews – Basic Setup.
00:00
-
14. Reviews – Prev and Next.
06:35
-
15. Reviews – Random.
00:00
-
16. Accordion – Intro.
00:14
-
17. Accordion – Complete.
09:51
-
18. Menu – Intro.
00:00
-
19. Menu – Display Items.
07:52
-
2. Starter Project – Install and Overview.
03:43
-
20. Menu – Buttons (manual approach).
04:50
-
21. Menu – all Button.
02:35
-
22. Menu – Categories Buttons (dynamic approach).
08:31
-
23. Tabs – Intro.
00:46
-
24. Tabs – Fetch Jobs.
07:17
-
25. Tabs – Display First Job.
06:35
-
26. Tabs – Display Buttons.
06:57
-
27. Slider – Intro.
00:27
-
28. Slider – Setup.
10:52
-
29. Slider – CSS Overview.
07:45
-
3. Birthday Reminder – Intro.
00:36
-
30. Slider – Setup Classes.
07:28
-
31. Slider – Prev and Next Buttons.
03:20
-
32. Slider – Autoplay.
07:20
-
33. Slider – Alternative.
06:35
-
34. Lorem Ipsum – Intro.
01:3131
-
35. Lorem Ipsum – Structure.
08:07
-
36. Lorem Ipsum – Complete.
08:16
-
37. Color Generator – Intro.
01:44
-
38. Color Generator – Structure.
08:38
-
39. Color Generator – Color Values and Error.
06:54
-
4. Birthday Reminder – Setup.
05:3737
-
40. Color Generator – Single Color
16:29
-
41. Color Generator – Copy To Clipboard.
09:05
-
42. Grocery Bud – Intro.
01:31
-
43. Grocery Bud – Structure.
10:36
-
44. Grocery Bud – Add Items.
09:34
-
45. Grocery Bud – Alert.
09:44
-
46. Grocery Bud – Clear Items.
02:12
-
47. Grocery Bud – Remove Item.
04:40
-
48. Grocery Bud – Edit Item.
07:13
-
49. Grocery Bud – Local Storage.
04:15
-
5. Birthday Reminder – Complete.
06:10
-
50. Navbar – Intro
00:40
-
51. Navbar – Basic Structure.
08:52
-
52. Navbar – Data.
09:15
-
53. Navbar – Simple Toggle.
02:56
-
54. Navbar – Class Toggle.
04:10
-
55. Navbar – useRef.
09:01
-
56. SidebarModal – Intro.
00:50
-
57. SidebarModal – Structure.
09:02
-
58. SidebarModal – Context.
10:24
-
59. SidebarModal – Complete.
08:07
-
6. Tours – Intro.
01:01
-
60. Stripe – Intro.
02:19
-
61. Stripe – Context Boilerplate.
09:25
-
62. Stripe – Navbar.
07:00
-
63. Stripe – Hero.
02:46
-
64. Stripe – Sidebar.
00:00
-
65. Stripe – Submenu.
04:28
-
66. Stripe – Location.
09:46
-
67. Stripe – Links.
09:31
-
68. Stripe – Hide Submenu.
04:21
-
69. Cart – Intro.
00:49
-
7. Tours – Fetch Data.
11:23
-
70. Cart – Setup Overview.
07:40
-
71. Cart – useReducer Setup.
06:51
-
72. Cart – Clear Cart
04:49
-
73. Cart – Remove Single Item.
04:29
-
74. Cart – Increase.
05:04
-
75. Cart – Decrease.
04:00
-
76. Cart – Get Totals.
11:42
-
77. Cart – Fetch Data.
00:00
-
78. Cart – Toggle Amount.
00:00
-
79. Cocktails – Intro.
00:00
-
8. Tours – Display Tours.
00:00
-
80. Cocktails – Additional Info
09:37
-
81. Cocktails – Setup Overview.
00:00
-
82. Cocktails – React Router Setup
00:00
-
83. Cocktails – Navbar.
00:00
-
84. Cocktails – About and Error.
00:00
-
85. Cocktails – Context API Setup.
00:00
-
86. Cocktails – API Overview.
00:00
-
87. Cocktails – Fetch Drinks.
00:00
-
88. Cocktails – Display List.
10:21
-
89. Cocktails – Search Form.
00:00
-
9. Tours – Toggle Info.
00:00
-
90. Cocktails – Single Cocktail Page.
00:00
-
91. Hosting (Netlify) – Drag and Drop.
00:00
-
92. Hosting (Netlify) – Continuous Deployment.
00:00
-
10. Pagination – Setup.
00:00
-
11. Pagination – FetchDisplay List.
00:00
-
12. Pagination – Paginate Logic.
00:00
-
13. Pagination – Display Single Page.
00:00
-
14. Pagination – Display Buttons.
00:00
-
15. Pagination – Prev and Next Buttons.
00:00
-
16. Stock Photos – Intro.
01:30
-
17. Stock Photos – Setup.
09:10
-
18. Stock Photos – Initial Fetch.
04:02
-
19. Stock Photos – ENV VAR.
10:01
-
2. Markdown – Intro.
01:45
-
20. Stock Photos – Display Photos.
13:30
-
21. Stock Photos – Scroll Event.
11:27
-
22. Stock Photos – Infinite Scroll.
07:34
-
23. Stock Photos – Search Query.
09:27
-
24. Stock Photos – Complete.
04:56
-
25. Stock Photos – useEffect Warning Alternative.
01:45
-
26. Dark Mode – Intro.
01:02
-
27. Dark Mode – Setup.
09:26
-
28. Dark Mode – moment.js.
05:41
-
29. Dark Mode – Toggle Theme.
12:09
-
3. Markdown – Setup.
05:31
-
30. Dark Mode – Local Storage.
00:00
-
31. Movie DB – Intro.
46:00
-
32. Movie DB – Setup.
01:52
-
33. Movie DB – API KEY.
11:08
-
34. Movie DB – React Router.
05:17
-
35. Movie DB – Initial Fetch.
15:27
-
36. Movie DB – Movies Component.
08:36
-
37. Movie DB – Search Form.
08:21
-
38. Movie DB – Single Movie.
12:41
-
39. Movie DB – Refactor to useFetch.
13:47
-
4. Markdown – Complete.
07:52
-
40. Hacker News – Intro.
01:56
-
41. Hacker News – Setup
02:44
-
42. Hacker News – API Overview.
05:42
-
43. Hacker News – Basic Structure.
15:01
-
44. Hacker News – Fetch Stories.
09:31
-
45. Hacker News – Display Stories.
07:56
-
46. Hacker News – Remove Story.
04:59
-
47. Hacker News – Search Form.
09:42
-
48. Hacker News – Prev and Next Buttons.
14:17
-
49. Quiz – Intro.
00:00
-
5. Random Person – Intro.
00:00
-
50. Quiz – Setup.
02:08
-
51. Quiz – API.
03:38
-
52. Quiz – Context Setup.
09:50
-
53. Quiz – Fetch Questions.
11:37
-
54. Quiz – Display Question.
13:19
-
55. Quiz – Next Question.
04:37
-
56. Quiz – checkAnswer.
05:23
-
57. Quiz – Show Modal.
07:48
-
58. Quiz – Setup Form Structure.
13:3232
-
59. Quiz – HandleChange.
04:56
-
6. Random User – Setup.
13:52
-
60. Quiz – HandleSubmit.
08:30
-
61. Quiz – Randomize Correct Answer.
06:46
-
7. Random User – Fetch User
13:31
-
8. Random User – Buttons.
06:14
-
9. Pagination- Intro.
02:33
-
1. Intro.
04:11
-
10. Mock Data
00:00
-
11. Info Component.
00:00
-
12. Card Component.
13:13
-
13. Followers Component.
05:25
-
14. Repos Setup.
02:49
-
15. Fusion Charts Info.
01:35
-
16. First Chart.
03:46
-
17. Fusion Charts API.
09:55
-
18. Fusion Charts – Configuration Options.
02:30
-
19. Fusion Charts – Pie Chart.
07:13
-
20. Calculate Most Used Language.
18:43
-
21. Fusion Charts – Responsive.
04:56
-
22. Fusion Charts – Doughnut Chart.
05:08
-
23. Calculate Most Popular Language.
08:00
-
24. Fusion Charts – Column and Bar Charts.
04:36
-
25. Stars and Forks – Functionality.
07:48
-
26. Search Component.
00:00
-
27. Requests.
00:00
-
28. Error.
07:14
-
29. Search User.
11:36
-
3. Starter Project
02:50
-
30. Loading Spinner
00:00
-
31. Repos and Followers.
08:59
-
32. Promise.allSettled().
12:57
-
33. Auth0 Info
01:36
-
34. Auth0 Setup.
13:27
-
35. Login – Logout.
00:00
-
36. Private Route.
10:15
-
37. Wrapper.
06:37
-
38. Local Storage.
02:57
-
39. Deploy Gotchas.
03:26
-
4. Setup Info.
10:03
-
40. Deploy Project.
07:09
-
5. React Router Setup.
06:51
-
6. React Router Error.
02:37
-
7. Error Page.
03:33
-
8. Login Page.
04:37
-
9. Context API.
08:45
-
1. Intro.
05:11
-
10. Sidebar.
09:09
-
11. Products Context Setup
18:12
-
12. Sidebar Toggle.
05:38
-
13. Hot Reloading Fix.
04:07
-
14. Error Page.
03:42
-
15. About, Checkout Page.
08:28
-
16. Home Page – Hero.
06:52
-
18. Home Page – Contact.
06:09
-
18. Home Page – Contact.
02:49
-
19. Formspree.
06:09
-
21. Fetch Products Overview.
00:00
-
22. Fetch Products Complete.
11:47
-
23. Featured Products.
12:00
-
24. Format Price
06:44
-
25. Fetch Single Product.
07:41
-
26. Single Product – Loading, Error.
11:22
-
27. Single Product – Base Return.
13:29
-
28. Single Product – Product Images.
13:13
-
29. Single Product – Stars (manual approach)
12:58
-
3. Starter Install.
03:14
-
30. Single Product – Stars (array approach)
06:33
-
31. Single Product – Add To Cart – Colors
12:56
-
32. Single Product – Add To Cart – Amount Buttons.
08:11
-
33. Filter Context Setup
12:48
-
34. Products Page – Grid View.
07:24
-
35. Products Page – List View.
09:04
-
36. Sort Component – Basic Setup.
09:10
-
37. Sort Component – View Buttons.
04:23
-
38. Sort Component – Controlled Input.
08:33
-
39. Sort Functionality.
15:36
-
4. Stater Overview.
11:30
-
40. Filters – Default Values
03:31
-
41. Filters – Text.
17:07
-
42. Filters – Unique Values.
10:03
-
43. Filters – Categories.
09:12
-
44. Filters – Companies
03:34
-
45. Filters – Colors.
11:05
-
46. Filters – Price.
04:52
-
47. Filters – Shipping and Clear Filters.
07:50
-
48. Filter Functionality – Setup and Text Input.
11:42
-
49. Filter Functionality – Rest of the Filters.
11:08
-
5. Styled Components – Basics.
15:19
-
50. Cart Context Setup.
03:38
-
51. AddToCart – Setup.
05:48
-
52. AddToCart Reducer – New Item.
06:33
-
53. AddToCart Reducer – Existing Item.
07:13
-
54. Cart Page Setup.
04:37
-
55. localStorage.
05:24
-
56. Cart Content.
03:45
-
57. Cart Columns.
02:35
-
58. Cart Totals.
03:43
-
59. Cart Item.
09:48
-
6. React Router – Setup.
16:07
-
60. Cart – Remove Item and Clear Cart.
04:49
-
61. Cart – Toggle Amount.
10:08
-
62. Cart – Calculate Totals.
05:19
-
63. Switch React Version.
07:34
-
65. Auth0 – Setup.
01:36
-
66. Auth0 – Provider.
05:27
-
67. useContext Setup.
06:55
-
68. Auth0 – LoginLogout Buttons.
03:38
-
69. Auth0 – Toggle Values.
07:44
-
7. Navbar.
13:27
-
70. Auth0 – Hide Checkout.
06:26
-
71. Auth0 – Private Route.
08:39
-
73. Install Extra Packages.
02:12
-
74. AuthWrapper.
11:41
-
75. Fix Warnings.
06:27
-
76. Stripe and Netlify Accounts.
03:27
-
77. Install and Setup netlify-cli.
11:03
-
78. First Netlify Function.
04:43
-
79. Stripe Checkout – Setup.
14:35
-
8. Cart Buttons.
06:54
-
80. Stripe Checkout – Imports.
12:23
-
81. Stripe Checkout – State Variables.
08:49
-
82. Stripe Checkout – Basic Return.
11:08
-
83. Netlify Function – create-payment-setup.
11:15
-
84. Stripe Checkout – Get Client Secret.
00:00
-
85. Stripe Checkout – Complete.
00:00
-
86. Deploy To Netlify
00:00
-
9. Footer.
00:00
-
10. More Actions.
02:14
-
11. More Complicated State.
06:25
-
12. Actions as Variables.
06:48
-
13. Separate Reducer.m
02:55
-
14. Refactor.
03:02
-
15. Provider Setup.
02:53
-
16. connect Navbar.
06:33
-
17. connect CartContainer.
05:35
-
18. dispatch – Clear Cart.
05:16
-
19. Switch Statement Syntax.
02:49
-
20. Reducer Setup.
01:43
-
21. REMOVE action setup.
04:40
-
22. REMOVE action complete.
08:24
-
23. INCREASE and DECREASE action setup.
03:43
-
24. INCREASE complete.
05:59
-
25. DECREASE complete.
05:10
-
26. GET_TOTALS action.
09:38
-
27. Refactor DECREASE.
03:42
-
28. TOGGLE_AMOUNT action.
07:08
-
29. Reducer Default State.
04:41
-
3. Setup Project.
05:28
-
30. Action Creators.
04:31
-
31. Redux Devtools
04:44
-
4. Quick Redux Info.
03:19
-
5. Store.
02:57
-
6. Reducer.
04:02
-
7. getState.
02:36
-
8. First Action.
05:09
-
9. Return and Action Bugs.
02:20