ReactJs 2018, the complete guide with real world projects

ReactJs 2018, the complete guide with real world projects

English | MP4 | AVC 1280×720 | AAC 44KHz 2ch | 13.5 Hours | 6.63 GB

Become job ready by building real world projects using the most popular frontend framework

ReactJS is one of the most in-demand javascript frameworks, and its popularity keeps rising as more companies begin to adopt it. . It keeps getting popular, and there’s no better time to add it to your portfolio. This course is the cumulation of everything you need to become a professional React developer.

Redux is a state management library and is very popular in the world of frontend development. In this course, you’ll not just learn how to use Redux independently with vanilla Javascript, but you’ll master the art of using this state management library hand in hand with React.

This course starts from the very basics, explaining exactly what React and Redux are, when and how to use it. The problem with most of the React community is lack of understanding of the fundamental principles. This course focuses on providing a very deep understanding of React and Redux.

Thereafter, we’ll go all the way from basic to advanced. We’ll not just scratch the surface but dive deeply into React as well as popular libraries like React Router, and Redux Thunk.

By the end of the course, you’ll be able to build almost any sort of single page application.

What will you build?
This course uses a project driven approach, which means you will learn by doing. In every single lesson, you’ll learn something new, while building on real-world projects.

  • Customisable copyrighting component with ReactJS
  • Basic number counter component with ReactJS
  • Complete todos manager application with ReactJS
  • Alert customisable components with Higher order components (ReactJS)
  • Complete full-stack blog with ReactJS
  • A todos application with redux and vanilla javascript
  • Forum application with ReactJS and Redux
  • What should you bring to succeed in this course?

A basic understanding of HTML, CSS, and Javascript are required to succeed in this course.

What will you learn?

  • How to build an deploy real-world applications with React and Redux
  • Frontend state management with redux
  • Single page application routing with React router.
  • Asynchronous server communication in React / Redux applications using redux thunk.
  • Debugging React / Redux applications
  • Building powerful, fast and user-friendly reactive web applications.
Table of Contents

How to get the source code for each project
1 How to get the source code for each project.

Introduction
2 Creating first react element
3 Changing component state
4 Understanding state and rendering in react js
5 Introducing conditional rendering in react applications
6 Introduction to JSX
7 Creating react components
8 Styling JSX
9 Customising components with props
10 Mounting components in components
11 Introducing react class components
12 The basics of event handling
13 Introduction to component state

Setting up a webpack project from scratch
14 Installing webpack
15 Installing babel compiler
16 Setup development server
17 Install react and react dom

Build a complete CRUD application with ReactJS
18 Install CREATE REACT APP
19 Updating todos II
20 Updating todos III
21 Fix add todo bug
22 Refactoring to List-item component
23 Adding alert notifications
24 Disabling button conditionally
25 Creating mock api online
26 Installing axios
27 Introducing life cycle hooks
28 Creating todos on api
29 Understanding how the default app works
30 Deleting todos
31 Updating todos
32 Add loading state to app
33 Deploy application to netlify
34 Setting up our todos list
35 Displaying list items in react
36 Array keys in reactjs
37 Two way binding in react js
38 Creating todos
39 Deleting todos
40 Updating todos

Routing react applications with React Router 4
41 Initial install
42 The login component
43 Single article component
44 Clean up
45 Setting up react router
46 Navigating pages with react router Link component
47 Structuring our blog template
48 Migrating static html to react app
49 The footer component
50 The article component
51 The create article component
52 Refactoring banner component

A deeper understanding React concepts and design patterns
53 Reusable UI components
54 When props are not the best choice (change this title)
55 Component prop types
56 Stateful and stateless components
57 Child to parent component communication
58 Higher order components

Build a full stack Blog with ReactJS
59 Hide navbar and footer on auth pages
60 Updating authenticated user state after sign up
61 Refactoring sign up component
62 Refactoring sign up component II
63 Refactoring sign up component III
64 Refactoring sign up component IV
65 Introducing Eslint
66 Installing babel-eslint-parser
67 The login component
68 Logging in users
69 Login cleanup
70 User registration
71 The create article component
72 Displaying categories list
73 Uploading image to cloudinary
74 Creating article to api
75 Displaying create article validation errors
76 Displaying a list of articles
77 Paginating article results
78 Displaying single article
79 Optimising for better performance
80 Securing authenticated endpoints
81 Basic user validation
82 Redirect if authenticated
83 Display auth user articles
84 Deleting articles
85 Editing articles
86 Editing articles 2
87 Editing articles 3
88 Fix update article bug
89 User logout functionality
90 Adding toast notifications
91 Cleaning up proptype errors
92 User password confirmation
93 Installing a wysiwyg editor
94 Rendering HTML in react
95 Deploying to heroku
96 Pending features
97 Displaying validation errors
98 Customising error messages
99 Making api requests to server
100 User login sessions
101 Single state source in react applications

STATE MANAGEMENT WITH REDUX
102 Introducing redux
103 Creating first redux store
104 Dispatching actions
105 Subscribing to redux state
106 Simple todo app with redux
107 Introducing action creators
108 Redux middleware

Build a complete forum with REACT-REDUX
109 Setup application
110 Introducing combined reducers
111 Displaying threads on home screen
112 Paginating threads
113 Handling component loading state with redux
114 Implementing loading state for channels
115 Refactoring to thread component
116 Display single thread
117 Rendering single thread
118 The thread replies
119 Displaying replies
120 Installing redux and creating first store
121 Introduction to redux form
122 Handle login functionality
123 Redux dev tools
124 Introduction to the connect api
125 Dispatching actions from components
126 Introducing asynchronous action creators
127 Displaying channels
128 Saving threads to redux store
129 Handling GET THREADS action in reducer