React Fundamentals ES6 and API – Build a Rock Solid News App

React Fundamentals ES6 and API – Build a Rock Solid News App

English | MP4 | AVC 1280×720 | AAC 48KHz 2ch | 3 Hours | 912 MB

Learn and understand Core React Fundamentals ES6 and API. Build and deploy a Rock Solid News App along the way.

Welcome to learn and understand core React fundamentals, along with new and exciting features of ES6 and solid API concepts.

I am Ryan, A self taught developer. I have been in your place and I know exactly what you expect from a course like this.

React eco-system is huge. Understanding react is a single most important skill you will need in the current job market. This course prepares you for that.

By the end of this course, you will be confident to use react for your next project. you will also build the next level… lightning fast …news app using react that takes advantage of all the best tools react has to offer.

This course is divided in 3 major section.

The first section gives you a solid understanding of React.

Topics included:

  • Zero configuration setup and google chrome extension for react
  • React components and JSX
  • Unidirectional data flow in react
  • Synthetic events and binding methods in react
  • Controlled components, composable components and reusable components
  • Functional stateless components
  • Managing states and props in react
  • Higher order functions
  • ES6 let, const, object keys and this keyword, destructuring, arrow functions, class constructors
  • Code refactoring using ES6
  • React bootstrap styling

The second section prepares you to use real data from the API in your app.

Topics included:

  • Lifecycle methods in react
  • Fetch real data from API
  • Server side search
  • Client side caching
  • Proptypes, refs, Import and export in react
  • ES6 template strings, spread operator, object assign, conditional rendering

The third section focuses on code organization, refactoring and advance concepts.

Topics included:

  • Higher order components
  • Lodash utility library
  • Advance sorting
  • Active links
  • Lifting state
  • React router
  • Deploy to github pages
Table of Contents

Installation and folder structure
1 Getting started with react via CDN
2 Zero configuration setup using create react app
3 Introduction to folder structure
4 Useful links for further studying reference and source code

Core React fundamentals with ES6
5 What is class in react
6 Create your first react component
7 What is special about const
8 Complex javascript in JSX
9 Object key and import export
10 ES6 arrow function
11 Class constructor
12 Setting up local state with constructor
13 This keyword console and react chrome extension
14 Adding onclick event and binding methods
15 Unidirectional data flow updating the state
16 Code refactoring using ES6
17 Synthetic events to get user input
18 Higher order function search implementation
19 ES6 destructuring
20 Destructuring and controlled component
21 Splitting components using props
22 Splitting components using props part two
23 Composable components
24 Reusable components
25 Different ways of creating components
26 Functional stateless component
27 Using react bootstrap package
28 Useful links for further studying reference and source code

Styling with React Bootstrap
29 Styling form
30 Styling searchbox
31 Styling the table component
32 Useful links for further studying reference and source code

API Server side search Client side caching and more
33 Lifecycle methods in react
34 Template strings to build fetch url
35 Fetch the real news from api
36 ES6 spread operator
37 Object assign vs spread operator
38 Conditional rendering
39 Server side search implementation
40 Load more button to fetch more data from api
41 Styling and adjustments
42 Adding new data with old data
43 Fetch hits per page from api
44 Client side cache
45 Remove item using searchKey
46 Lightning fast page load using local state
47 Fixing layout
48 Useful links for further studying reference and source code

Code organization and Refactoring
49 Import export constants
50 What is prop types in react
51 Explict proptypes
52 Refs and the DOM
53 IsLoading indicator
54 Useful links for further studying reference and source code

Higher order components and Advance sorting
55 Higher order components
56 Sorting with lodash
57 Sort by on each click
58 Styling sort buttons
59 Reverse sorting
60 Active sort button
61 Useful links for further studying reference and source code

Lifting state
62 Converting to class component
63 Lifting the state
64 Set state using function
65 Passing function to set state
66 Higher order function to set state
67 Useful links for further studying reference and source code

Managing Components
68 Moving components to seprate folders part one
69 Moving components to seprate folders part two
70 Useful links for further studying reference and source code

React router
71 React router dom
72 Component based navigation system
73 Active navigation link
74 Useful links for further studying reference and source code

Depoly to Github pages
75 Deploy to github pages
76 Useful links for further studying reference and source code

How to use source code and install app locally
77 How to use source code and install app locally
78 Useful links for further studying reference and source code