We may earn an affiliate commission when you visit our partners.
Course image
Udemy logo

React For The Rest Of Us

Brad Schiff

Learn the world's most popular library for creating user interfaces.

Read more

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 life

  • Use the modern "hook" approach with Function Components

  • Leverage React Router to create a Single Page Application with shareable URLs

  • See the power of Context, Reducer, and Immer and create an ideal way of working with state

  • Run 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 data

  • Deploy our app up onto the web so you can share it with your friends and family

This 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.

Enroll now

What's inside

Learning objectives

  • 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

Syllabus

Intro: The 10 Days of React
What Problem Does React Solve?
Let's Start Using React
What Is JSX?
Read more
Staying Organized: Components Using Other Components
Using Props To Make a Component Flexible
Looping Through An Array Within JSX
State
Handling Events (Like a Button Click etc...)
Working With Forms
What is UseEffect?
Getting Ready To Create a Real World App
Text Editor
Quick VS Code Settings
Node.js
Setting Up Our Workflow
Important Note About NPM Packages and The Zip Files in This Course
Let's Start Building Our App!
React & Next.js
Starting Our Complex App
Tip: Always Have The Current Year In The Footer
Routing (Single Page Application)
Quick Note About Rendering React Components To The DOM
React Developer Tools
Creating a Visual Studio Code Snippet
Create a Reusable "Container" Component
Quick Details & Composition
Working With a Real Back-End
Choosing The Right Approach For You
Getting a Database Ready
Solution to Common Database Problem
Note About a Common Misspelling
Running The Back-End
Optional Alternative: Simple Docker Back-End
Connecting the Front-End and Back-End
Quick Note About Debugging
Sending a Request From the Front-End
Access Form Field Values with React
Logging In
Render Different Components Depending on State
Persisting State (Local Storage)
Conditional Homepage Content
Create Post Screen
View Single Post Screen
Flash Messages
Leveling Up The Way We Approach State
Context
useReducer
A Powerful Duo: useReducer & Context
What is Immer?
useEffect Practice
Actually Building Our App
Profile Screen
Load Posts by Author
Make Single Post Screen Actually Load The Real Content
Animated Loading Icon
Cleaning Up After Ourselves (useEffect)
Markdown in React
Edit & Delete Post Actions
Adding Tooltips on Hover for Actions
Edit (Update) Post Component
Edit Post Continued
Client-Side Form Validation
Quick Attention To Detail Features
Delete a Post
Search Overlay
Setting Up Search Overlay
React Transition Group (CSS Transition)
Regarding The Index In The Next Lesson
Waiting for User To Stop Typing
Finishing Search (Part 1)
Finishing Search (Part 2)
Letting Users Follow Each Other
Follow User Feature
Profile Followers and Following Tabs
Homepage Post Feed
Building a Live Chat Feature
Live Chat User Interface
Sending & Receiving Chats (Part 1)
Sending & Receiving Chats (Part 2)
Finishing Chat
Registration Form Validation
Improving Registration Form
Finishing Registration Form (Part 1)
Quick Note About If Statement
Finishing Registration Form (Part 2)
Quick Flash Message Details
Proactively Check If Token Has Expired
Getting Ready To Go Live
React Suspense - Lazy Loading (part 1)
React Suspense - Lazy Loading (part 2)
Note About Suspense for Data Fetching
Building a "Dist" Copy of Our Site
React Outside of the Browser (Part 1)
React Outside of the Browser (Part 2)
Two Quick Notes
Pushing Our API Backend Server Up To The Web
Pushing Our React Front-End Up To The Web
Next.js Essentials
Next.js Isn't Scary (Part 1)

Good to know

Know what's good
, what to watch for
, and possible dealbreakers
Examines how to build user-friendly interfaces, giving learners an edge in modern web development
Builds a solid background in implementing and using React for front-end development, a foundational skill for the field
Emphasizes not only the technical implementation of React, but also the principles behind its usage, strengthening learners' understanding
Provides hands-on experience through the creation of a real-world social media application, allowing learners to apply their knowledge in a practical setting
Covers essential React concepts such as state management, routing, and API integration, equipping learners with a comprehensive understanding of the library
Taught by an experienced instructor with a strong reputation in the field, ensuring the quality and relevance of the course content

Save this course

Save React For The Rest Of Us to your list so you can find it easily later:
Save

Activities

Coming soon We're preparing activities for React For The Rest Of Us. These are activities you can do either before, during, or after a course.

Career center

