React For The Rest Of Us

React For The Rest Of Us

What you’ll learn

The problem React solves and *why* we should use it (aside from “because it’s popular”)
How to create Single Page Applications with React
The ability to keep your code organized and manageable
How to seamlessly pull real and dynamic data into your front-end

Requirements

A basic understanding of HTML (e.g. “p” is for paragraph, “h1” is for headline, etc…)
You could likely work through this course even without any JavaScript experience given the reasonable pace of lessons, but at least a tiny bit of JavaScript familiarity is recommended and will result in a much more enjoyable experience
No CSS knowledge required (although it helps to understand that CSS is used to add style & design to a page)

Description

Learn the world’s most popular library for creating user interfaces!What makes this course different is we take the time to understand *why* we’re doing what we’re doing. We begin by asking an important question that so many other React courses skip entirely; What problem does React solve?Once we understand what React is and isn’t, we spend the remainder of the course together building the front-end for a real world social media app where you can post, follow other users and even hop into a live chatroom. Along the way we will:Understand what “state” is in React and how to bring our interfaces to lifeUse the modern “hook” approach with Function ComponentsLeverage React Router to create a Single Page Application with shareable URLsSee the power of Context, Reducer, and Immer and create an ideal way of working with stateRun code at the perfect moments by understanding the power of useEffect()Use async HTTP requests to communicate with APIs so that our app feels meaningful by working with real dataDeploy our app up onto the web so you can share it with your friends and familyThis course may be brand new, but this isn’t my first time teaching. I’ve led training sessions for Fortune 500 companies and I’ve already helped over 98,000 people on Udemy and received the following feedback:”Brad definitely has some of the best techniques to embed the lesson into your mind… hands down these are the best tutorials I have had the opportunity to view.””Presentation is concise without being tedious… you honestly feel that you have a thorough understanding of the subject.””…[Brad] explained the process. Not memorize this or that, he explained the process. If you’re looking to take a course to understand the foundations of creating websites, look no further.”Become highly valuable and relevant to the companies that are hiring front-end developers; in one convenient place alongside one instructor. If you’re ready to begin building with React – I’ll see you on the inside!

Overview

Section 1: Intro: The 10 Days of React

Lecture 1 What Problem Does React Solve?

Lecture 2 Let’s Start Using React

Lecture 3 What Is JSX?

Lecture 4 Staying Organized: Components Using Other Components

Lecture 5 Using Props To Make a Component Flexible

Lecture 6 Looping Through An Array Within JSX

Lecture 7 State

Lecture 8 Handling Events (Like a Button Click etc…)

Lecture 9 Working With Forms

Lecture 10 What is UseEffect?

Section 2: Getting Ready To Create a Real World App

Lecture 11 Text Editor

Lecture 12 Quick VS Code Settings

Lecture 13 Node.js

Lecture 14 Setting Up Our Workflow

Lecture 15 Important Note About NPM Packages and The Zip Files in This Course

Section 3: Let’s Start Building Our App!

Lecture 16 Starting Our Complex App

Lecture 17 Tip: Always Have The Current Year In The Footer

Lecture 18 Routing (Single Page Application)

Lecture 19 Quick Note About Rendering React Components To The DOM

Lecture 20 React Developer Tools

Lecture 21 Creating a Visual Studio Code Snippet

Lecture 22 Create a Reusable “Container” Component

Lecture 23 Quick Details & Composition

Section 4: Working With a Real Back-End

Lecture 24 Choosing The Right Approach For You

Lecture 25 Getting a Database Ready

Lecture 26 Solution to Common Database Problem

Lecture 27 Note About a Common Misspelling

Lecture 28 Running The Back-End

Lecture 29 Optional Alternative: Simple Docker Back-End

Section 5: Connecting the Front-End and Back-End

Lecture 30 Quick Note About Debugging

Lecture 31 Sending a Request From the Front-End

Lecture 32 Access Form Field Values with React

Lecture 33 Logging In

Lecture 34 Render Different Components Depending on State

Lecture 35 Persisting State (Local Storage)

Lecture 36 Conditional Homepage Content

Lecture 37 Create Post Screen

Lecture 38 View Single Post Screen

Lecture 39 Flash Messages

Section 6: Leveling Up The Way We Approach State

Lecture 40 Context

Lecture 41 useReducer

Lecture 42 A Powerful Duo: useReducer & Context

Lecture 43 What is Immer?

Lecture 44 useEffect Practice

Section 7: Actually Building Our App

Lecture 45 Profile Screen

Lecture 46 Load Posts by Author

Lecture 47 Make Single Post Screen Actually Load The Real Content

Lecture 48 Animated Loading Icon

Lecture 49 Cleaning Up After Ourselves (useEffect)

Lecture 50 Markdown in React

Section 8: Edit & Delete Post Actions

Lecture 51 Adding Tooltips on Hover for Actions

Lecture 52 Edit (Update) Post Component

Lecture 53 Edit Post Continued

Lecture 54 Client-Side Form Validation

Lecture 55 Quick Attention To Detail Features

Lecture 56 Delete a Post

Section 9: Search Overlay

Lecture 57 Setting Up Search Overlay

Lecture 58 React Transition Group (CSS Transition)

Lecture 59 Regarding The Index In The Next Lesson

Lecture 60 Waiting for User To Stop Typing

Lecture 61 Finishing Search (Part 1)

Lecture 62 Finishing Search (Part 2)

Section 10: Letting Users Follow Each Other

Lecture 63 Follow User Feature

Lecture 64 Profile Followers and Following Tabs

Lecture 65 Homepage Post Feed

Section 11: Building a Live Chat Feature

Lecture 66 Live Chat User Interface

Lecture 67 Sending & Receiving Chats (Part 1)

Lecture 68 Sending & Receiving Chats (Part 2)

Lecture 69 Finishing Chat

Section 12: Registration Form Validation

Lecture 70 Improving Registration Form

Lecture 71 Finishing Registration Form (Part 1)

Lecture 72 Quick Note About If Statement

Lecture 73 Finishing Registration Form (Part 2)

Lecture 74 Quick Flash Message Details

Lecture 75 Proactively Check If Token Has Expired

Section 13: Getting Ready To Go Live

Lecture 76 React Suspense – Lazy Loading (part 1)

Lecture 77 React Suspense – Lazy Loading (part 2)

Lecture 78 Note About Suspense for Data Fetching

Lecture 79 Building a “Dist” Copy of Our Site

Lecture 80 React Outside of the Browser (Part 1)

Lecture 81 React Outside of the Browser (Part 2)

Lecture 82 Two Quick Notes

Lecture 83 Pushing Our API Backend Server Up To The Web

Lecture 84 Pushing Our React Front-End Up To The Web

Section 14: Concurrent React

Lecture 85 Understanding Concurrency

Section 15: Extra Credit Ideas / Challenges

Lecture 86 Welcome To The Extra Credit Section

Lecture 87 Profile Not Found Situation

Lecture 88 Login Form: Highlight Empty Fields With Red Border

Lecture 89 Allow For Other Color of Flash Messages (Not Only Green)

Anyone who wants to create user interfaces using the most popular and in-demand library in the world today.

Course Information:

Udemy | English | 16h 24m | 9.32 GB
Created by: Brad Schiff

You Can See More Courses in the Developer >> Greetings from CourseDown.com