The Complete MERN Stack Developer Course 2020

Learn how to declare variables in JavaScript using var and let, with for loop and function examples. See how let provides block scope and reduces errors.

Learn how the const keyword declares a constant variable, preventing any value changes after declaration and triggering errors when attempting reassignment, as demonstrated by the console output.

Compare traditional function declarations with arrow functions in JavaScript, learn their syntax, and see how single-statement arrow definitions can omit braces; React apps favor arrow functions.

Explore iterating arrays with the traditional for loop and the for...of loop, printing values to the console, and compare their syntax using numbers and languages examples.

Learn how template literals in JavaScript replace concatenation by using backticks and ${num} to embed variables, producing the same output without the concatenation operator.

This lecture demonstrates using the spread operator to add elements at the start or end of an array, replacing traditional push and unshift methods with a single syntax.

Explore React, an open source JavaScript library developed by Facebook for building user interfaces, and its single page application approach using components that update data without reloading.

Discover what a component is in React, a reusable building block that powers single-page applications from products to item details and checkout.

Master JSX overview by learning how JavaScript and XML combine to create React components, render content in a single file, and compare JSX rendering with the traditional method.

Create a new React application with create react app, run it locally, and print hello world by editing the source file; observe automatic reloading and the local server at localhost:3000.

Explore the React app project structure: node_modules, public, and src folders. See how index.css, component styles, manifest, service worker, and package.json define styling and dependencies.

Discovers how to debug a React application by tracing the execution flow, identifying the first executing files, and preserving core files while rendering the root and boards components.

Explore React components as the building blocks of apps, covering class components (stateful) and functional components (stateless), their definitions, and rendering basic hello world examples.

Learn to build a React class component by importing React and Component, extending React.Component, implementing render to return hello world, exporting the class, and rendering it in the app.

Explore functional components by rendering hello world in a React app, converting from a class component, defining and exporting a function, and composing it within a parent component.

Explore building reusable React components by creating a parent and a child component, exporting and importing them, and rendering them together in a simple hello world app.

Explore how class components hold state in React by initializing this.state in the constructor and rendering state-driven content such as player and country, contrasting with functional components.

Learn how to declare and update state in a class component using setState, with a button that changes country from America to Australia and language from English to French.

Demonstrate how props enable communication between parent and child components in class components, showing how to pass language and framework data from parent to child and render it.

Learn how to use props in functional components, pass data from a parent to child, and read multiple props (such as country and game) without using this, with practical examples.

Learn event handling in React class components by wiring onClick, onChange, and onMouseOver to buttons and inputs, triggering alerts and dynamic user interface changes.

Explore event handling in both functional and class components in React, including creating a class component, defining arrow functions, and wiring button clicks, input changes, and mouseover alerts.

Learn to apply inline styling in React using the style attribute, set color and background color with two curly braces, and preview the output before moving to local styling.

Learn to implement local css in a react app by creating per-component stylesheets, importing them into components, and applying styles with class names or tag selectors to customize individual components.

Learn to manipulate CSS in react by using a class component with state to dynamically change text color and background color via buttons, demonstrating inline styling and this.setState.

Develop a counter app in React using a class component, manage state to increment and decrement a displayed number with two buttons, and run the app on localhost 3000.

Explains class component lifecycle methods, focusing on componentDidMount and componentWillMount, which are called automatically during rendering, with practical demonstrations in a React class component.

Explore react hooks like useState and useEffect to add state and lifecycle features to functional components. Learn basic import patterns and extensions that speed up hook usage in development.

Demonstrates the useState hook in functional components by declaring a state variable (player) with an update function and changing the string value and a numbers array via a button.

Explore how the useEffect hook in functional components runs automatically as a lifecycle method to respond to state changes, such as updating language from Java to JavaScript using useState.

Explore manipulating CSS in functional components with hooks in React, creating a home component, managing color and background color with hooks, and updating styles via a button.