Learners who complete React For The Rest Of Us will develop knowledge and skills that may be useful to these careers:
React Developer
React Developers specialize in using the React library to create user interfaces for websites and web applications. This course will teach you the core concepts of React, including state management, component lifecycle, and event handling. With this knowledge, you can become a proficient React Developer and create high-quality user experiences.
Full-Stack Developer
Full-Stack Developers are responsible for both the front-end and back-end of websites and web applications. This course will help you build a strong foundation in React, a key technology for front-end development. With this knowledge, you can combine front-end and back-end skills to create complete web applications.
Front-End Developer
As a Front-End Developer, your job is to create and maintain the user interfaces for websites and web applications. This course teaches you the fundamentals of React, a popular JavaScript library for building user interfaces. With this knowledge, you can create dynamic and interactive front-end experiences for users.
Web Developer
Web Developers are responsible for the design and development of websites and web applications. This course will help you build a strong foundation in React, a popular JavaScript library for front-end development. With this knowledge, you can create interactive and user-friendly websites and web applications.
User Experience (UX) Designer
UX Designers are responsible for the user experience of websites and web applications. This course will help you understand the principles of UX design and how to create user interfaces that are both visually appealing and easy to use. With this knowledge, you can collaborate with Front-End Developers to create websites and web applications that meet the needs of users.
Product Manager
Product Managers are responsible for the overall product vision and strategy. This course will help you understand the role of technology in product development and how to work with engineering teams to create successful products. With this knowledge, you can make informed decisions about product features and roadmap.
Software Engineer
Software Engineers design, develop, and maintain software systems. This course will help you build a strong foundation in React, a popular JavaScript library for front-end development. With this knowledge, you can use React to build complex and scalable software applications.
Data Scientist
Data Scientists use data to solve business problems. This course will help you understand the fundamentals of data analysis and how to use React to create interactive data visualizations. With this knowledge, you can communicate data insights more effectively and help businesses make better decisions.
Business Analyst
Business Analysts bridge the gap between business and technology. This course will help you understand the role of technology in business and how to use React to create data-driven solutions. With this knowledge, you can help businesses achieve their goals through technology.
Project Manager
Project Managers plan, execute, and close projects. This course will help you understand the principles of project management and how to use React to create project management tools. With this knowledge, you can manage projects more effectively and deliver results on time and within budget.
Marketing Manager
Marketing Managers develop and execute marketing campaigns. This course will help you understand the role of technology in marketing and how to use React to create interactive marketing content. With this knowledge, you can reach your target audience more effectively and achieve your marketing goals.
Sales Manager
Sales Managers lead and motivate sales teams. This course will help you understand the role of technology in sales and how to use React to create data-driven sales tools. With this knowledge, you can empower your sales team to close more deals and achieve their targets.
Customer Success Manager
Customer Success Managers build and maintain relationships with customers. This course will help you understand the role of technology in customer success and how to use React to create customer-facing applications. With this knowledge, you can provide excellent customer service and help customers achieve their goals.
Technical Writer
Technical Writers create and maintain technical documentation. This course will help you understand the principles of technical writing and how to use React to create interactive documentation. With this knowledge, you can help users understand complex technical concepts and products.
Teacher
Teachers educate students in various subjects. This course will help you understand the principles of teaching and how to use React to create interactive learning experiences. With this knowledge, you can make learning more engaging and effective for your students.

Reading list

We've selected 11 books that we think will supplement your learning. Use these to develop background knowledge, enrich your coursework, and gain a deeper understanding of the topics covered in React For The Rest Of Us.
Classic guide to JavaScript. It provides a deep understanding of the language and its core concepts. It great resource for anyone who wants to learn JavaScript or improve their understanding of the language.
This approachable and practical guide gives you a comprehensive introduction to React concepts fundamentals and best practices. It helpful resource for both beginners and advanced learners.
Provides a collection of practical recipes for building React applications. It covers a wide range of topics, from basic component development to advanced topics such as state management and performance optimization. It valuable resource for developers who want to learn how to build robust and scalable React applications.
Comprehensive guide to JavaScript. It covers the core concepts of the language and provides numerous examples and exercises to help you learn. It great resource for beginners and experienced developers alike.
Practical guide to building Node.js applications. It covers the core concepts of the platform and provides numerous examples and exercises to help you learn. It great resource for beginners and experienced developers alike.
Comprehensive guide to MongoDB. It covers the core concepts of the database and provides numerous examples and exercises to help you learn. It great resource for beginners and experienced developers alike.
Comprehensive guide to Redis. It covers the core concepts of the database and provides numerous examples and exercises to help you learn. It great resource for beginners and experienced developers alike.
Comprehensive guide to Kafka. It covers the core concepts of the platform and provides numerous examples and exercises to help you learn. It great resource for beginners and experienced developers alike.
Comprehensive guide to Elasticsearch. It covers the core concepts of the platform and provides numerous examples and exercises to help you learn. It great resource for beginners and experienced developers alike.
Provides a comprehensive guide to React Native. It covers topics such as building a navigation system, handling user input, and working with animations. It useful resource for those interested in developing mobile applications with React.
Provides a practical guide to building React applications. It covers topics such as component development, state management, and testing. It useful resource for developers who want to get started with React or learn how to build more complex React applications.

Share

Help others find this course page by sharing it with your friends and followers:

Similar courses

Here are nine courses similar to React For The Rest Of Us.
Collaborative Whiteboard with React Canvas and SocketIO
MERN Stack Front To Back: Full Stack React, Redux &...
Node with React: Fullstack Web Development
The Complete React Developer Course (w/ Hooks and Redux)
What Is React?
React Query / TanStack Query: React Server State...
React 18 with Create-React-App Playbook
React Native - The Practical Guide [2024]
React and Typescript: Build a Portfolio Project
Our mission

OpenCourser helps millions of learners each year. People visit us to learn workspace skills, ace their exams, and nurture their curiosity.

Our extensive catalog contains over 50,000 courses and twice as many books. Browse by search, by topic, or even by career interests. We'll match you to the right resources quickly.

Find this site helpful? Tell a friend about us.

Affiliate disclosure

We're supported by our community of learners. When you purchase or subscribe to courses and programs or purchase books, we may earn a commission from our partners.

Your purchases help us maintain our catalog and keep our servers humming without ads.

Thank you for supporting OpenCourser.

© 2016 - 2024 OpenCourser